Knowledge Base


Knowledge Base / XFilesharing Pro / How to ...

Tutorial: How to replace comments system with Facebook or Disqus comments

05/28/2012 11:00 PM
Question

Answer

Note :

* Backup your files before doing any changes.
* All files we will modify are located in the front-end server not in files servers.

Disqus Setup :

1- open the HTML file download1.html with your favorite editor, the file is located in cgi-bin/Templates folder.

2- Search the following line :
<script language="JavaScript" type="text/javascript" src="<TMPL_VAR site_url>/tabber.js"></script>

Above it you will find the following code, we are going to replace it with the Disqus code:
<TMPL_IF enable_file_comments>
<br>
<div style="width:500px;text-align:left;" class="sinput">
<TMPL_INCLUDE comments.html>
</div>
</TMPL_IF>

3- Follow this link ro register with Disqus and get your Disqus shortname : http://disqus.com/comments/register

4- Replace the code we found in Step 4 with the following code:

<br/>
<div style="width:500px;text-align:left;" class="sinput">
<div id="disqus_thread"></div>
</div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'YOUR-SHORT-NAME';
var disqus_identifier = '<TMPL_VAR file_code>';
var disqus_url = '<TMPL_VAR download_link>';

/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>


Replace in the code YOUR-SHORT-NAME with your Disqus Short Name.

5- Upload & Enjoy

Facebook Setup :

1- Open the HTML file main.html with your favorite editor, the file is located in cgi-bin/Templates folder.

2- For XFS 2.0

Search :
<html>

Replace it with:
<html xmlns:fb="http://ogp.me/ns/fb#">

For other versions:

Search:
<HTML xmlns="http://www.w3.org/1999/xhtml">

Replace it with:
<HTML xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="http://www.facebook.com/2008/fbml">

3- After this code:
<BODY<TMPL_IF lang_rtl> style="direction:rtl;"</TMPL_IF>>

Add :
<script src="http://connect.facebook.net/en_US/all.js#appId=134155236625778&amp;xfbml=1"></script>
<div id="fb-root"></div>

4- Save & Upload

5- Open the HTML file download1.html with your favorite editor, the file is located in cgi-bin/Templates folder.

6- Search the following line :
<script language="JavaScript" type="text/javascript" src="<TMPL_VAR site_url>/tabber.js"></script>


Above it you will find the following code, we are going to replace it with the Facebook Comments code:

<TMPL_IF enable_file_comments>

<br>

<div style="width:500px;text-align:left;" class="sinput">

<TMPL_INCLUDE comments.html>

</div>

</TMPL_IF>

7- Replace the code we found in Step 6 with the following code:

<br/>
<div style="width:500px;text-align:left;" class="sinput">
<fb:comments href="<TMPL_VAR download_link>" num_posts="10" width="500"></fb:comments>
</div>

8- Save & Upload.


That's All.