Publisher Resources
Get Code for Search Ad Type: A Step-by-Step Guide to Implementing AdSense for Search (AFS)
Tracy Nguyen
December 26, 2024
Subscribe to receive the latest blog posts to your inbox every week.
By subscribing you agree to with our Privacy Policy.
Google AdSense offers a powerful way to monetize your website through search ads. With AdSense for Search (AFS), you can integrate ads into your site’s search results, providing users with relevant ads based on their search queries. This not only enhances the user experience by presenting targeted ads but also boosts your revenue as an advertiser.
However, to implement these ads successfully, you need to follow a few simple steps to generate and insert the code correctly. In this guide, Gamob will walk you through the process of generating the code for a search ad type and how to integrate it into your site. This includes everything from setting up your AdSense account to embedding the code in your HTML.
What is AdSense for Search (AFS)?
AdSense for Search (AFS) allows you to add a search box to your site, integrated with Google’s search engine. When users search, relevant ads appear alongside organic results, based on their query keywords. This targeted approach boosts user engagement and increases ad relevance. AFS is an excellent way to generate more revenue, especially for sites with high search traffic, as it delivers ads that closely match user intent, improving click-through rates and conversions.
>> Read more to know: What is Adsense for search?
Setting Up AdSense for Search
Setting up Adsense for search (AFS) is one of the important steps in the process of Adsense for search. Here are 3 main steps to set up its:
Step 1: Log in to Your AdSense Account
The first step to implementing AFS on your website is to log in to your AdSense account.
- Visit the Google AdSense website: Open your browser and go to Google AdSense.
- Sign in: Use your Google account credentials to sign in to your AdSense account. If you don’t already have an account, you’ll need to sign up for one and wait for approval.
- Access the Ads Section: After logging in, navigate to the "Ads" section of the dashboard, which is where you’ll find the options to create and manage ad units for your website.
Step 2: Access Search Ad Types
Once you’ve logged in, you’ll need to create a new search ad unit.
- Click on "Ads for Search": On the AdSense dashboard, find the section titled "Ads for search" or "Search ads" under the Ads tab.
- Select "Search Styles": Here, you will be able to choose from various search ad styles that best match the layout of your website.
Google offers several pre-designed search ad styles, but you can also customize these to match the design of your site. The choice of style will depend on how you want the ads to look in relation to the search results and the overall user experience you want to provide.
Step 3: Generate the Code for Your Search Ad
Once you’ve selected the search ad style, the next step is to generate the embed code. The following steps will guide you through this process:
- Click on the "Get Embed Code" Icon: After selecting the desired search style, look for the button or icon that says "Get Embed Code" or "Get Code for Search Ad Type." Clicking this will open the code generation page.
- Open the "Code Generator" Page: The page will display a preview of your search ad along with two main code snippets: one for the <head> section and one for the <body> section of your HTML page.
>> To be more full steps of setting up Adsense for search (AFS), let’s read: 7 Simple and Easy Steps to Set Up AdSense for Search for Beginners
Understanding the Code Generation Page
On the code generation page, you will need to input certain details and configure the HTML structure of the search ad. Below are the key components:
- Ad Container Settings: In the "Ad Container" section, you’ll add the HTML <div> code of the ad container that you’ll be inserting into the search results page. This is where the ad unit will be placed within your page.
- Default Container Name: You can either use the default container name (e.g., afscontainer1) or customize the DIV ID to fit your site’s structure. It’s important that the ID matches the corresponding DIV on your page where you want the ads to appear.
- Add Additional Containers (Optional): If you want to add additional ad containers to different areas on your page, you can click the "+ Add Container" button and generate separate code for each container.
- Copy and Paste Code into Your Site: After configuring the container, you’ll be provided with two separate snippets of code:
- Code for the <head> Tag: This snippet needs to be pasted into the <head> section of your search results page. This will load the necessary JavaScript to display the ads properly.
- Code for the <body> Tag: This code should be pasted into the <body> section of your search results page, where the search results and the ads will be displayed.
Step 4: Embedding the Code in Your Website
After generating the code, follow these steps to embed it into your website’s search results page:
- Access the HTML of Your Search Results Page: Open the HTML file or the content management system (CMS) editor of your website where the search results are displayed.
Insert the <head> Code: Paste the first code snippet (the one for the <head> section) inside the <head> tag of your HTML. This will include the necessary scripts to enable the ads to show up correctly.
html
Copy code
<head>
<!-- Paste the head code here -->
<script type="text/javascript" src="..."></script>
</head>
Insert the <body> Code: Next, paste the second code snippet (the one for the <body> section) where you want the search ads to appear on the page. This will likely be after the search results but before any other content.
html
Copy code
<body>
<!-- Paste the body code here -->
<div id="afscontainer1"></div>
</body>
- Update the DIV ID (if necessary): If you’re using a custom DIV container name, make sure the ID in your code matches the ID you’ve specified in the AdSense code generation page.
Step 5: Confirm and Finalize
Once you’ve inserted both code snippets, it’s important to check that everything is working correctly.
- Preview Your Page: Open your website’s search results page in a browser to see if the search ads are displaying as expected. The search ads should be visible alongside the search results, with a clean and user-friendly design.
- Test the Ad Functionality: Perform a search on your site and ensure that the ads match the search query. You can click on the ads to verify that they lead to the correct landing page.
- Click "Done" in AdSense: Once you’ve confirmed that the ads are properly integrated, go back to your AdSense account and click on the "I’m Done" button on the code generation page. This finalizes the integration process.
Example of Search Ad Code Integration
Below is an example of how the search ad code would look after embedding the necessary snippets into the HTML of your search results page:
html
Copy code
<head>
<!-- Google Search Ad Code for Head -->
<script type="text/javascript" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
</head>
<body>
<!-- Your search results go here -->
<div id="search-results">
<!-- Search results content -->
</div>
<!-- Google AdSense Search Ad Code -->
<div id="afscontainer1"></div>
<script type="text/javascript">
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</body>
Troubleshooting and Best Practices
If your ads aren’t showing up or if you encounter errors during the integration process, consider the following troubleshooting tips:
- Check Your AdSense Account: Make sure your account is approved and that there are no policy violations preventing ads from showing.
- Review Code Placement: Double-check that the code snippets are correctly placed within the <head> and <body> sections of your page.
- Check JavaScript: Ensure that your browser or website doesn’t block JavaScript, as it’s necessary for displaying ads.
- Mobile Optimization: Ensure that the ad container is responsive and displays correctly on mobile devices.
Implementing AdSense for Search (AFS) is a simple and effective way to monetize your website’s search results. By following these steps—logging into your AdSense account, generating the code, and embedding it into your search results page—you can begin displaying targeted ads that will enhance your revenue. Remember to always test the integration to ensure a seamless experience for your users, and adhere to AdSense guidelines to avoid any issues with your ads.
Instead of researching and deploying AFS, you can choose Gamob as your AFS development partner. Gamob is Google Certified Publishing Partner (GCPP) that empowers over 10,000 publishers helping them deliver expert solutions in Product and User Acquisition Consultancy, Revenue & Inventory Optimization, and Inventory Quality Assurance. Our mission is to boost publishers' and ad networks' success, ensuring quality, efficiency, and sustainable growth through trusted, innovative partnerships.
---------------------
Gamob | GCPP - Empower your monetization journey
- Email: [email protected]
- Website: www.gamob.com
- Linkedin: www.linkedin.com/company/gamob-gcpp
LATEST
Stay informed with our latest blog posts.
The race to increase revenue for publishers is called Adsense for search (AFS)
Tracy Nguyen
January 10, 2025
New year, new journey! Let Adsense for search version 2025 bring the wealthy and luck for publishers.
Tracy Nguyen
January 10, 2025
Is it easier to start the Adsense for search?
Tracy Nguyen
January 10, 2025