How do I create a box for ads in a page

  • 2
  • Question
  • Updated 9 years ago
  • Answered
I want to create boxes on a page for ads, how do I do that?
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
  • confused

Posted 9 years ago

  • 2
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hello,
What type of boxes would you like to create? Can you tell us more about what type of ads you are using and how you would like them to appear on your site and we can give you some ideas.

Kind Regards,
Emmy
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
I was thinking of 2" x 2" boxes down the side of a page with a border of some sort. Or random on the page in different sizes with borders to set them apart from the text on the page.
Something like a picture with a border and the text wrapped around it.
Also maybe a banner at the top or the bottom of the page with a border to set it apart.
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Ron

Please take a look at my site: http://dejavuapparel.yolasite.com Is the layout of my site kinda what you're looking for?
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
That's kind of the idea I had.
Then the info in the boxes can be changed as need be.
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
Help, I still don't have an answer to how to create boxes for ads??
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Ron

Sorry, I've been off the forum for a couple of hours. Here's the code:

<div style="border: 1px solid black; padding: 10px; background-color: rgb(93, 196, 211); text-align: center;"><font size="3"><b>ABOUT ME<br></b></font></div>
<div style="border-style: none solid solid; border-color: -moz-use-text-color black black; border-width: 0px 1px 1px; padding: 10px;"><div style="text-align: center;">
<font style="color: rgb(0, 0, 51);" size="3">your text, image or widget code can go in here</font></div></div>

You can adjust the width, color, border color, etc...

Please let me know if you need further help.
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
Sorry this code does not just create a box, it says about me at the top.
I need a way to just create boxes that I can put into the box what I want.
While we are on this subject, how about banners?
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Ron

This is a screenshot of the code rendered that I gave you above:



They are actually two boxes! The first box contains the text "About Me" and then there's a second box below it. You can easily delete the second box and then change the background color of the "About me", as well as the text. What you'd end up with is this code:

<div style="border: 1px solid black; padding: 10px; background-color: rgb(93, 196, 211); text-align: center;"><font size="3"><b>ABOUT ME<br></b></font></div>

Where it says background-color: rgb(blah blah blah), this is where you enter your color for the background. Where it says "About me", that's where you can enter your other stuff.

The width is set to 100%. So, whatever the width of your column is, that's the width of the box. You can make it a fixed width by adding width: 100px; (or whatever width you want) after the text-align: center;

Please let us know if this still does not meet your needs. We will continue to work with you.
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
Yes I see how this works, but I am looking for a way to put images, logos and test in a single box if possible. Something that is really easy to work with, with different fonts, sizes, etc.
Is there a simple way to do that.
This code seems to just put the box around a simple text.
Sorry I am a newbie at this
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Ron

Here's an example of an image in a box:



Code: <div style="border: 1px solid black; padding: 10px; background-color: #ffffff; text-align: center;"><img style="border: 0px none ; margin: 4px; padding: 0px;" src="resources/question-64.jpg?timestamp=1241202834311" ></div>

Here's an example of text in a box with thick border.



Code: <div style="border: 5px solid black; padding: 10px; background-color: rgb(255, 255, 255); text-align: center; width: 350;"><font style="font-family: Georgia;" size="5"><span style="color: rgb(0, 153, 0);">HERE'S AN EXAMPLE OF COLOURED TEXT IN A BOX.</span></font><br></div>

Here's an example of changing the border:



Code:<div style="border: 5px dotted green; padding: 10px; background-color: rgb(255, 255, 255); text-align: center; width: 350px;"><font style="font-family: Georgia; color: rgb(102, 102, 255);" size="5">HERE'S AN EXAMPLE OF COLOURED TEXT IN A BOX.</font><br></div>

As you can see, there's lot of things you can do. Here's a list of things you can change:

border: 5px (this changes the thickness of border) solid (line style - you can have dotted, dashed, etc) black (color of border)

padding: 10px (this changes how much space is between the text or image and the border)

background-color: rgb(255, 255, 255) - you can change this using rgb numbers or Hex (eg. #FFFFFF)

If you place the code in the HTML in a text widget box, you can easily change the font color, font family, size by using the tools on your toolbar.

Does this seem workable to you Ron?
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
Thanks. I appreciate all the time you are taking with this.
What would you do to put an image and text in the same box.
Like we do with pictures and wrapping test around it.

Again thanks for all the help.
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Here's a screenshot again:



The easiest way to do this is using your text widget box and then click on the HTML button on your toolbar. Add this code:

<div style="border: 2px solid green; padding: 10px; background-color: rgb(255, 255, 255); width: 350px; height: 300px;"></div>

You can change the width and height accordingly to your image/text size.

Now, once you've added this, return to your text widget toolbar, click on the image icon to add your image inside the box you just made. Then, click on the image to select it and you'll see the text-wrap features - click on one of those.

Let me know if I can do anything else for you.
Photo of rjk1@live.ca

rjk1@live.ca

  • 156 Posts
  • 9 Reply Likes
Thank you so much.
You have been extremely helpful.
I think that is exactly what I was looking for.
I will give it a try.
Again thanks for all the time.
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
You're very welcome. Please let me know if I can be of further assistance.