2014-11-06 68 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>