Google Adsense广告在home-track.html无法显示的技术求助

Let's break down why your ads aren't loading in home-track.html and fix it step by step:

Why the Problem Happens #

Your site is an AngularJS single-page app (SPA). When you load home-track.html via ng-view, the AdSense script already ran when index.php first loaded—it doesn't automatically detect new ad units added later to the DOM. Putting the ad in index.php works because it's part of the initial page render, but that's not where you want it.

Step-by-Step Fix #

1. Clean Up Duplicate Script References
   Remove the <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> line from home-track.html. You only need this script loaded once in index.php (you can keep that reference and just remove the enable_page_level_ads part later as planned).

2. Update the Ad Unit in Your Template
   Give your ad container a unique ID (for clarity) and make sure there's no CSS hiding it (check that hidead class isn't setting display: none accidentally):

   <div id="recent-stations-ad" style="float: right; margin: 10px 0px 10px 10px;">
       <ins class="adsbygoogle" style="display:inline-block;width:300px;height:600px"
            data-ad-client="ca-pub-123456789123456"
            data-ad-slot="1234567890"></ins>
   </div>
   

3. Trigger AdSense Refresh After Template Renders
   AngularJS loads templates dynamically, so we need to tell AdSense to scan for the new ad unit once the template is fully rendered. Add this to your recentStation controller:

   app.controller('recentStation', function($scope, $timeout) {
       // Your existing controller code here...
   
       // Wait for Angular to finish rendering the DOM, then refresh ads
       $scope.$on('$viewContentLoaded', function() {
           $timeout(function() {
               if (window.adsbygoogle) {
                   window.adsbygoogle.push({});
               }
           }, 0); // 0ms delay ensures DOM is fully updated
       });
   });
   

   The $viewContentLoaded event fires when the template finishes loading, and $timeout makes sure we wait until Angular has finished updating the DOM before calling AdSense.

4. Double-Check AdSense Setup

   • Confirm your data-ad-client and data-ad-slot values are correct (match what's in your AdSense dashboard).
   • Make sure your site is approved by AdSense—if it's a new site, you might see empty placeholders until approval goes through.

Why This Works #

By removing duplicate scripts and manually triggering AdSense's ad scan after the template loads, we ensure the ad unit is detected and rendered in the correct position within your home-track.html template.

内容的提问来源于stack exchange，提问作者Web User