Streaming live at 10am (PST)

Infield AdSense ad types (CMS)


#1

I’m creating a tech news site and am trying to put infield ads as you would on an ad-driven site.
The one ad type that the client is interested in is the INFIELD ADs.
This requires mimicking the size and style of a news card items to insert an ad inbetween news cards.
Here is how Adsense describes how to employ them:
https://support.google.com/adsense/answer/7180611?hl=en

I’ve looked at CMS Template page settings, I’ve tried looking in the Settings panel of the Designer, and I’m pretty sure these are a no go without doing some trickery like having single item collection lists on your page and using a different type of ad.

Has anyone tried inserting an ad like this on a site? I’m not sure this is a high priority for most webflow clients, but perhaps someone has tackled it.


#2

Hi, Did you find answer and is it safe to place only one code in cms collection pages , thanks.


#3

Did not find the answer to this yet. :frowning:


#4

do you use adsense if so how you use code for collection pages one code is enough no problem?


#5

You can’t do this the way Google recommends since we don’t have access to Webflow’s backend. However you can still inject ads into your content using something like JQuery.

Since you said this is for a tech site you can use JQuery to inject an ad after a particular paragraph number like say after the 4th, 10th, and 18th paragraph tag.

Here’s a JS Fiddle where I use jQuery to manually inject a div with the class “adsense-ad” after two specific paragraphs inside of the class “article-content” It should give you an idea.

http://jsfiddle.net/ve1n43de/

You essentially just need to get your adsense embed code and use this same logic to inject it after particular paragraphs.

Using jQuery you could even get it to cycle through every nth paragraph. Say for example place an ad after every 6 paragraphs or something of that sort.

Here is an example of that: http://jsfiddle.net/r9890Le3/

You can read more about targeting the nth child with jQuery here: https://api.jquery.com/nth-child-selector/

Hopefully this helps :smiley:


#6

I just realized that you’re not necessarily placing the ad between paragraphs but between news cards in a news feed. However the same logic would apply.

Since you will be using webflow’s collection system to make your news cards you’ll be targeting nested divs instead of paragraphs inside of a div. That will look like this:

#article-content>div:nth-child(2n)

It’s pretty much the same you just change the “p” tag to a “div” tag.

Hopefully this all makes sense to you :slight_smile:


#7

Thank you guys I was away so did not had chance to get back.I didn’t thınk about Google adsense , but maybe use in future :smile: have a good one.


#8

Yeah, we scrapped Goog ad strategies in favor of something else.
The general solution we were pursueing is to have two collection lists and put the ad in between them. Beyond that there really isn’t a way to do infield ads without some javascript like @Modii shared.
Best of luck.