WordPress.org

Ready to get started?Download WordPress

Forums

Adding Rotating Java Script to my WP blog creates havoc in Safari Browser (21 posts)

  1. TheOneAndOnly
    Member
    Posted 9 years ago #

    I wanted a simple way to rotate homegrown ads on my 3 WP sites and one PHP board. My knowledge of coding is a 4 out of ten, and so I needed something EASY. I found this~

    http://www.designerwiz.com/JavaScripts/bannereffects/single_banner_rotator_on_refresh.htm

    ~ and pasted it into the just mentioned sites. In Firefox (Mac OS), all is good. In Safari (Mac OS X), problems. Two of my WP blogs were fine. One blog caused everything below my banners to be 'linked' to where the banner was heading. Plus, further down the page, the poor theme exploded. Images and words everywhere.

    Also, on XP, IE made the banners disappear entirely.

    Again, I don't know much about coding, so I don't know if I was supposed to 'cage' this java script somehow, to keep it from bleeding out of it's designated area.

    If you go here, you can see how I altered the java code. I took out the height and width restrictions:

    http://www.macliberals.com/v-web/bulletin/bb/viewtopic.php?p=10137#10137

    Is there anything I can do? I really want these banners.

    I hope this was enough info, and thanks for your efforts,

    TOAO

  2. jaseone
    Member
    Posted 9 years ago #

    It is probably because you are outputting an empty width= and height= and here:

    document.write('<img src=\"' + banner + '\" width=')
    document.write(width + ' height=' + height + ' ');

    Why not use something like AdRotator though? I would think you would want something that could keep stats of click through's although I don't know if that particular plugin can so just try googling or something like wordpress banner plugin.

  3. TheOneAndOnly
    Member
    Posted 9 years ago #

    Thanks for replying jaseone.

    I tried playing with the height and width settings, but it only changed the size of my banners instead of rectify the problem. I also took a serious look at ADROTATOR and I'm sorry to admit it was WAY over my head. Perhaps it would have been wiser for me to say I have nearly ZERO coding abilities. (I'm a poet, not a coder, but I've learned a lot from y'all and tinkering with code and such.)

    To recap: the simple java code I'm using works fine in FIREFOX, okay in Internet Explorer (sometimes the ad simply isn't there), and lousy in Apple's Safari.

    I can forget IE for now, since I'm most concerned about getting Safari to work. One thing that occurs to me is that if my java code is bad, it should fsck up all WP sites in Safari. But I've got one working fine:

    http://www.macliberals.com/saucyblog/

    So that gives me an idea. What I'll do is post the header.php code of a WP blog where the java code works fine as is, and one that doesn't. Maybe someone awesome like yourself might catch a meaningful difference-- if any:

    HERE'S THE CODE OF THE WP BLOG WHERE THE CODE PLAYS NICE TOGETHER (MANJI2):

    http://www.macliberals.com/v-web/bulletin/bb/viewtopic.php?p=10147#10147

    AND HERE'S A WP BLOG - (RANDOM-IMAGE THEME BASED ON KUBRICK)-- WHERE ALL HELL BREAKS LOSE IN SAFARI:

    http://www.macliberals.com/v-web/bulletin/bb/viewtopic.php?p=10148#10148

    AND THIS IS A PICTURE OF WHAT THE BROKEN SITE LOOKS LIKE:

    http://www.macliberals.com/temp/bleeding.jpg

    ******HOPING THIS HELPS********THANKS TO ANY BRAVE SOULS WHO LEND A HAND*****

    :-)

  4. TheOneAndOnly
    Member
    Posted 9 years ago #

    Here's proof that this code works fine by itself in any browser:

    http://www.macliberals.com/test.html

    (what I mean to say: I used this page as a test, and it works fine in any browser)

  5. jaseone
    Member
    Posted 9 years ago #

    It would be much easier if you linked to the actual sites so we could see what was happening ourselves.

    The Javascript you have though isn't designed to be placed within the HEAD tags, it should be the very first thing after the BODY tag.

  6. TheOneAndOnly
    Member
    Posted 9 years ago #

    Hi Again Jaseone,

    I appreciate your efforts here.

    1. I've seen this code on two sites. I can't find the original sight (arggh) but the second one screams at the top of it's iLungs that the code belongs in the head:

    http://www.designerwiz.com/JavaScripts/bannereffects/single_banner_rotator_on_refresh.htm

    But, to be helpful, I tried it in the BODY tags JUST as you mentioned. I also tried it all over the body tag. It only worked on one spot-- across the exiting banner-- and as such is useless to me.

    2. I can't put the destroyed site up because it's an active site. I've posted the defective code AND illustrated what goes wrong. Do you really need to see it or do you need to see the source code?

  7. NyteOwl
    Member
    Posted 9 years ago #

    Hmm I wonder if it might have to do with the missing semi-colon at the end of this line ...

    document.write('<img src=\"' + banner + '\" width=')

  8. angsuman
    Member
    Posted 9 years ago #

    @TheOneAndOnly
    I can help you with AdRotator Plugin. I wrote it. It doesn't require you to do any coding.

    All you need to do is create a text file in wp-content directory with one line per ad (works with adsense too). Then add a single line to your template where you want the ads to be displayed.

    The manual provides full details.

    Please comment on the blog entry to get faster response.

    BTW: As a small added benefit this plugin will work with all versions of all browser and operating systems - guaranteed :)

  9. jaseone
    Member
    Posted 9 years ago #

    Javascript doesn't require semi-colons to ternminate lines but it is good practice to use them.

    I still think it is the height/width thing, try doing:
    Change:
    document.write('<img src="' + banner + '" width=')
    to:
    document.write('<img src="' + banner + '"')

    and change:
    document.write(width + ' height=' + height + ' ');
    To:
    document.write(' ');

    I don't know why they say to put it in the header as it is outputting HTML and hence creating invalid HTML.

    Still I suggest going with angusman's plugin. :)

  10. TheOneAndOnly
    Member
    Posted 9 years ago #

    NyteOwl: didn't work, but thanks for trying.
    Jaseone: tried those adjustments as well. No good.

    I EVEN TRIED: booting up in a test environment, to make sure my Safari wasn't somehow clinging to old cache despite my dumping it repeatedly.

    FOR THOSE WHO WISHED TO THE SEE THE SITE DAMAGED IN SAFARI: I'll leave it malfunctioning for a few hours so you can see it.

    Thanks all for your help.

  11. jaseone
    Member
    Posted 9 years ago #

    What site is that?

  12. jaseone
    Member
    Posted 9 years ago #

    btw the script tag should be:

    <script type="text/javascript">

    for XHTML, that may or may not be causing a problem.

  13. jaseone
    Member
    Posted 9 years ago #

    and if the site is AppleSaucy then you have a lot of validation problems that could and probably are causing rendering problems as well:

    Validation results

  14. TheOneAndOnly
    Member
    Posted 9 years ago #

    "What site is that?"

    DOH!

    http://www.macliberals.com/

    (Sorry Jasone!)

  15. TheOneAndOnly
    Member
    Posted 9 years ago #

    --- btw the script tag should be: <script type="text/javascript"> ---

    Forgive me, but I don't understand what that replaces or where it goes. I could guess but I might as well ask directly.

    Also, I get nothing when I click on 'validation results'.

  16. TheOneAndOnly
    Member
    Posted 9 years ago #

    JUST WHEN YOU THOUGHT IT COULDN'T GET ANY WORSE DEPT:

    I was trying to install the Random Ad Generator discussed above. Manually. So I uploaded a folder called Random-Images. Then I learned I didn't have to do this manually. And so I went back and deleted it.

    As it turns out, the theme of my troubled site is called 'Random-Banner'. I'll give you one guess which folder I just deleted...

    SIGH.

    (BACKUPS: I have backups galore of my other two blogs. This one? Murphy's Law. My host should be able to provide a backup, but if you find I can't try ideas being suggested, now you know why...)

  17. jaseone
    Member
    Posted 9 years ago #

    Oopsy! I've done that to my home directory once before and boy was that a nightmare!

    Anyway that script has the old syntax of <SCRIPT language="javascript">, which should be replaced with what I quoted above. also all tags in CHTML should be lower case for consistency.

  18. TheOneAndOnly
    Member
    Posted 9 years ago #

    Luckily I only really lost images in the theme and a few tweaks, which I can recreate. This site is backup. I hoped that maybe if I was lucky the semi-cleansed theme might help something work. Nope, but that's my luck today.

    So I'm back where I was, which is:

    1. Trying these little code adjustments.
    2. Trying the recommend plugin.

    Thanks All

  19. TheOneAndOnly
    Member
    Posted 9 years ago #

    Update Jaseone:

    Tried those little code cleaneruppers again for a different reason and it definitely made things look a little sharper, and so a belated THANK YOU. Got the site backup and am trying to install AdBlocker.

  20. TheOneAndOnly
    Member
    Posted 9 years ago #

    RESOLUTION FOR THOSE KEEPING SCORE:

    The solution to the javascript meets Safari bugs was to abandon the script and replace it with Angsuman's plugin.

    The plugin was a bit rough for a clueless dude like me to 'get', but thanks to the developers kind help all is up and running now for the most part.

    I'm frankly still amazed that a simple bit of javascript wouldn't work in Safari, but I don't know code, and maybe java sucks. Or Safari sucks. Or maybe both are cool but when they meet-- WOW.

    Thanks to all for the consistent quality help offered in here. When I get a moment, I'll make a WORDPRESS ad and stick it into my AD ROTATION.

    :-)

  21. jaseone
    Member
    Posted 9 years ago #

    Javascript can be a bit of a pain sometimes to write but neither Javascript or Safari sucks, it just that script was a poor one written back in the day when valid HTML didn't matter so much and the instructions that came with it were incorrect as well.

    I'm glad you got the plugin working though. :)

Topic Closed

This topic has been closed to new replies.

About this Topic