2014-11-06 31 views
0

我想使用Disqus评论系统作为基于bootstrap/html5模板的婚礼网站上的留言。我如何隐藏通过CSS的Disqus的社交分享

由于网站上的内容是个人的,我想删除评论框上方以及每个单独评论下方的Facebook,Twitter等共享链接。

截图这里,http://imgur.com/pkvUSoF

有没有办法通过隐藏在CSS的共享元素来实现这一目标?

我了解新的Disqus使用iframe,但是隐藏Disqus页脚linked here和下面的CSS代码确实有效。

#disqus_thread{ 
    position: relative; 
} 
#disqus_thread:after{ 
    content: ""; 
    display: block; 
    height: 55px; 
    width: 100%; 
    position: absolute; 
    bottom: 0px; 
    background:white; 
} 

使用Chrome中的 '检查元素',我可以使用隐藏共享元素 '显示:无'

.nav-secondary>ul>li.share-menu { 
float: right; 
display: none; 
} 

.post-content footer .share { 
position: relative; 
display: none; 
} 

谁能帮我正确的代码/语法将其添加到我的styles.css中以隐藏“社交共享”按钮。

谢谢!

+0

你不能。 Disqus小部件加载到iframe中,使其无法访问您的CSS。该文档还指出,这些元素不能被删除:https://help.disqus.com/customer/portal/articles/545277-disqus-appearance-tweaks您链接到的关于隐藏页脚的线程仅仅是放置一个元素在您自己的页面内的iframe顶部。 – Turnip 2014-11-06 16:57:22

+1

感谢您的及时回复。类似的元素可以放在分享按钮上吗? – Roger 2014-11-06 17:05:57

回答

0

正如文章中所述,这是不可能的。 https://help.disqus.com/customer/portal/articles/545277

原因:它使用iframe来渲染意见,以防止XSS

即使我不建议你这样做,但有一种方法可以做到这一点。

请先阅读terms and conditions然后再做任何这样的事情。

<div id="disqus_thread"><div> 

    <style> 
    .hide-social-discuss { 
     background: white; // change color according to your site back. 
     height: 20px; 
     position: relative; 
     width: 80%; 
     top: -60px; 
    } 
    <script> 
     //add this to script 
     $("#disqus_thread").append("<div class='hide-social-discuss'></div>") 
    </script>