• Hi,
    Im wanting to use a text widget to place 4 small banner ads in my side bar.
    2 on top side by side and 2 underneath side by side.
    Basically 4 small creating one big square.
    I can’t figure out how to do this.
    Can anyone help?

    blog is thehealthycollective.com

Viewing 11 replies - 1 through 11 (of 11 total)
  • Do you know how to use HTML?

    Thread Starter Hilary Curtiss

    (@hilarykenmare)

    A little bit

    In that case, you will need to use HTML to add your banner images to the Text widget – possible with some inline CSS to float to the 2 lower banners side-by-side.

    Thread Starter Hilary Curtiss

    (@hilarykenmare)

    Well in that case, then no. I don’t know HTML that well to just write it and insert it.
    Can anyone else help?

    Those are going to be really small ads? Your sidebar is only 178px wide?

    Thread Starter Hilary Curtiss

    (@hilarykenmare)

    Yes but I have other ads up that are 250 x 250.
    I wanted to try a small tiled one with 4 125×125 ads to test it.

    Those are getting cut off when the site is resized – does that matter?

    Thread Starter Hilary Curtiss

    (@hilarykenmare)

    What does that mean?! lol

    Try looking at your site in a smaller browser window or on an iPad or phone. Those ads are outside the sidebar and thus get cutoff (or need a scrollbar). It’s not horrible, just asking if you were aware of it.

    Thread Starter Hilary Curtiss

    (@hilarykenmare)

    I wasn’t aware. but that is ok.

    So back to your question, this really is basic HTML and CSS – so you might want to invest a bit of time learning more ?? – but something like this should work:

    HTML:

    <div class="fourads">
    <div class="ad1">
    Ad 1
    </div>
    <div class="ad2">
    Ad 2
    </div>
    <div class="ad3">
    Ad 3
    </div>
    <div class="ad4">
    Ad 4
    </div>
    </div>

    CSS:

    .fourads {
      //add styles here if needed;
    }
    .ad1, .ad2, .ad3, .ad4 {
      width: 125px;
      height: 125px;
      border: 1px solid red;
      margin: 3px;
      float: left;
    }
    
    .ad3 {
      clear: both;
    }

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Text Widget’ is closed to new replies.