rehype.js plugin that automatically inserts Google Adsense (and theoretically any ad service) code.

This plugin inserts an ad code for each specified number of paragraphs. For example, insert Google Adsense display ad code every 5 paragraphs.

(Unlike Google Adsense's automatic ads) no ad code is inserted into blockquote or list items!

npm install rehype-auto-ads

import remarkParse from "remark-parse";
import rehypeStringify from "rehype-stringify";
import remarkRehype from "remark-rehype";
import { unified } from "unified";
import rehypeAutoAds from "rehype-auto-ads";

const options = {
    adCode: "<AD_CODE>",
    paragraphInterval: 2,
    maxAds: 3
};

const processor = unified()
    .use(remarkParse)
    .use(remarkRehype)
    .use(rehypeAutoAds, options)
    .use(rehypeStringify);

const markdown = `
# Hello, world!

This is a paragraph.

This is a paragraph.

This is a paragraph.

This is a paragraph.
`;

processor.process(markdown).then((result) => {
    console.log(result.toString());
});

The above code will output the following:

<h1>Hello, world!</h1>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p><AD_CODE>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p><AD_CODE>

export interface RehypeAutoAdsOptions {
    adCode: string;
    countFrom?: number;
    paragraphInterval?: number;
    shouldInsertAd?: (args: {
        vfile: VFile;
        previousNode: Root | ElementContent | Doctype;
        nextNode: Root | ElementContent | Doctype | null;
        ancestors: (Root | Element)[];
    }) => boolean;
    maxAds?: number;
    excludeWithin?: string[] | ((defaults: string[]) => string[]);
}

The ad code to be inserted. For example, Google Adsense display ad code.

When a string is provided, it will be used as-is for all ad insertions.

When a function is provided, it will be executed each time an ad is inserted with a parameter indicating which ad is being inserted (1 for first ad, 2 for second ad, etc.), allowing generation of different ad code based on position.

Initial value of paragraph counter. In other words, this value should be set to the value of paragraphInterval minus the number of paragraphs you want to insert the first ad.

If you want to insert ad code from the third paragraph and every 5 paragraphs, set this to 2.

Default: 0

The value indicating how many paragraphs to insert advertising code. For example, specifying 5 will insert ads every 5 paragraphs.

Default: 5

Function to determine whether to insert an ad code. If this function returns true, the ad code will be inserted. The default implementation always returns true.

Receives a single object argument with:

• vfile: vfile of the current file.
• previousNode: The previous node of the insertion point.
• nextNode: The next node of the insertion point.
• ancestors: Ancestors of the previousNode.

The maximum number of ads to be inserted.

Default: Infinity

Controls which ancestor elements should prevent ad insertion.

Default: ["aside", "blockquote", "ul", "ol", "li", "table", "pre", "code", "figure"]

When specifying an array, the default list is replaced entirely.

.use(rehypeAutoAds, {
  adCode: "<AD_CODE>",
  excludeWithin: ["pre", "code"]
});

When specifying a function, the current defaults are passed as an argument, allowing you to extend the defaults.

.use(rehypeAutoAds, {
  adCode: "<AD_CODE>",
  excludeWithin: (defaults) => [...defaults, "custom-element"]
});

npm install

npm run build

npm run format
npm run lint

npm run test

This repository uses Changesets to manage versioning and releases. When creating a pull request, please run the Changesets CLI and commit the changeset file.

npx changeset