Ads By - Text Overlay Template

"Ads By" Text Overlay


Adding text and hyperlink overlay to your image ad items is very common in the digital advertising industry. This is a great way to bring brand awareness to your company while still capturing revenue for your campaigns.

To add text overlay to your images, we recommend using our "Custom HTML" ad item format.

Below, you'll find sample source that writes "Ads by XYZ" at the bottom left corner of your image.

Note: We recommend uploading the creative (image) to the AdButler media library and serving the ad from our CDN for the best possible performance. To learn how to upload to our Media Library and obtain the image link, click here.

Example Source:


<style>
.parent {
   position:relative;
}
.bottom-left {
    position: absolute;
    bottom: 8px;
    left: 8px;
}
a {
    color: black;
    font-size: 12px;
}
</style>
<div class="parent">
<div class="bottom-left">
<a href="http://www.your-domain.com" target="_blank">Ads By XYZ!</a>
</div>
<div>
<a href="[TRACKING_LINK]" target="_blank"><img src="https://servedbyadbutler.com/default_banner.gif"><img>
</div>
</div>


Result:




Making Changes:


Using CSS changes, you can adjust the positioning, color and font of the text overlay. The bottom and top parameters allow you to edit the positioning against the bottom left corner of the image, while the color and font-size parameters allow you to adjust the colors and sizes respectively.

Note: Our template uses our [TRACKING_LINK] macro already, you will simply need to edit the "Destination URL" of your ad item to the proper landing page.

Can't find what you're looking for?

Send us an email

hello@adbutler.com

Visit the blog

For more ad serving tips, industry news and AdButler insights.