Announcement

Collapse
No announcement yet.

Rotating ads with coding

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Rotating ads with coding

    So I found this coding in another section on this forum for rotating banner ads and having them be clickable and I have a number of questions when implementing this into the VB cloud platform and some of it stems from being a complete beginner...but I also think this may help a lot of others too so I'll put the dunce cap on and ask the questions.


    This is the code I have found to allow rotating banners/ads on a site but in the instructions provided it mentions that it is to be added into the template portion of the site which is not really allowed in VB cloud as far as I understand ... so please see my questions below the instructions/code:

    Instructions:

    1) - Create a directory on your server to host the image files.
    2) - Put your banner images in there and name them something unique.
    3) - Go to Styles >> Style Manager
    4) - In the "Choose Action" drop down select "Edit Templates" for the style you wish to modify.
    5) - When the page refreshes, scroll down the list of default style templates until you see "header".
    6) - Click header to highlight it and then click Customize (if file is unedited) or Edit (if it's been modified).
    7) - When the template editor opens, scroll through the code to around line 368 or so and you'll see "<div class="toolbar">"
    8) - Create a new line under that entry and add the following code:

    Code:


    Code:
    <div align="right">
    <script language="JavaScript">
    function your_banner(){
    var myimages=new Array()
    //Add Banner images below. Add as many as you'd like.
    myimages[1]="http://www.yoursite.com/yourfolder/your_banner_1.png"
    myimages[2]="http://www.yoursite.com/yourfolder/your_banner_2.png"
    myimages[3]="http://www.yoursite.com/yourfolder/your_banner_3.png"
    
    //Add link to image below. Correspond bracketed ID.
    var imagelinks=new Array()
    imagelinks[1]="http://www.youbanner1link.com"
    imagelinks[2]="http://www.youbanner2link.com"
    imagelinks[3]="http://www.youbanner3link.com"
    
    var ry=Math.floor(Math.random()*myimages.length)
    if (ry==0)
    ry=1
    document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
    }
    your_banner()
    </script>
    </div>

    Here are my questions
    1. Rather than put this in the header or anywhere else in the template - Can I enter this code into an ad module box and still have it work?

      assuming the answer is yes... then I have the following remaining questions:
    2. I don't need anything to align to the "right" so can I just eliminate the line: <div align = "right"> ?
    3. I am assuming that to make the above work I would upload my banner images to VBCloud File Manager...but how would I get the proper "http://www.yoursite.com/yourfolder/your_banner_1.png" because all I see is core/css/0/0/ a few other numbers my image name.jpg or .png ...there is no http:// or www. anything in front of the file?
    4. I would like to rotate more than 3 images - what would I need to edit in the code to allow that? my first thought is replicating these two lines but changing the "[3]" to a "[4]" : myimages[3]="http://www.yoursite.com/yourfolder/your_banner_3.png" imagelinks[3]="http://www.youbanner3link.com" but I am sure there must be something with math calculation in there maybe as well?
    5. I am assuming that the above code is set to randomize the banners based on every refresh or landing of the page and not via a specific time limit like every 30 seconds correct?
    6. Lastly, I am assuming that with the above code it would insert the ad/banner image at the same size that it was uploaded into VBCloud file manager correct? so if I uploaded a 300x50 banner it would insert it at that size, but if I uploaded another file in that rotation that was 300x250 it would insert at that size?

    I apologize if some of these questions are stupid/crazy beginner... To say that I am a beginner with this stuff is an understatement so thank you to anyone who has the patience to help
    Your V6 Camaro information source
    How to fix deep scratches in your cars paint

    Vote for:

    Ability to display ads for xx number of views / impressions: http://tracker.vbulletin.com/browse/VBV-18045

  • #2
    1) You can put it in an Ad Module.
    2) Just remove the ' align="right"'
    3) You actually don't need the full path. vBulletin assumes it. However, just add your domain name in front of /core/ to make it.
    4) You can add additional lines. Just keep counting up. The math will take care of itself.
    5) Correct.
    6) It should load the image full size.

    I do something similar on forums.rabidbadger.io. If you refresh the page, the header image should be random. This is the code I am using:
    Code:
    <div class="hidden"></div>
    <script type="text/javascript">
        var dir = '/core/css/0/0/0/0/9/2/images/';
        var images = ['background0.jpg','background1.jpg','background2.jpg','background3.jpg','background4.jpg','background5.jpg','background6.jpg','background7.jpg','background8.png'];
        document.getElementById("header").style.backgroundImage = "url(" + dir + images[Math.floor(Math.random() * images.length)] + ")"; 
    </script>
    Translations provided by Google.

    Wayne Luke
    The Rabid Badger - a vBulletin Cloud customization and demonstration site.
    vBulletin 5 Documentation - Updated every Friday. Report issues here.
    vBulletin 5 API - Full / Mobile
    I am not currently available for vB Messenger Chats.

    Comment


    • #3
      perfect thank you - I am going to try this coding this weekend.

      Now a few more questions if I may...what's the difference between your code that you used and the code I found? Is there any difference with layout or is this just another way to "skin a cat per se"?

      and, just out of curiosity... can google ads be added into the banner rotation I copied in post 1 as part of the rotation? Would it just be a drop in of the google ad code in place of the "
      myimages[2]="http://www.yoursite.com/yourfolder/your_banner_2.png" line? Not that I necessarily require having google ads in the mix on rotation...but knowing I have that ability could be useful in a few scenarios I have in mind...
      Your V6 Camaro information source
      How to fix deep scratches in your cars paint

      Vote for:

      Ability to display ads for xx number of views / impressions: http://tracker.vbulletin.com/browse/VBV-18045

      Comment


      • #4
        Just another way to do it. My code is more compact and uses a "newer" method of defining the Array.

        Using Google Ads would be a little different. You would have to look for it and produce different output if it is the result. The reason being is that Google Adsense has its own javascript and is more than an image. You could have an array entry that simply says "Google" and if that entry is chosen, output the Google ad code. Otherwise, output the image.
        Translations provided by Google.

        Wayne Luke
        The Rabid Badger - a vBulletin Cloud customization and demonstration site.
        vBulletin 5 Documentation - Updated every Friday. Report issues here.
        vBulletin 5 API - Full / Mobile
        I am not currently available for vB Messenger Chats.

        Comment


        • #5
          If I am not stepping on anyone's foot here, may I ask, how can I use this code on my VB5 forum? Mine is a standalone installation, not the cloud one.

          Would appreciate a little help here. I tried to use the old Ad Rotate Module but being a programming idiot, can't really work it out.

          Thanks for any help!

          Comment


          • #6
            Originally posted by adkaush View Post
            If I am not stepping on anyone's foot here, may I ask, how can I use this code on my VB5 forum? Mine is a standalone installation, not the cloud one.

            Would appreciate a little help here. I tried to use the old Ad Rotate Module but being a programming idiot, can't really work it out.

            Thanks for any help!
            This isn't something we can provide support for, but the detailed instructions are right here in this thread.
            MARK.B | vBULLETIN SUPPORT

            TalkNewsUK - My vBulletin 5.5.4 Demo
            AdminAmmo - My Cloud Demo

            Comment


            • #7
              Instructions would be the same on Cloud or Download.
              Translations provided by Google.

              Wayne Luke
              The Rabid Badger - a vBulletin Cloud customization and demonstration site.
              vBulletin 5 Documentation - Updated every Friday. Report issues here.
              vBulletin 5 API - Full / Mobile
              I am not currently available for vB Messenger Chats.

              Comment

              Related Topics

              Collapse

              Working...
              X