Jump to content

Archived

This topic is now archived and is closed to further replies.

ketri

How to add a script (loaded from child-theme folder) and inline javascript to the footer properly?

Recommended Posts

ketri    7
ketri

Hello!

What is the best way to achieve this? 

If I wan to add a  anything.js script file to the footer, and add some inline javascript (to for example load the js plugin I just inserted), how should I do this?

Should I just add them to the footer.php?

What if I want a custom-made section to insert them in the footer?  Most of the time they need to be loaded after jQuery, and often it's also best if they're after the site content. 

 

I can load a script with:

function section_styles(){
// This will load the 'cooljavascript.js' file from the current section folderwp_enqueue_script( 'my-js-plugin', $this->base_url.'/cooljavascript.js', array( 'jquery' ), PL_CORE_VERSION, true );}

But how to initalize the plugin I just loaded?

 

I also want them to be in my project under git and/or in the specific section that needs the script and initialize it, I don't want them i.e with Hooker so it's in the database. 

So can I use some hook in my functions.php? 
Also, can I use hooks to insert js or other things to the site in custom made functions?

Thanks!

Share this post


Link to post
Share on other sites
ketri    7
ketri

What if my scripts are linked with a section?

For example I'd like to load masonry.js with a section that gets posts and uses masonry on them? 
Can I use hooks in sections?

 

 

Hi,

 

You can use hooks in your functions.php file, that is the primary reason for a functions.php file. You should use the Wordpress enqueue.

 

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there,

 

If you activate the actionmap plugin which comes within the Pro Tools plugin this will show you all the hooks on the page, inside of each main area/section etc. Usually each section will have 4 hooks inside it. The action map plugin will show you where these hooks are positioned on each page, then you can use the one closest to the area you require to position your script to activate.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

  • Similar Content

    • cas45
      By cas45+
      I am running a site based on PageLines Framework 2.5.0. I am making some changes to a current website and managed to find a script that will do what I want.:
       
      $(".vend-cat").each( function() {
          if ( $(this).find(".no-vendors").html() == '' ) {
                 $(this).hide();
          }
      } );
       
      I have tested it on jsfiddle and it works fine. It does however need to be adapted to work with jQuery for pagelines and wordpress. Any help or advice?
       
      Thanks
    • unifeyed
      By unifeyed+
      Hello there. 
      I am trying to have all the ® symbols throughout my website superscript without having to individually go to each symbol and wrap them in <sup> tags. There is quite a bit of them. I have the following code within the Custom Scripts, but it seems to cause issues with the Hamburger navigation, as it does not seem to work. Can you offer up some assistance? 

      <script>
      jQuery(document).ready(function() {
                 jQuery("body").html(
          jQuery("body").html().replace(/®/gi, '<sup>®</sup>').replace(/®/gi, '<sup>®</sup>')
         );
              });
      </script>
    • Houston Haynes
      By Houston Haynes+
      OK - folks - back with another nit... The "back to top" link works - BUT - it's only active (i.e. clickable with the associated action following) when the mouse-over hovers over the footer area of the page. I did a quick change of the z-depth (to -1) and nothing made a difference. Any thoughts on how to make the *entire* back-to-top icon hover-able/actionable? Thanks!
       

    • romanondrasek
      By romanondrasek
      hi all, I have some trouble using PL5 on my site. 
      I used plugins for event calendar (event on) and plugin (timetable responsive scheduler for WP) for schedule (classes) in the gym.
      The problem is, that post from this 2 plugins are shown without menu in header and footer. (I setup header and footer) in the page editor for all type of page. 
      When I create a lesson, it creates posts with slug (I have a slug "lekce" & event for events).
      I try to edit the post with PL editor, but editor is not opening on the post.

      Do you have some idea where should be some problem? Thanx so much.
      here are links for the sites :
      site with schedule :
      http://www.myfit.cz/rozvrh/
      site of one of the class (pilates)
      http://www.myfit.cz/lekce/pilates/
      site with calendar :
      http://www.myfit.cz/kalendar/
      7 side with one event from the calendar :
      http://www.myfit.cz/event/pilates-instruktor-akreditovana-licence/?ri=1
      when I have my site on DMS2 it was working :-(
       
       
    • chamois_blanc
      By chamois_blanc+
      I am trying to clone a container on a page. It throws the following javascript error:
      function l(b, c, e, f) { var g = m.a.f.get(b, p); if (!c) { if (g) throw Error("You cannot apply bindings multiple times to the same element."); m.a.f.set(b, p, !0) } I would appreciate guidance and a fix. Thank you
×