Integrate Disqus Comment System into Your WordPress Site

How to add disqus to wordpress; Install disqus comment system wordpress; Disqus plugin setup wordpress; Integrate disqus comments wordpress; Disqus comment system wordpress tutorial; Use disqus for wordpress comments; Disqus installation guide wordpress; Replace wordpress comments with disqus; Disqus comment system wordpress integration; Setup disqus on wordpress site;

Explanation

To swap out the default WordPress comment system with Disqus, you'll need to follow a few simple steps. This code helps you do just that by integrating Disqus seamlessly into your WordPress site.

Here's what the code does:

  • It checks if you're on a single post or page. If you are, it replaces the default WordPress comments with Disqus.
  • You'll need to replace 'your-disqus-shortname' with your actual Disqus shortname. This is a unique identifier for your Disqus account.
  • The code sets up Disqus to load on your pages by embedding a script that pulls in the Disqus comment system.
  • It also ensures that the Disqus comment count script is loaded in the footer of your site, which helps display the number of comments on your posts.

Once you've added this code, Disqus will handle all your commenting needs, providing a more interactive and engaging experience for your visitors. Just make sure JavaScript is enabled in your visitors' browsers, as Disqus relies on it to display comments.

Code

// Function to integrate Disqus comment system into WordPress
function wp_dudecom_add_disqus_comments() {
    // Check if we are on a single post or page
    if (is_single() || is_page()) {
        // Replace the default WordPress comments template with Disqus
        remove_filter('comments_template', 'wp_comments_template');
        add_filter('comments_template', 'wp_dudecom_disqus_comments_template');
    }
}

// Custom function to load Disqus comments template
function wp_dudecom_disqus_comments_template($comment_template) {
    // Ensure Disqus shortname is set
    $disqus_shortname = 'your-disqus-shortname'; // Replace with your Disqus shortname

    // Output Disqus embed code
    echo '<div id="disqus_thread"></div>';
    echo '<script>';
    echo 'var disqus_config = function () {';
    echo 'this.page.url = "' . get_permalink() . '";'; // Set the page URL
    echo 'this.page.identifier = "' . get_the_ID() . '";'; // Set the page identifier
    echo '};';
    echo '(function() {'; // Load the Disqus embed script
    echo 'var d = document, s = d.createElement("script");';
    echo 's.src = "https://' . $disqus_shortname . '.disqus.com/embed.js";';
    echo 's.setAttribute("data-timestamp", +new Date());';
    echo '(d.head || d.body).appendChild(s);';
    echo '})();';
    echo '</script>';
    echo '<noscript>Please enable JavaScript to view the comments powered by Disqus.</noscript>';

    // Return an empty string to prevent loading the default comments template
    return '';
}

// Hook the function to the appropriate WordPress action
add_action('wp', 'wp_dudecom_add_disqus_comments');

// Ensure Disqus comments count script is loaded in the footer
function wp_dudecom_disqus_comments_count_script() {
    $disqus_shortname = 'your-disqus-shortname'; // Replace with your Disqus shortname
    echo '<script id="dsq-count-scr" src="https://' . $disqus_shortname . '.disqus.com/count.js" async></script>';
}

// Hook the comments count script to wp_footer
add_action('wp_footer', 'wp_dudecom_disqus_comments_count_script');

Instructions

File Location: Add the following code to your theme's functions.php file or a custom plugin file.

Prerequisites:

  • Create a Disqus account if you don't have one.
  • Obtain your Disqus shortname from your Disqus account settings.

Implementation Steps:

  1. Open your WordPress admin panel and navigate to Appearance > Theme Editor or use an FTP client to access your theme files.
  2. Locate and open the functions.php file of your active theme.
  3. Copy and paste the provided code into the functions.php file.
  4. Replace 'your-disqus-shortname' with your actual Disqus shortname in the code.
  5. Save the changes to the functions.php file.
  6. Visit a single post or page on your site to ensure Disqus comments are displayed instead of the default WordPress comments.

If you encounter any issues or need further assistance, consider reaching out to wp-dude.com for expert help with implementation or advanced functionality.