Divi makes it easy to insert ads into your blog posts. Built in to Divi Theme Settings, there is a section that allows you to place an “un-widgetized” ad image/banner or adsense code under your blog post content. But, this is somewhat limiting since it only allows you to place the ad in one spot – at the bottom of your posts.
Today, I will show you how to utilize Divi’s built-in features to insert an ad below, inside, and above your blog post content.
This flexibility allows you to test for yourself which placement works best for your audience, resulting in more conversions.
Let’s get started.
Inserting Your Ad Below Your Blog Post Content
First, you need to create your ad image. If you are a graphic designer, this is fairly easy to do using a photo editing software like Photoshop. But if you are looking for an easier solution like I was for this tutorial, you can use a free graphic design software like Canva. Canva comes with free ad templates you can easily modify to fit your needs. All you need to do is create a free account. Then find the right graphic template, modify it, and download your ad image.
The dimensions for your ad image should be around 468px by 60px. My image is 728px by 90px because I want it to stretch the length of my post content.
Once you have your ad image, upload them to your media library.
Next go to Divi → Theme Settings in your WordPress dashboard and click the Ads tab. The first option you see is “Enable Single Post 468×60 banner”. Click to enable this feature.
Insert the url for your ad image next to the option that says “Input 468×60 advertisement banner image”.
Then insert your destination url for the ad next to the option that says “Input 468×60 advertisement destination url”.
Alternatively, you could insert adsense code, but for this tutorial, I’m sticking to an ad image.
Now go and check out a blog post to see your ad. Notice it has been inserted below your post content.
That’s easy enough. But now I’m going to add the functionality to insert that same ad image above your post content. To do this you will need to modify the Divi theme files via FTP.
Inserting Your Ad Above Your Blog Post Content
Before you continue, it is a good idea to create a child theme before you start making changes to the theme files. Click here to learn how to add a child theme.
Once you have a child theme created and active on your site, access your child theme files using an FTP client like FileZilla. Copy the single.php file from your Divi theme folder and paste it into your child theme folder. Make sure you keep the file name exactly the same (single.php) and copy over all of the code that was in the original file.
Open the single.php file and locate the following php code:
Copy the code and place it just above the following code:
Here is a screenshot of the single.php template highlighting the code your should copy and where to put it:
Save your template file and check out your blog post now. Your ad image should be showing above your blog post content (just below the header) and also below your content.
This method will automatically take the ad you entered in Divi Theme Setting and place it above and below every post you create. But, if you want to insert your ad on a specific post only, or if you want to insert your ad inside of your post content, use the Image Module via the Divi Builder.
Inserting Your Ad Inside of Your Blog Post Content Using the Divi Builder
Using the Divi Builder, find the section of the post where you want to insert the ad. Insert an a fullwidth column, add an Image Module, and update the follow general settings:
Image URL: [enter image url]
Link URL: [enter link url]
URL Opens: In the new tab
Save & Exit
Now you have an ad inside of your post content.
If you are reading this, you are probably interested in monetizing your website. For a helpful breakdown of how to monetize your blog using adsense, check out this post.
Also, If you are using the Extra Theme created by Elegant Themes, you can create ads using the built-in Ads Module. If you are interested, here is a overview of the Ads Module.
That’s it! I hope this helps your process of managing ads a little easier.
Feel free to post your questions and input in the comments.
The post How to Insert Ads Above, Inside, and Below Your Divi Blog Post Content appeared first on Elegant Themes Blog.