Question

My site is http://littlehousearts.com. I am using Prestashop and have added javascript to display a banner on every page load. Currently I only have one banner image and it loads fine on the home page and category pages. But it does not load always on the product pages. I am able to view source and see the script tag appropriately in the source. The tag I used is:

<script src="banner.js" type="text/javascript"></script>

The code in the javascript file is:

function random_imglink(){
  var myimages=new Array();
  index=0;

  //specify random images below. You can have as many as you wish
  myimages[1]="<a href='http://littlehousearts.com/28_golden'><img src='/img/golden.png' width='943' alt='GOLDEN Acrylic Paints' /></a>";     

  index=Math.floor(Math.random()*myimages.length);

  if (index == 0){
    index=1;
  }

  document.write(myimages[index]);
}
random_imglink();

The banner I currently have loading is under “earn credits” and displays Golden professional quality colors.

Any idea why this would not load on some pages? I tested it to load a non existent image and there should be a text in that position that reads undefined but that doesn’t even show up on the pages where it is missing.

Answer 1

My guess it’s that you have that problem because you use relative URLs.

Then, banner.js points to a file in the current directory. So, if you are in “http://littlehousearts.com”, it points to “http://littlehousearts.com/banner.js”, but if you are in “http://littlehousearts.com/a/”, it points to “http://littlehousearts.com/a/banner.js”.

Instead of this, you should use relative URLs to your site’s root:

<script src="/banner.js" type="text/javascript"></script>

This way, it will always point to “http://littlehousearts.com/banner.js”