Jekyll One

QuickSearch

AdSense is an advertising platform provided by Google that allows website owners and content creators to earn money by displaying targeted advertisements on their online properties. It is one of the most popular and widely used advertising networks on the internet.

It’s important to note that AdSense has policies and guidelines that publishers must adhere to. Violations of these policies can lead to penalties or even account suspension. Publishers need to ensure that their content and website comply with the AdSense program policies to maintain their eligibility for the program.

For compliance reasons (GDPR/Europe, CPRA/USA), website visitors must accept cookies for personalization. If the user rejects personalization, the Advertising module for Google Adsense is disabled on all pages. No advertising is used and all Cookies placed by Google AdSense (if any) are removed automatically.

Benefits using AdSense

With AdSense, website owners can participate in the program to monetize their websites, blogs, or YouTube channels. AdSense provides a way for publishers to generate revenue by displaying relevant ads matched to their site’s content or videos When a visitor clicks on an ad displayed through AdSense, the website owner earns a portion of the revenue generated from that click. The amount earned per click can vary depending on factors such as the advertiser’s bid, the ad’s keywords' competitiveness, and the website’s overall performance.

AdSense uses contextual targeting to display ads relevant to the website’s content. Using the service means that the ads are tailored to match the interests of the visitors, increasing the likelihood of clicks and conversions for advertisers. Google handles the entire ad selection, delivery, and payment process, making it a convenient solution for website owners who want to monetize their online presence. AdSense also provides various customization options, allowing publishers to control the appearance and placement of ads on their websites.

J1 Integration

To make the implementation of Google Adsense as easy as possible, no programming is needed. J1 Template integrates Adsense by placing all required code (HTML- and Javascript code) by the Advertising module automatically.

Setting up the Adsense integration is a simple three step process:

  1. Configure the ads you have already configured with the Google Adsense home page, with the module configuration file advertising.yml located in the _data folder (modules).

  2. Place your ads in the source code of your pages. The integration does not need any programming. Use the Asciidoc extension gad:: to place a container identified by the id you have given with the first step.

  3. Activate the Adsense integration module on all pages Google Ads should be used by requesting the module in the front matter.

On pages, the integration is activated, enabling adversting is done by:

  1. Placing the Google Adsense API (Javascript code) in the <head> section of your page.

  2. Writing the required HTML code for all ads placed in the configured containers of a page.

  3. Activating all ads placed in all containers of a page.

First, find common examples of how Google Ads are integrated into the pages of your website. If your site is successfully registered with Adsense program, you can define individual ad blocks from the main menu under Advertisement. Choosing the right ad type for Google AdSense depends on a variety of factors, including your site’s layout, the type of content, and the preferences of your audience.

Examples

When choosing the type of ad, it’s important to keep your visitors' user experience in mind. Ensure the ads aren’t overly intrusive and don’t unduly interfere with your site’s content. Experiment with different ad types and monitor performance to see which ones work best for your site and goals to achive best results for monetizing.

Type Display

A practical all-around solution for Google Ads is the type display that can be used anywhere on your site. The type display is typically used as a delimiter element between the landing page’s main sections.

Configuration example
# ------------------------------------------------------------------------------
# Ad on slot id "5128488466" (Type Display)
#
- ad:
  # container settings
  # ----------------------------------------------------------------------------
  enabled:                        true
  id:                             ad_5128488466
  layout:                         page
  content_page:                   preview_google_adsense
  # ad properties
  # ----------------------------------------------------------------------------
  publisherID:                    ca-pub-3885670015316130
  test:                           "off"
  styles:                         "display:block;"
  slot:                           5128488466
  ad_layout:                      display
  ad_format:                      auto
  ad_responsive:                  true

Type In-Article

A common type for Google Ads is the type in-article. The In-Article format adapts to your website and is well suitable for content pages of type page or post (article) using a lot of text sections (chapters).

Configuration example
# ------------------------------------------------------------------------------
# Ad on slot id "7522184684" (Type In-Article)
#
- ad:
  # container settings
  # ----------------------------------------------------------------------------
  enabled:                        true
  id:                             ad_7522184684
  layout:                         page
  content_page:                   preview_google_adsense
  # ad properties
  # ----------------------------------------------------------------------------
  publisherID:                    ca-pub-3885670015316130
  test:                           "off"
  styles:                         "display:block; text-align:center;"
  slot:                           7522184684
  ad_layout:                      in-article
  ad_format:                      fluid

Setup

Setting up the Advertising requires to enable the module on every page by requesting the module to be loaded by the resources record. Add the id of the module advertising to enable the processing the ads you have configured.

Front matter settings (resources)
title:                                  Google Adsense
tagline:                                Preview  Advertising
...
resources:                              [ clipboard, rouge ]
...

Asciidoc Extension

Making ads on a page easier, the Asciidoc Extention gad:: supports you in placing a container into your source code. While your page is being processed by Jekyll, the module places a <div> element and fills in on module initialization.

//gad::ad_id[role="additional container classes"]
Example
//gad::ad_5128488466["mt-6 mb-6"]

The HTML code generated for an ad (id ad_5128488466) looks like so:

Generated HTML code
<div id="ad_5128488466" class="gad-container mt-6 mb-6">
  <ins id="ins_ad_5128488466"
    class="adsbygoogle"
    style="display:block;"
    data-ad-test="on"
    data-ad-client="ca-pub-1234567890123456"
    data-ad-slot="5128488466"
    data-ad-format="auto"
    data-full-width-responsive="true">
  </ins>
</div>
On module initialization, all <div> elements get registered with Google AdSense to fill the container by active advertising code.

Module Configuration

The module configuration requires first to set your publisherID globally to register a page with Google AdSense. In a second step, all ads (ad blocks, slot ids) registered with your AdSense account are to be defined.

# ------------------------------------------------------------------------------
# User settings
#
settings:
  enabled:                              true
  google:
    publisherID:                        <your-publisher-id>
    autoHideOnUnfilled:                 false
    addBorderOnUnfilled:                true
  # ----------------------------------------------------------------------------
  # All advertising container/ad available
  # ----------------------------------------------------------------------------
  ads:
    # --------------------------------------------------------------------------
    # Ad on slot id "5128488466" (Type Display)
    #
    - ad:
      # container settings
      # ------------------------------------------------------------------------
      enabled:                        true
      id:                             ad_5128488466
      layout:                         home
      # ad properties
      # ------------------------------------------------------------------------
      publisherID:                    ca-pub-1234567890123456
      test:                           "on"
      styles:                         "display:block;"
      slot:                           5128488466
      ad_layout:                      display
    # --------------------------------------------------------------------------
    # Ad on slot id "5128488466" (Type Display)
    #
    - ad:
      # container settings
      # ------------------------------------------------------------------------
      enabled:                        true
      id:                             ad_5128488466
      layout:                         page
      # ad properties
      # ------------------------------------------------------------------------
      publisherID:                    ca-pub-1234567890123456
      test:                           "on"
      styles:                         "display:block;"
      slot:                           5128488466
      ad_layout:                      display
      # ------------------------------------------------------------------------
      # Ad on slot id "4814313879" (Type Multiplex)
      #
      - ad:
        # container settings
        # ----------------------------------------------------------------------
        enabled:                        false
        id:                             ad_4814313879
        layout:                         page
        # ad properties
        # ----------------------------------------------------------------------
        publisherID:                    ca-pub-1234567890123456
        test:                           "on"
        styles:                         "display:block;"
        slot:                           4814313879
        ad_layout:                      multiplex
Disable (enabled set to false) for all Ad IDs the are NOT used on any page.

Properties

Find all property settings for ad blocks below.

Table 1. Property settings
Prperty Values Default Description

styles

string

none

Defines the CSS styles applied on an specific advertising. Contains CSS classes separated by an colon (;). Taken from the ad-code generated by Adsense.
Example: display:block; text-align:center;.

publisherID

string

ca-pub-number|pub-number

Defines the publisher id used for an advertising. Current accounts at Adsense using the format of ca-pub-1234567890123456 (fake id).

ad_layout

string

none

Specifies the layout of the ad. Taken from the ad-code generated by Adsense.
Example: in-article.

test

string (on|off)

off

For testing only. If test is enabled (on), clicks and impressions not recorded by the service and advertisers are not charged. If tests are done on localhost, property test must set to on.