Making Attractive Ads Using Tables - Fixing Resizing Images

bysgreenb7

228 followers

8 years ago

I found a template ad on one of my affiliate links that was very attractive and have started using their format. What I like about this Ad design is it is formatted like informational content/price comparison and not an Ad. This makes your presentation of the product more attractive to the viewers and they might not even realize they are looking at an affiliate link

Here is an example of one my Ads in this format.

To do this will require going into the 'text'/html editor tab of your post. Here is a picture of the text editor with the corresponding code for the table ad.

Copy and Paste Code into Editor:

<table border="0" cellpadding="5">

<tbody>

<tr>

<td align="center" valign="top"><a href="YOUR AFFILIATE LINK" ><img src="YOUR IMAGE LINK" alt="" border="0" /></a></td>

<td align="center" valign="top"><a href="YOUR AFFILIATE LINK" >PRODUCT NAME</a> - PRICE

PRODUCT DESCRIPTION</ td>

</tr>

</tbody>

</table>

Copy and paste the code into the location you want it to appear in your post and replace the bolded sections in my examples with your corresponding info.

That's it, you have an Ad that is beautifully formatted.

***WARNING*** :

Be careful of image sizes. The image sizes that will work for your table might not be supported by Wordpress default image sizes. You might run into the issue, since your Ad is in a table, with google chrome resizing your images and slowing down your site.

Your Ad is supposed to look like the top but turns looks like the bottom. (the following example is taken from https://boulderinformationserv...)

Here is why:

Chrome thinks the image can be freely resized to fit the table

We want chrome to not do this and therefore instruct chrome to not resize by not specifying a max width %.

To do this fix your going to need to go to

Wordpress Dashboard -->Appearance--->Customize--->Additional CSS

and enter the code

.entry-content td img {
max-width: none;
}

If your theme doesn't have this option in Customize then you can do the same thing going to and posting the snippet of CSS there.

Wordpress Dashboard -->Appearance--->Editor--->style.css (under StyleSheet all the way on the right)

Let me know what you all think of the Ad Design and if you need help setting it up or troubleshooting if you decide to use this method!

Simon