Modello di brace e Google AdSense

Question

Qual è il modo appropriato per includere un banner di Google AdSense in un modello Ember (Handlebars)? Dire che ho un modello per una vista che assomiglia a questo:

<script type="text/x-handlebars" data-template-name="myPageWithBanner"> 
    <div id="mainContent"> 
    Lorem ipsum main content 
    </div> 
    <div id="banner"> 
    //Normally I would insert a script tag here, but that is not possible 
    </div> 
</script> 

Ho bisogno di fare questo dal codice utilizzando i modelli pre-compilati, o c'è un modo io non sono a conoscenza?

Answer 1

Non ho un account Google AdSense, quindi non posso testarlo. Ma ci sono diversi problemi importanti qui:

1. Non è possibile includere un tag <script> all'interno di un modello di manubrio, nemmeno se si utilizzano CDATA.
2. Google AdSense richiede che JavaScript AdSense appaia testualmente nella tua pagina, oppure si tratta di una violazione TOS.
3. In base a this StackOverflow answer, AdSense su siti AJAX non è supportato al momento.
4. Il crawler di Google AdSense non sarà in grado di visualizzare alcun contenuto sulla tua pagina, quindi dubito che il targeting degli annunci funzionerà. Ma vedi sotto per alcune cose che potrebbero aiutare i crawler.

Ma suppongo, per semplicità, di poter discutere i problemi di TOS direttamente con Google, e cercherò solo di risolvere i problemi tecnici. In primo luogo, sulla base di this StackOverflow answer, ecco una possibile soluzione che consente di servire lo script di Google testualmente:

<script type="text/x-handlebars"> 
    <h1>Ember AdSense</h1> 
    {{outlet}} 
    <div id="ads"></div> 
</script> 

<script type="text/x-handlebars" data-template-name="index"> 
    <p>Hello, world!</p> 
</script> 

<div id="ads-load" style="display: none"> 

<!-- 
    Apparently this needs to appear verbatim, exactly as Google gave it to 
    you, or it's a TOS violation. 
--> 

<script type="text/javascript"><!-- 
google_ad_client = "ca-pub-XXXXXXXXXX"; 
/* Test Ad */ 
google_ad_slot = "XXXXXX"; 
google_ad_width = 250; 
google_ad_height = 250; 
//--> 
</script> 
<script type="text/javascript" 
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 

</div> 

Poi, quando i nostri principali carichi di modello, abbiamo utilizzare jQuery per spostare gli annunci nel nostro modello di applicazione:

window.App = Ember.Application.create(); 

// Explicitly declare the view class for our application view. 
App.ApplicationView = Ember.View.extend({ 
    // Called once the view is rendered. 
    didInsertElement: function() { 
     $('#ads-load').appendTo("#ads").css("display", "block"); 
    } 
}); 

Come per consentire al crawler di Google di vedere il tuo contenuto, Google ha official advice for AJAX applications, ma I don't know whether that works with the AdSense crawler. In alternativa, se stai utilizzando pushState per aggiornare gli URL visualizzati, devi assicurarti che ciascuno di questi URL possa essere visualizzato dal tuo server quando richiesto da un crawler. (Il software del forum Discourse does exactly this.)

Per favore fatemi sapere se vi avvicina di più.