WordPress.org

1. undream
   Member
   Posted 4 years ago #

   Hello,

   I am using a javascript image menu in my WP site, and am using the template_url tag for all the images. All of the images are located within the .js file, not the header or menu, etc.

   The menu won't display in wordpress this way, but does work when the image URL/'s are hardcoded to the server. (so I know for sure it's a path/php/js problem, and not something else).

   I tried adding a \ in front of the apostrophes, but no luck.

   any suggestions would be immensely appreciated.

   thanks

   -rebecca

2. undream
   Member
   Posted 4 years ago #

   anyone?

3. Otto
   Tech Ninja
   Posted 4 years ago #

   Your post is very vague. A bit light on detail. So, without more information, we can't help you. What does the relevant part of the script look like? How are you putting it on the page? What is the page output? What's a link to the page so we can see the problem in action?

4. undream
   Member
   Posted 4 years ago #

   I apologize for the lack of details - I will try to explain more thoroughly...

   Ok.

   The menu I am working on is from milonic.com, and is an horizontal all image mouseover, dropdown menu. ( menu source: http://www.milonic.com/download.php?sampleid=18 )

   My wordpress blog is here: http://www.treasurehiding.com/ljurban

   You can see at the top right of the page, the broken images, and if you mouse over the one that says projects.gif, you can see that it drops down. Ideally, these would all be working images, and would display a different image on mouseover.

   So, all the editing and configurations for the menu (including the image paths) are done within the main javascript file. ( see here: http://pastebin.com/f1f81f522 )

   If you look in the js file, you can see that I am trying to code the image paths using the <?php bloginfo('template_url'); ?> tag. This seems to be the problem, because when I hard code the images instead, the menu will display properly. (But I really need to use the template_url method, as opposed to hard-coding.)

   The only other changes I have made to the code are placing the javascript files into the header (see here: http://pastebin.com/f6f6170f9 ) and placing the file within the menu file where it is to display (see here: http://pastebin.com/f6beb0b99 ).

   Please let me know if there is any other info I can provide, and thanks in advance for any help. I REALLY appreciate it!!

   Thanks,
   Rebecca

5. undream
   Member
   Posted 4 years ago #

   oh, in case it matters, the names of the files i edited within the wp-admin backend theme editor are:

   header & ljmenu

   and the name of the menu file is
   menu_data.js

   thanks!

6. Otto
   Tech Ninja
   Posted 4 years ago #

   Okay, here's your problem.

   You're including that script at /scripts/menu_data.js in a script tag. This pulls it into the browser. Problem is that this is a javascript file, not a PHP file. So it's not evaluated by PHP and those template_url's you're trying to add are not getting converted to actual web addresses.

   PHP code like this only works inside PHP pages. What's more, WordPress code only works inside PHP pages inside the WordPress context. Since this is a JS file outside that context, you're not getting it to work on both fronts.

   You can either make it a PHP file and then include the main WordPress wp-blog-header.php at the top of the file (slow, processor intensive, but it will work), or you can replace those PHP calls with the actual complete URLs to those images. Of the two, the latter one is probably easier.

7. undream
   Member
   Posted 4 years ago #

   Thank you very much, Otto. I really appreciate it.

8. Adam Brown
   Member
   Posted 4 years ago #

   An alternative:

   In your theme's header.php, before you use the <script> tag to send the JS to the browser, use a line like this:

   <script type="text/javascript"><!--
   var template_url = "<?php bloginfo('template_url'); ?>";
   // -->
   </script>

   Then, go into your JS file, and replace every instance of <?php bloginfo('template_url'); ?> with template_url

9. undream
   Member
   Posted 4 years ago #

   Thanks, Adam.

   Using that method, would I then have to replace every instance of <?php bloginfo('template_url'); ?>throughout the entire blog, or just within the external .js file?

10. Adam Brown
    Member
    Posted 4 years ago #

    Only in the JS file. All you're doing is creating a JS variable that holds the same value as <?php bloginfo('template_url'); ?> so you can access that value within the JS file.

Topic Closed

This topic has been closed to new replies.