I need help with ad placements

[DragonBallZMods]

Hello Apex Support and other users.

I need help with the placements of my ads from google onto my website.
The plugins that are normally designed to give me the features of ad placements cannot place them where I want.

So I made a picture of how I want my ads to display on the X Theme Template. Now I am wondering what code do I need
to use, in order to get the same result as shown in my picture?

Thanks in advance!

• UltraV

[Prasant]

Hello @DragonBallZMods,

Thanks for asking.

I suggest you to please take a look at the solution provided by my colleague in following thread.

Customising Header - advertising

Thanks.

[DragonBallZMods]

Hello Prasant,

That seems to help me quite some bit. But I still need to place 2 more ads on the right and the left of the website box.
These are not for the navbar.

Thanks in advance!

• UltraV

[friech]

Hi UltraVegeta,

Since you need to have a space on the left and right of your site for the ads, please set your Site Layout to a Boxed type first, to do this, navigate to X > Theme Options > Layout and Design set the Site Layout to Boxed and reduce your SITE MAX WIDTH to give enough space for your left and right ads.

Then add this to Theme Options > CSS, make sure you add this code because this is the code that will position the banner on left and right.

.rightads-float{
	right: 0px;
	position: fixed;
	text-align: center;
	top: 20%;
}

.leftads-float {
	left: 0px;
	position: fixed;
	text-align: center;
	top: 20%;
}

And then install an x-child theme because you’re going to need it (How To Setup Child Themes).
After you successfully installed a child theme, make sure you activate it (Appearance > Themes).

Now the fun part starts, log-in to your server via FTP. I advise you use FileZilla client for downloading and uploading the files on your site. Obviously, you need FTP credentials, if you don’t have an FTP credentials please contact your hosting and ask how you can get one.

After you successfully log to your site via FTP, navigate to \wp-content\themes\x-child and open/edit the functions.php file. And add the following codes.

/*Float left banner*/
function leftbanner_ad() { ?>
  <div class="leftads-float">

    <!-- YOUR GOOGLE ADS CODE HERE -->
  
  </div>
<?php ;}
add_action('x_before_site_end','leftbanner_ad', 30);


/*Float right banner*/
function rightbanner_ad() { ?>
<div class="rightads-float">

  <!-- YOUR GOOGLE ADS CODE HERE -->

</div>
<?php ;}
add_action('x_before_site_end','rightbanner_ad', 40);

Replace the lines: <!-- YOUR GOOGLE ADS CODE HERE --> with your actual ads code. Save the file and check the site.

Hope it helps,
Cheers!

[DragonBallZMods]

Thank you so much! It works perfectly.

Now the only last think that I need, is a piece of code that does not show it on any mobile device.

Since the ads will overlay the screen and could be a big problem for people trying to use the website.

Thanks in advance!

Best Regards,

UltraV

[friech]

Hi UltraV,

Please add this to Theme Options > CSS

/*hide left and right ads on mobile*/
@media (max-width: 767px) {
	.leftads-float,
	.rightads-float {
		display: none !important;
	}
}

Hope it helps,
Cheers!