Support » Fixing WordPress » Javascript Usage in Themes

  • Resolved splwolf


    I’m making my own wordpress theme to match the look of my website. I have links to javascript files in the <head> section of the header.php template file, but the browser isn’t reading them when it parses the page.

    I’ve seen multiple topics similar to this in the forums, but none that have been resolved. Associated links in these topics that lead to pages where the javascript “doesn’t work” now show the js-enabled effects working fine, so I know that people are finding a solution somewhere out there.

    I’ve read the WP documentation on Javascript, and about how it should “work fine” in wordpress when used in themes, but I’ve followed all the guidelines listed there, and it’s not helping.

    Sorry for the long post. Does anyone have a generic answer to this problem? I can post the code if necessary, but I don’t think the problem has to do with the <link> code, or it’s location. Thanks in advance!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Well, I still haven’t fixed the problem. I was really hoping to use wordpress for this site, but if the javascript doesn’t work, there’s no way I can do it.

    Was this a stupid question for me to post, or has no one heard of this problem before? If anyone has time to clue me in, I’d be really grateful!

    I use javascript between my theme’s <head> tags with no issues.

    Is this the article you’ve read? Using_Javascript

    Are you using any large/well-known js libraries that might already be part of WP?

    What browser? Any “adblock” type extensions running on it? Tried other browsers? Any local computer security products running (mcafee suite, zonealarm, et al)? Same issue if they’re disabled?

    [edit – doodlebee continued this post for me below!]

    I can post the code if necessary, but I don’t think the problem has to do with the <link> code, or it’s location.

    it’s necessary for *at least* a link to the site. There is absolutely no information in your question that’s even close enough to allow us to answer. From what I’m reading, it sounds like it *is* a problem in your code – but I have no real information to base that in. It’s just a guess – need more info.


    I’m trying to implement two scripts:

    1. SWFObject to swap out a flash movie in order to get around the IE active content border.

    2. A script related to the css drop-down menu on the left. I need the js to get around IE6.

    The problem exists on IE and Firefox. I haven’t tried safari, but I can’t ignore an IE problem anyway. I did read the Using_Javascript article.

    Thanks for responding to me. I’ve been wrestling with this problem for nearly three weeks.

    Moderator Samuel Wood (Otto)

    (@otto42) Admin

    Well, there’s your problem:

    <!-- !!! Here are the problematic js links, inside header.php. The js links are relative because the files are in the same directory as header.php. -->

    Don’t make them relative. Make them absolute. Here’s why:

    Relative links are relative to what you see in the URL bar. Thus, the browser is requesting and , which are not the correct URL’s (since you have them actually in the theme directory).

    Fortunately, there’s a specific way to handle this.

    Change the code in header.php to this:
    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/swfobject.js"></script>

    The “template_directory” is defined as the location of your theme (more or less). Since you have the js files there, it will be correct and point to them properly. Do the same for the other file as well.

    Also, if you use pretty permalinks, your URL will bear no relation to your real directory structure anymore, so you must use absolute URLs. By using that template tag to get the directory, it’ll be correct even you make changes later.

    Thanks for the help, Otto. I tried the code you suggested, but it didn’t work, so I changed them to full links. Alas, no change.

    I noticed that though the js doesn’t parse in firefox or IE, the page doesn’t even load completely in IE. It sits with "Opening Page (1 item remaining)" in the status bar. I imagine that has something to do with the problem.

    I’m so beaten with this issue. :/

    Moderator Samuel Wood (Otto)

    (@otto42) Admin

    Well, the SWFObject one certainly is working as far as I can tell, it’s just that the browser cannot find the “header.swf” file that you’re referencing. Where is that file?

    I’m not certain what drop_down is supposed to do, but those menus on the left do indeed drop down with scripted actions. They don’t link to anything, but they drop down just fine.

    I forgot to upload the swf! Wow, I feel really dumb, lol. I can’t get to the computer with the swf on it right now, but I tested out a different one, and sure enough, it worked.

    Thanks so much for the help!

    Since the javascript is obviously being parsed, I assume the drop_down.js must not be working because of an error in the script itself, or where it’s called (the drop down menus work in Firefox and IE7, but in any earlier version of IE, they don’t show up…thus I use the js).

    Thanks again!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Javascript Usage in Themes’ is closed to new replies.