Community Forums › Forums › Archived Forums › Design Tips and Tricks › What am I doing wrong with this Javascript + Genesis?
Tagged: disqus
- This topic has 2 replies, 2 voices, and was last updated 8 years, 3 months ago by
lvvvvvl.
-
AuthorPosts
-
June 9, 2015 at 3:37 am #155552
lvvvvvl
ParticipantHello,
I'm trying to load Disqus lazily using javascript I found on a website which I've tried inserting in my header and footer afterwards:
<script type="text/javascript"> var comments = document.getElementsByClassName('comments')[0], disqusLoaded=false; function loadDisqus() { var disqus_shortname = 'disqus_shortname'; var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); disqusLoaded = true; } //Get the offset of an object function findTop(obj) { var curtop = 0; if (obj.offsetParent) { do { curtop += obj.offsetTop; } while (obj = obj.offsetParent); return curtop; } } if(window.location.hash.indexOf('#comments') > 0) loadDisqus(); if(comments) { var commentsOffset = findTop(comments); window.onscroll = function() { if(!disqusLoaded && window.pageYOffset > commentsOffset - 1500) { console.log('load comments, NOW!!'); loadDisqus(); } } } </script>
And the following in my functions:
/*** Disqus Comment for Genesis Framework ***/ remove_action( 'genesis_comments', 'genesis_do_comments' ); add_action('genesis_comments', 'wpa_disqus_comments' ); function wpa_disqus_comments() { if ( is_single() ) { ?> <div class="comments"></div> <?php } }
But it doesn't seem to call the embed.js file to load the disqus shortname I modified in the javascript. What am I doing wrong?
June 10, 2015 at 2:36 am #155694James
Participanthey there
in order to include any script on a site you need to use 'wp_enqueue_script'
for example you can add this to your functions.php
add_action( 'wp_enqueue_scripts', 'jm_enqueue_disqus_scripts' ); function jm_enqueue_disqus_scripts() { wp_enqueue_script( 'disqus-script', get_bloginfo( 'stylesheet_directory' ) . '/js/disqus.js', array( 'jquery' ), '1.0.0', true ); }
and add your script 'disqus.js' to a folder 'js' in your theme directory.
this will then call your script on every page.
June 10, 2015 at 3:56 am #155701lvvvvvl
ParticipantHey mate,
Thank you for the suggestion. I successfully enqueued the script on every page but unfortunately I'm still having the same problem. I can see in the source the disqus.js is loaded, and in the genesis_comments the <div identifier is replacing the comments but the disqus embed just won't load up and displays blank.
I've even tried replacing the getElement to document.getElementById('disqus_thread') so I could use the default <div id="disqus_thread" data-disqus-url="<?php the_permalink(); ?>"></div> with no success.
Maybe it's something wrong with the javascript itself.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.