I discovered DISQUS a few days ago and tried to work with it on my local Orchard playground. The process of adding DISQUS to the featured blog was as easy as some clicks. There’s a module, you install it and disable the internal commenting system and it’s done. Based on the fact that I’m working on a site with Persian language as the primary content language, adding DISQUS needed a little tweak.
The threaded comments view are originally left to right. Ok, it’s the default for everything; almost every language is left to right except Persian, Hebrew, Arabic and Urdu from what I recall. So what if I want to have the threaded comments in my Persian website to look really right to left? In general terms you can find the best guidelines and tops and tricks on rtl-this.com. But what DISQUS does generating threaded comments needs attention.
Here are the possible actions one can take:
- DISQUS supports custom CSS. You can find the appropriate stylesheet classes and override them in “Appearance” menu in DISQUS admin panel. Make sure to put a !important at the end of each attribute.
- Alternatively you can add jQuery scripts on your site template to work this solution out on the client side. A partial approach looked like what you see in the following
// Find all li's which are children of the main comments part
// and reverse the left and right margines.
$("#dsq-comments > li").each(
function(){
var l = $(this).css("margin-left");
$(this).css("margin-right", l);
$(this).css("margin-left", "0px");
} );
// This list could continue...
$(".dsq-comment-message").css("text-align", "right");
$(".dsq-comment-message").css("direction", "rtl");
$(".dsq-comment-footer").css("direction", "rtl");
$(".dsq-comment-header").css("direction", "rtl");
I check the above script in FireBug and it worked so I just added this to my local site. I will be blogging more about this. Meanwhile I ask the DISQUS team to find a workaround for this RTL issue for such languages. Sometimes margin-left’s should change to margin-right’s.
nexTThought 