Continuing the series of posts about the static website generator Jekyll, this article covers how to add and configure the monetization option from Annonymous Ads.
What is Annonymous Ads?
Annonymous Ads is a website that provides various monetization options for both websites and applications. You could say it is a service similar to AdSense (from Google), but with some differences:
It does not collect any information about the visitors who access websites, unlike AdSense, which collects information on a massive scale (like any other Google product).
Payments to developers are made in Bitcoins (BTC) instead of US dollars. This can be an advantage or a disadvantage, since the price of Bitcoin fluctuates considerably (at the time this article was written, 1 BTC = 8363 EUR).
Creating an ad unit
Before adding any code to our page, we must create an ad unit on the Annonymous Ads website. Ads can be created without having an account on this website, but registering is more convenient so that all our units are together.
After creating the account, go to the *Earn* tab to create the ad unit:
Type
In the first section, we are asked for the size at which our ad will be displayed. This field can be customized to our liking; a good size for a standard banner might be 320x50, where all units are in pixels.
We are also asked to add the page where it will be displayed.
Content
Now we can select the types of ads we do not want to display on our website. The more we select, the less we earn, since we impose more restrictions.
Payment information
If we are signed in, we can choose to save the money earned in our account or add a bitcoin wallet to receive the amount there. If we are not signed in, we can only choose the second option.
Adding ads to the website
Next, the page returns HTML code for inserting that file into our website as an `iframe`. Copy that code and add it to a new HTML document inside the `_includes` folder of our Jekyll project. For example, we name this file `ads.html` and paste the ad code into it.
Tip
An HTML tag called `center` can be added before the `iframe` to center the ad on our website. This is useful for horizontal banners that we want to look like this:
The `center` tag must then be closed. For more information about `center`, you can consult the documentation at this [link](https://www.w3schools.com/tags/tag_center.asp). In certain versions, this tag **is not supported**.
After adding this HTML, it must be included in the part of the page we want. It can (of course) be added more than once on the same page and several times in the different templates as well.
To do this, simply open the MarkDown (.md) file for the page where we want to implement advertising and add the following line:
`{% include ads.html %}`
Note
It can also be added to HTML files in the same way. Different ad units with different sizes and content can be created. To do this, simply repeat the process of creating HTML (with a different name for each one) and include it as described above.