WordPress.org

Ready to get started?Download WordPress

Forums

Square Banner in Top Left (12 posts)

  1. threecoves
    Member
    Posted 5 years ago #

    Hi,

    A simple question which I cant't quite figure out.

    I would like to place a 300x250 banner (or a 160x600 banner) in the top left of my blog.

    How can I do this in a way that it will run along side the blog without making the rest of the blog show up below the banner.

    Thanks in advance.

  2. figaro
    Member
    Posted 5 years ago #

    That depends on the theme you are using. A link so we can see what you are trying to modify would help.

  3. threecoves
    Member
    Posted 5 years ago #

    Hi,

    I actually intend to do this with multiple sites.

    Would you suggest using divs? And how would this be structured?

    Thanks.

  4. figaro
    Member
    Posted 5 years ago #

    The reason I asked about the site is because I would try to adapt it to the current theme, so how you do it would be dependent on the theme structure. For example, if I were using the default theme I may start with something like this...

    http://heraldleader.org/wordpress/

    This is just a rough draft, I only spend a couple minutes on it so of course it would take more styling, but it's quite simple to remove the default header and place an image on the side of your theme. I just stripped out the sidebar content and placed the image there. If course, I could have left them and placed it on the other side.

    Just some thoughts...look at your theme and see how you can modify it to do what you want.

  5. drewactual
    Member
    Posted 5 years ago #

    i suggest you do it with the background of the body.. would look something like this:

    background-position: top left;
    background-repeat:no-repeat;

    if you wanted it to stay put while the remainder of the page scrolls:

    background-position:top left;
    background-attachment: fixed;
    background-repeat: no-repeat;

    I am kinda partial to fixed images on a background, it makes content pop more imHo.

  6. drewactual
    Member
    Posted 5 years ago #

    well, after looking at your example I see what your looking for... do the same to the content div. but dont fix it, let it scroll.

  7. wizardregis
    Member
    Posted 5 years ago #

    Fixed ads? There is nothing I hate more. Like a commercial following when you switch channels.

  8. drewactual
    Member
    Posted 5 years ago #

    what does your opinion have to do with responding to this fella's question wizard?

  9. threecoves
    Member
    Posted 5 years ago #

    Thanks for the response. So, to not have a fixed ad, how do I structure this? I am a beginner with editing, but I think I understand the basics.

    Do I start in the CSS?

    Thanks.

  10. wizardregis
    Member
    Posted 5 years ago #

    I spread my views wherever I can. If someday threecoves here will get a job to make a site with ads he will hopefully remember what I said about fixed ads and help make the internet slightly better. But enough of that.

    I take it you want some kind of ad placed to the top left, well what you would use is the float element. You say you are a beginner so I will do it very basic.

    I could do some precise code and say "paste this and it will work out", but like the proverb goes... Give a man a fish and you feed him for a day; teach a man to fish and you feed him for a lifetime.

    HTML:

    <body>
    ...
    <div id="wrap">
    	<div id="column1">
    		<img src="banner.jpg" alt="" border="0" />
    	</div>
    	<div id="column2">Main content</div>
    	<div id="column3">Sidebar</div>
    </div>
    ...
    </body>

    CSS:

    #wrap { overflow:hidden; }
    #column1 { width:160px; float:left; }
    #column2 { width:500px; float:left; }
    #column3 { width:250px; float:left; }

    VoilĂ .

    As a sidenote you shouldn't make pages wider than 1000px since that will result in screens with 1024x768 have to scroll sideways, so there is a limit to how big banners you can have while still have room for content. Common sense may have to be applied.

  11. khandor
    Member
    Posted 5 years ago #

    Where [i.e. in which file] is that HTML to be placed?

  12. khandor
    Member
    Posted 5 years ago #

    I am currently using the Default Theme.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags