Add ads to Site Container space in Generatepress

Hi there,

the simplest method would be to add them to the theme sidebars.

The sidebar is ok. But Is there any way to add them in unused site container space. Thank you for your quick response.

It would require custom development. I can give you some pointers as to where to start.

First you would use a GP Hook to add a parent container with two banner divs to container your adverts. You can do that with this PHP Snippet.

add_action('generate_after_header', function() {
  ?>
  <div class="banner-container">
	  <div class="banner left">
		  Left banner advert goes here
	  </div>
	  <div class="spacer"></div>
	  <div class="banner right">
		  Right banner advert goes here
	  </div>
  </div>
  <?
},40);

This will add the containers after the header.
Now add this CSS to place it behind the main content, stick on scroll and remove it when the screen is not wide enough to accommodate it.

.banner-container {
    display: flex;
    position: sticky;
    position: -webkit-sticky;
    top: 100px;
    z-index: -1;
}

/* Set min width of banners */
.banner {
    min-width: 250px;
}

.spacer {
    flex: 1;
    height: 10px;
    pointer-events: none;
}

/* Set width for banner to be removed */
@media(max-width: 1500px) {
    .banner-container {
        display: none;
    }
}

The code is working fine with some minimal modification to css but. There are three problems.
1. white space between header and the content area. How to remove this white space?
2. The banner is not clickable even after adding hyperlink to it.
3. How can I resize both banners according to Resolution of device screen. i.e. using some percentage. So it can fit every device well.
I am new to Generatepress, switched after reading a lot of Good reviews about it. Really impressed by your support.

Do you have a link to the site where i can see what you have so far?