Web monetization is tedious, if not unnecessarily hard.
If it's not gatekeeping problems, it's Google taking an insane cut!
I just began my monetization journey and encountered all these stressors, prompting me to look for alternatives that fix all these annoyances.
The solution must:
And many more...
I found the solution, and it's way beyond what I expected. It's as simple as adding a div element anywhere in your code—no questions asked, no domain needed.
Yes, the ads show up even on localhost! This is impossible with AdSense (an assumption, of course, since I haven't been approved, but I know a domain is a must with AdSense).
Let's dive into a simple example.
Copy the HTML below; it's a simple example:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Web Monetization</title> <style> *, *::after, *::before{ box-sizing: border-box; } body{ margin: 0; padding: 0; height: 100vh; } .main_container{ display: grid; grid-template-columns: 90% 10%; gap: 5px; height: 100%; padding: .2em; } .content{ overflow-y: auto; } p { color: black; letter-spacing: .01em; } .banner_ad{ display: flex; padding: .5em; width: 100%; align-items: center; justify-content: center; overflow-x: auto; } </style> </head> <body> <main class="main_container"> <div class="content"> <section> <h1>Web Monetization Made Easy</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime mollitia quam veritatis quisquam nostrum dicta error aliquid, facilis perspiciatis. Ipsum!</p> <section> <span class="banner_ad"></span> </section> <section> <h2>Make Passive Income with Ads</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt minima praesentium assumenda amet sit corrupti soluta similique numquam dicta quam eveniet repellendus, hic veniam iusto atque explicabo quia corporis laborum quaerat delectus placeat ex voluptatum laudantium perspiciatis? Molestiae laudantium facere eveniet ab exercitationem totam omnis quod libero nulla pariatur aspernatur aperiam praesentium fugit, animi, earum error consectetur ipsa, voluptas optio deleniti architecto fugiat. Consectetur temporibus adipisci quaerat eius libero explicabo, ut nobis nemo tenetur enim reprehenderit culpa aperiam repellendus dolorum alias assumenda velit hic consequatur magni magnam ea soluta possimus! Harum, optio eligendi? Rem, est? Illo enim saepe fugit expedita.</p> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro excepturi sequi omnis earum, molestias eius voluptatibus aut deserunt cupiditate. Alias, dolor delectus fuga officia unde laboriosam omnis, beatae sit veniam harum eius, nam officiis veritatis! Totam, vitae rem velit qui repellat assumenda laboriosam quisquam natus, facilis atque hic quia fuga.</p> </section> <section> <h3>Literally a Single Tag</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat molestias, placeat similique excepturi quos laboriosam inventore distinctio atque nam provident, eveniet, alias maiores incidunt repellendus possimus velit non ad expedita.</p> <section> <span class="banner_ad"></span> </section> </section> </section> </div> <div class="vertical_adspace"></div> </main> </body> </html>
Monetization time! This article will not cover ad optimization—maybe in the future.
For now, meet yX Media, monetization made easy.
Click the link above, scroll down to the bottom, and enter your details. You should be approved immediately. Check your email and click the necessary links. When you're done and logged in, navigate to the Ads tag tab on yllix.
These are my preferred options; you can explore what's suitable for you later (e.g., banner ad tag):
Click "get ad tag."
Copy and paste your generated tags in both spans of your HTML:
<span class="banner_ad"> <-- paste your tag here --> </span>
If you load your app in the browser, banner ads should be showing.
Let's add one vertical ad:
Change the ad format to 120x600 or 160x600.
<div class="vertical_adspace"><-- paste your tag here --></div>
Please note, at first, ads will be 'no context' ads and will take time to calibrate (3-5 days) to your content and audience.
We are monetized! All you need is traffic to start making money.
Looking for more content? Here are my favorites so far:
Studying Express Source Code a Series: Pre-Express.js Source Code Study: Object Prototypes and Mixins
Friendly Intro Systems Programing: Intro to the systems programming world with Golang a series
I post more practical and longer(non blog friendly) content on Ko-fi to level up your programming skills.
Web monetization should be as accessible as the web itself. In this article, we covered exactly that—accessible web monetization with yX Media, which makes it easy to add ads to a project, offers instant approval, requires no domain, and provides daily payments.
The above is the detailed content of How to Monetize Your Web Application: No Domain Needed Instant Approval.. For more information, please follow other related articles on the PHP Chinese website!