Tutoriel: Random Adsense Layouts

Introduction

À un moment ou l'autre tous ceux qui travaillent avec Adsense va avoir l'idée de faire quelque chose avec des tailles et des positions aléatoires.
Random Adsense Taille unités sont assez facile à réaliser si vos emplacements restent les mêmes. De même, au hasard, ou tout au moins en partie aléatoire, les positions ne sont pas très difficile à faire non plus.

Im supposant que vous êtes familiers avec le processus de création de nouveaux ensembles d'annonces et de les placer dans votre page au moment d'écrire ces lignes.
Cela comprend l'ajout de canaux à des ensembles d'annonces pour le suivi.

Mise en page
Solution simple potentiels, problèmes
Prédéfinies du mode, la solution A
Tracking
Layouts Code Collecte, organisation
Sélection d'une mise en page au hasard
Ont tous été organisée, Can We Display Ads Yet?
Putting it All Together
I Thought You Said Etait-Display Time!
Conclusion

Mise en page

La première chose à faire est de visualiser nos pages de présentation, et de déterminer espaces publicitaires potentiels.
Cela rend les choses beaucoup plus facile si vous préparez un layout fantaisie dans une application d'édition d'image. J'utilise Adobe Fireworks parce que sa ce que j'ai et la prise en charge intégrée tracé vectoriel est facile à travailler. Il supporte aussi les calques.

Cette image montre un schéma de blog commun. Theres un en-tête, une barre latérale, et les blocs de poste.
Les contenus sont notées en utilisant les blocs de brun, et les ensembles d'annonces possibles sont notées avec les blocs verts qui ont des bords noirs.
Notez la façon dont chaque emplacement potentiel est étiqueté.

Solution simple potentiels, problèmes

La première chose que vous devriez remarquer est qu'il ya onze emplacements potentiels et certains d'entre eux sont overlaping eachother.
La seule chose simple à faire serait de créer un nouvel ensemble d'annonces que corosponds à chacun de ces créneaux potentiels et donner à chaque unité de son programme AdSense propre chaîne de la suivre, puis le programme d'installation du code de randomisation rapide qui ramasse trois fentes et les affiche.

Theres un problème avec cette though.

Qu'advient-il si K fente et Slot I sont sélectionnés, mais slot J est pas?
Nous aurions le gaspillage d'espace à côté de la fente de K et d'une barre latérale adwise bondé, thats what.

Que faire si créneaux G et E ont été sélectionnés?
La présentation serait sans doute Just Push Quelle que soit la dernière a été généré bas de la page un peu, mais cela nous donne encore des annonces bondé et l'un d'eux n'est vraiment pas à l'endroit prévu de toute façon.

Prédéfinies du mode, la solution A Maintenant, nous savons que nous pouvons afficher que trois ensembles d'annonces à la fois (pas y compris les liens d'unités) selon les directives de Google, si ce que nous devons faire est d'arriver à quelque trois configurations possibles unité en utilisant notre image d'avant.
C'est là que la gestion des calques dans Fireworks est très pratique, il est beaucoup plus facile de créer des maquettes de mise en page en utilisant l'image sous existante potentiels avant tout en cachant un peu de vecteurs / couches.

Dans l'image suivante, vous verrez quatre aménagements potentiels tels ensembles d'annonces je mettre en place des créneaux horaires potentiels.
Il ya certainement beaucoup plus de combinaisons possibles, mais les quatre autres devraient être amende pour l'exemple.
Notez que chaque structure possède une étiquette de numéro dans son coin.
Note sur les flèches pour but de signifier que la partie inférieure de la mise en page se levait dans ces schémas.

Attachments:

[tuthead=tracking] Tracking

Maintenant que nous avons quelques aménagements potentiels compris sans aucune colissions, son temps de penser à comment nous voulons le suivi de ces.
Encore une fois, la chose facile à faire serait de créer des ensembles d'annonces avec leurs propres canaux et de réutiliser le code de l'unité même dans chaque mise en page.

Theres un problème avec cela cependant.

Par exemple regarder slot C, son inclus dans trois des quatre plans. Que faire si slot C est seulement cliqué quand il est en mise en page 3?
Il serait certainement bon de savoir cela. Il nous savons que nous pouvons essayer certains des créneaux autres mises en page 2 et 4.
Si nous gardons nos dossiers et les délais droite, nous pouvons également comparer les nouvelles mises en page à l'ancienne, peut-être un échange de créneaux horaires inactifs avec un autre emplacement causé la clics l'ensemble pour cette mise à tomber.
Parfois, il ya ce que j'appelle Sacrificial Annonces qui n'existent que pour soutenir d'autres annonces sur la page.

Ainsi, plutôt que de créer de nouvelles unités avec la mentalité des logements au total potentiel, nous créons de nouvelles unités avec la mentalité des layouts.
La bonne chose à propos des unités Adsense est que vous pouvez appliquer plusieurs canaux à des parts, de sorte que son encore possible de suivre chaque unité individuellement aussi bien.

Avant de créer ces ensembles d'annonces, je vais dans ma Adsense Channel Manager et créer les chaînes suivantes.

A, B, C, D, H, I, J, K (8 au total)
A4, B1, C2, C3, C4, D2, H4, I2, J1, J3, K1, K3 (12 au total)

Pour un total de 20 chaînes.
Notez la façon dont les créneaux horaires et les numéros de mise en page sont inclus dans chacun des canaux secondaires.

Vous voyez maintenant les quatre exemples que vous pourriez être tenté de supprimer les chaînes pour B1 et A4, ainsi vous ne devez pas créer autant de canaux, mais n'en ont pas. Comment allez-vous les distinguer des autres mises en page que vous créez dans le futur si vous ne traquent pas maintenant?
Vous aussi vous ne voulez pas de créer tout un tas d'ensembles d'annonces en ce moment non plus, juste attendre.

Layouts Code Collecte, organisation

Maintenant que nous avons une idée de ce qui se passe pour aller où, nous pouvons recueillir le code Javascript que Google Adsense nous donne et commencer à travailler sur une façon de regrouper les codes dans des mises en page.

Voici un exemple de ce que Adsense nous donne à mettre dans la page. Fondamentalement son réglage des variables globales dans un bloc de script, et en utilisant un script d'affichage générique en dessous.
Allaient faire quelque chose de similaire, mais pas exactement.



Maintenant, en supposant que je commence avec une mise en page, je crée trois nouvelles unités requises pour remplir cette mise en page et de recueillir le code.
Pour la composition de l'ILL ont une une unité avec des canaux B et B1, qui va me donner un code, une unité avec des chaînes J et J1 pour un autre morceau de code, et de même pour K et K1.

Or, dans mon éditeur de texte, en utilisant un fichier vide, je veux créer quelque Developments Javascript de base pour mettre ces unités po



adsense_manager est un nouvel objet conçu pour garder tous nos codes bien en ordre.
Le layouts propriété de l'objet adsense_manager seront utilisés pour stocker des tableaux multiples, chaque tableau comportera plusieurs objets.


Dans cette place, je peux commencer à peupler le tableau mises en page avec de nouvelles informations layout organisé.
Notez la façon dont chaque indice corosponds à un certain nombre de disposition.
Notez la façon dont chaque objet a le code Adsense et un slot_id corosponding à la fente dans le diagramme à partir plus tôt.
Notez que 2-4 ont été tronquées pour l'exemple.

TRES IMPORTANT : Assurez-vous que vous entourer vos valeurs google_ad_slot avec des guillemets, utiliser des nombres entiers (sans les guillemets) vous donnera des résultats inattendus !



Maintenant vous pourriez être tenté d'utiliser push , unshift , Ou les fonctions autre tableau pour ajouter des éléments au tableau de mise en page, ne pas.
En utilisant les indices de tableau qui corospond à la mise en page, il est plus facile à trouver et à supprimer cette disposition de la rotation plus tard.

Sélection d'une mise en page au hasard

Maintenant que nous avons quelques aménagements potentiels et de leurs emplacements potentiels dans toute s'organise, on peut réfléchir à un schéma de sélection aléatoire.
Il se trouve que j'ai une fonction pour faire cela.



Fondamentalement, ce que la fonction sert notamment à créer une enqueued_units objet qui est une propriété de la adsense_manager .
Il décroche ensuite un schéma aléatoire de la layouts tableau, et remplit la enqueued_units objet en utilisant les annonces slot_id propriétés comme identificateurs.

Définie manuellement, le enqueued_units objet serait ressembler à ceci si le numéro un réseau ont été sélectionnés.

Nous & #39; Re tous Organisé, Can We Display Ads Yet?

Affichez des annonces dites-vous?
Ive a obtenu une fonction pour ça!



Fondamentalement, ce que cette fonction ne soit accepter un slot_id argument et si cette fente est présente dans le enqueued_units objet qu'elle s'affiche de cette fente.
Parce paramaters Google Adsense sont des variables globales, nous pouvons mettre ceux à la valeur de nos propriétés de mise en objets puis écrire la ligne de script générique généralement observé à la fin du code AdSense dans le document.

Une chose encore à la toute fin de ce code.
Nous créons une variable pour stocker la valeur de retour de la adsense_manager.enqueue_random_layout fonction.
Cela nous donne quelque chose de petit et facile à vérifier plus tard pour voir si nous avons en queue unités.

Putting it All Together

L'une des choses à ce sujet est impressionnante allaient être en mesure de ranger la majorité de cette nouvelle Javascript dans un fichier externe, ce qui signifie que répéter les visiteurs ont de la charger une fois.
Heres un coup d'oeil à tous de ce nouveau code tous mis ensemble et prêts à stocker dans un fichier nommé "adsense_manager.js".



Normalement, vous allez vouloir mettre le Javascript comme celui-ci vers la fin de votre document avant la balise </ body>, afin que le contenu se charge plus rapide, mais dans ce cas vous devoir ont cette charge avant la balise </ head> tag à la place.
La page sera d'utiliser ce script dans toute la construction de la page et les unités de lieux AdSense à l'aide document.write, si Adsense essaie de document. écrire après que le document a chargé son aller vider le document et tout ce que vous avez est une annonce sur la page.

I Thought You Said Etait-Display Time!

Il est, regardez ici.

Rappelez-vous que diagramme, nous regardaient pendant le début de ce tutoriel qui avaient les créneaux horaires avec les étiquettes sur eux?
Eh bien maintenant où on place les petits extraits de code JavaScript dans les lieux de nos HTML où ces unités irait.

Disons par exemple que nous allons aborder le I, J et K unités theyre depuis à peu près tous au même endroit là. La barre latérale.
Supposons que ceci est notre encadré HTML avec l'ancien style de code Adsense pour l'unité I.



Maintenant passons à regarder après que nous avons notre adsense_manager chargé et nous voulons placer le potentiel I, J, K et les créneaux horaires.



Un autre exemple, cette fois pour l'unité A dans l'en-tête.




Le adsense_manager n'affichera que l'unité passée à la fonction d'affichage si cette unité a été ajoutée à la enqueued_units objet.
Sinon, il se comportera comme une zone vierge de script et tout ira colapse autour d'elle comme elle le ferait si il n'y avait pas de code là du tout.
La meilleure partie, c'est que nous disposons de solutions simples fonctions propres qui le rendent facile à placer du code en utilisant le schéma de mise en page, nous configurons avant nous rien d'autre.

Conclusion

Ironiquement, theres jamais à une conclusion quand il s'agit d'Adsense et les choses que vous pouvez faire avec lui.
L'étape suivante une fois que vous obtenez ce compris et mis en œuvre sera probablement à expérimenter avec des configurations différentes. Après cela, vous pouvez envisager influencé votre mise en page de sélection aléatoire avec la largeur de la fenêtre du navigateur.
Après cela, vous êtes seulement limité par votre imagination. gif "alt =": D "title =" très heureux ">