Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Where to insert code for jquery plugins ?


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Sep 10, 2009, 01:10 PM
twola
 
27 posts · Sep 2009
Would it be the "HTML Inserts: Header"? Even though I only need it on certain pages?

Thanks
  #2  
Old Sep 15, 2009, 05:10 PM
Flynn's Avatar
Flynn
 
3,754 posts · Oct 2008
Munich, Germany
Add jQuery code to js.php after

jQuery(document).ready(function(){
  #3  
Old Jan 17, 2010, 06:51 PM
Eric Bobrow
 
70 posts · Jan 2009
I am trying to use jQuery to show an overlay image the first time a visitor enters the site, then fade it after a few seconds or when the visitor clicks on the entry image. I worked most of the mechanics and code out on a test page, and am now trying it on one of my WP sites which has Atahualpa 3.4.2 loaded.

I can't seem to get the jQuery code to execute. I followed the directions to paste it in right after the line with:
jQuery(document).ready(function(){

My first simple test is to hide a DIV that floats in front of the page that has an ID of "entryImage". My code is very simple:
$("#entryImage").hide();
When that didn't do anything, I added a simple alert line to see if I could get something to execute, but I didn't get the alert popup that I expected:
alert("hello");
For the record, here is the context, with the lines above and below what I added just to show exactly where it is placed. Any help would be greatly appreciated!
jQuery.noConflict();
jQuery(document).ready(function(){

$("#entryImage").hide();
alert("hello");

/* For IE6 */
  #4  
Old Jan 23, 2010, 11:18 PM
Eric Bobrow
 
70 posts · Jan 2009
I figured this out myself, and will post a couple of comments so that others may benefit from what I learned.

jQuery scripting is often written with the $ variable aliased to the jQuery function, however this can sometimes cause conflicts with other Javascript libraries. Flynn put in a line of code that I didn't understand (and originally ignored) that takes away that alias or shortcut to avoid potential problems:
jQuery.noConflict();
Because of this, I had to rewrite my code to use the full jQuery reference:
$("#entryImage").hide();
became instead
jQuery("#entryImage").hide();
Once I figured this out, I was on my way. I still have a lot to learn, but now I can get jQuery code working on any page on the site by placing it in the js.php file.

One suggestion: since this code would be lost if / when I upgrade to a later version of Atahualpa, perhaps an option for jQuery coding could be added into the ATO in a way similar to the CSS inserts. This would also make it very clear where to add the code, and could include documentation that informs users that they need to use jQuery() instead of $() syntax.

I hope this little explanation and my suggestion are helpful.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Header Drop Down Navigation (Where to insert the code) rockport Header configuration & styling 7 Nov 15, 2010 07:57 PM
How to insert php code into Byline JakeThePeg Post-Kicker, -Byline & -Footer 1 Aug 27, 2009 06:16 PM
bug - jquery.js not found sdw New Versions, & Updating 2 Aug 16, 2009 05:23 AM
Jquery/js error - conflict grasshopper Sidebars & Widgets 3 Aug 9, 2009 10:25 AM
Libraries : jquery-1.2.6 is needed ? nello Atahualpa 3 Wordpress theme 1 Jun 18, 2009 04:11 PM


All times are GMT -6. The time now is 11:45 PM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.