WordPress.org

Support

Support » Themes and Templates » Javascript ads in 125X125 ad formate, formating!!

Javascript ads in 125X125 ad formate, formating!!

  • technotip.org
    Member

    @technotiporg

    Hi guys/girls,

    I am using a theme in which I have the option to add 4 125X125 banner ads.
    I can put there only banners(image ads).
    But I want to place adify or adsense ads(125X125) in that place.

    The codes to put the banner ads are currently like this

    <a rel="nofollow" href="http://technotip.org/advertise/"><img style="margin: 0 15px" height="125" width="125" src="<?php 
    
    bloginfo('template_directory'); ?>/images/125x125.jpg" border="0" title="insert title" alt="insert title" 
    
    /></a>
    <a rel="nofollow" href="http://technotip.org/advertise/"><img height="125" width="125" src="<?php bloginfo('template_directory'); 
    
    ?>/images/125x125.jpg" border="0" title="insert title" alt="insert title" /></a>
    
    <a rel="nofollow" href="http://technotip.org/advertise/"><img style="margin: 0 15px" height="125" width="125" src="<?php 
    
    bloginfo('template_directory'); ?>/images/125x125.jpg" border="0" title="insert title" alt="insert title" 
    
    /></a>
    <a rel="nofollow" href="http://technotip.org/advertise/"><img height="125" width="125" src="<?php bloginfo('template_directory'); 
    
    ?>/images/125x125.jpg" border="0" title="insert title" alt="insert title" /></a>

    When I replace these codes with my 125X125 adsense ads, all the ads will showup like a single ad(with no gap in between each other).

    Now I think this problem can only be solved by using some class in my style sheet.
    So please anyone help me to get the code to place the javascript ads in those places.

    Please help me as soon as possible.
    And my site it http://technotip.org

    Thanks in advance.

Viewing 8 replies - 1 through 8 (of 8 total)
  • RoseCitySister
    Member

    @rosecitysister

    You can’t format the Google ads, except through their control panel and your choices are limited to colors. The font and margins, padding, etc. – you have no choices there.

    In order to have “gaps” between the ads, you would have to place one ad at a time – which would limit you to 3, if I recall Adsense guidelines correctly…

    on edit – what I would do, in this case, is use the 250×250 rectangle, and take out the individual divs, just have one big one instead of 4 little ones – not exactly what you’re looking for, but doable. I believe it’s three ad units to a page, and two link units? Not sure, it’s been a while since I read the guidelines.

    RoseCitySister
    Member

    @rosecitysister

    Sorry – reading over your post, I did not understand your question. Here’s how I would do it:

    1. Put this style in your style sheet:

    .bigblock {
    	width: 270px;
    	height: 270px;
    	padding: 5px;
    }
    
    .left-top, .left-bottom {
    	width: 125px;
    	height: 125px;
    	background: url(images/125x125.jpg) no-repeat;
    }
    
    .right-top, .right-bottom {
    	float: right;
    	width: 125px;
    	height: 125px;
            background: url(images/125x125.jpg) no-repeat;
    
    }
    
    .clearblock {
    	width: 100%;
    	height: 5px;
    	clear: both;
    }

    And this would be your html:

    <div class="bigblock">
    
    <div class="right-top">Ad code</div>
    <div class="left-top">Ad code</div>
    
    <div class="clearblock"></div>
    
    <div class="right-top">Ad code</div>
    <div class="left-bottom">Ad code</div>
    
    </div>

    You would of course replace “Ad code” with your Adsense code for one 125×125 ad.

    That gives you this (without your images):

    http://rosecitygardens.com/test.html

    Disclaimer: I haven’t looked at this in anything but FF/Mac.

    RoseCitySister
    Member

    @rosecitysister

    I adjusted the CSS a tiny bit:

    .bigblock {
    	width: 255px;
    	height: auto;
    	padding: 5px;
    }
    
    .left-top {
    	width: 125px;
    	height: 125px;
    	background: url(images/125x125.jpg) no-repeat;
    	margin-bottom: 5px;
    }
    
    .left-bottom {
    	width: 125px;
    	height: 125px;
    	background: url(images/125x125.jpg) no-repeat;
    	}
    
    .right-top {
    	float: right;
    	width: 125px;
    	height: 125px;
    	background: url(images/125x125.jpg) no-repeat;
    
    }
    
    .right-bottom {
    	float: right;
    	width: 125px;
    	height: 125px;
        background: url(images/125x125.jpg) no-repeat;
    
    }
    
    .clearblock {
    	width: 100%;
    	clear: both;
    }
    technotip.org
    Member

    @technotiporg

    Hi RoseCitySister,

    Thanks a lot for answering my question.

    Now everything works fine, but in IE the things change.There the margine left after the 1st row ad is more.How can I reduce it in IE? Please open and see my blog in Internet Explorer.

    And in IE, my middle column([Homepage]where I have Commentators and Recommendation section) just drops down.Everything is working fine in Firefox.Problem only with Internet Explorer.

    I visited your website, its very nice.But couldn’t find email subscription option there.I just wanted to keepup with your latest works.

    RoseCitySister
    Member

    @rosecitysister

    I’m on a Mac, I don’t have IE, sorry! But it’s still the bane of my existence, lol.

    Is your theme a public release? Or a paid theme? If a public release, please give me the URL so I can download it and mess around with the layout. If not I’ll just view source on your page.

    Give me a little while – I don’t have time to do this right now, but will see what I can do.

    As far as the sub link, I haven’t really “launched” yet, I’m still working on the themes I’m going to release – but you can use the Contact link on my site to email me.

    Hi technotip.org

    I’m checking your page with IE Developer Toolbar, ‘View DOM’.

    Despite a CSS-specified width of 135px, your .narrow-left DIV has an offsetWidth of 180px (that’s the effective width) and .narrow-right is effectively 157px. To sit side by side they need at least 337px of space. The parent DIV is just 294px wide (by CSS).

    IE is adding the 160px width of the Adsense link unit (in .narrow-left) to the 10px left/right padding on the DIV to get 180px.

    Bottom line is, you just don’t have enough horizontal space to fit.

    Have you considered using the IE DevToolbar? It’s a free download.

    Also I’m curious why you have -10px side margins on these divs?

    Interesting…

    I just updated the page, and you must have been editing it as I was typing. I see you floated the divs, and now it looks ‘OK’ in IE6/7.

    It also looks fine in FF, Opera, Safari.

    technotip.org
    Member

    @technotiporg

    Hi iamzippy,

    Thanks a lot for answering my question.

    Now everything works fine, but in IE the things change.There the margine after the 1st row ad is more.How can I reduce it in IE? Please open and see my blog in Internet Explorer.

    And in IE, my middle column([Homepage]where I have Commentators and Recommendation section) just drops down.Everything is working fine in Firefox.Problem only with Internet Explorer.

    @rosecitysister, its a premium theme, and I have changed a lot from the original one.You can check my theme at http://technotip.org

    In firefox it works, but problem with IE.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Javascript ads in 125X125 ad formate, formating!!’ is closed to new replies.