Développements - Plugins
![Blogger - Développements - XML plugins and examples](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2741I7nLZHSOFQBsaKfuZ0n2uYaW2Kr6yQclpVrGtDzo_5wdtD9Zhu_B1d9i9iS9RHVVoh6uCZvWwdHDx5D12ttyWW6v4ouYBkFcr_xwWnPkCG9IZREk6eudmpgvDTFqHlFlSLnHJehYe/s600-rw/DEV.jpg)
Blogger est le synonyme de illimité. Laissez libre cours à votre imagination en installant du prêt-à-porter sur votre blog ou en créant vos propres plugins.
Les plugins
Des générateurs de boutons de partage, de badges de profil, de timelines, de lecteurs de musique/vidéos, de gadgets, pour équiper votre blog. La solution rapide et idéale si vous débutez.
Sélectionnez un plugin, choisissez vos réglages, prévisualisez et suivez les instructions d'installation.
Les boutons de partage
Donnez la possibilité à vos lecteurs de partager vos publications sur le web.
Les boutons d'abonnement et badges de profil
Les boutons et badges permettent à vos lecteurs d’interagir aisément avec vos profils sociaux.
Les timelines
Montrez à vos lecteurs que vous êtes actif sur les réseaux sociaux.
Les contenus sociaux
Agrémentez votre blog avec du contenu en provenance de réseaux sociaux.
Les lecteurs
Ajoutez des vidéos, des lecteurs de musiques et respirez un bon coup avant d'appuyer sur PLAY...
Les scripts des plugins sociaux
Chaque réseau à ses propres plugins. La plupart ont besoin d'un fichier JS qui doit être ajouté dans le code du thème afin qu'ils puissent travailler. Mettez-vous à jour.
Les gadgets Blogger
Les gadgets officiels Blogger à la sauce Blogger Code PE.
Installer des plugins
Les tutos ci-dessous sont spécifiques aux plugins que nous vous proposons. Ils vous permettent de localiser des emplacements dans le fichier XML de votre thème. Pour quasiment tous les cas, vous devez accéder à l'éditeur.
- UI
- Thème
- Menu Personnaliser
- Modifier le code HTML
Attention !
Les méthodes de localisation des codes dans nos tutos ont été écrites pour l'UI-2010.
Dans l'UI-2020, les emplacements à trouver sont identiques, mais les balises sont toutes déployées. Ce qui rend vos recherches un peu fastidieuses.
Malheureusement, à l'heure actuelle, nous sommes prisonnier d'une attente de la part de l'équipe Blogger, mais nous mettrons à jour les méthodes de localisation dés que les évolutions et les correctifs les plus importants de l'UI-2020 seront disponibles pour tous.
Ajouter un code dans les options des articles - Gadget Blog Version 1 - vue web
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « post »
<b:includable id='post' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion Post](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAyy7M2r-bb9L9FwwLC8r8mpK3LPER159Mi_bCqAyc8fPn2xNHJ4idigcACAlpe_9RCs_EgQQ3Z3TaRd3bSZdo8HcvBXIX7DK-BYvuzb_vJeWoiDOGmjgkgPz_y84Li4614-YrmVaoMf2L/s320/002.jpg )
Étape 3 : Choisir un emplacement
L'inclusion post
contient 4 balises où peuvent être intégré un code XML :
<div class='post-header-line-1'> <!-- Ajouter le code ici / Add Code here --> </div>
<div class='post-footer-line post-footer-line-1'> <!-- Ajouter le code ici / Add Code here --> </div>
<div class='post-footer-line post-footer-line-2'> <!-- Ajouter le code ici / Add Code here --> </div>
<div class='post-footer-line post-footer-line-3'> <!-- Ajouter le code ici / Add Code here --> </div>
Ajouter un code dans les options des articles - Gadget Blog Version 1 - vue mobile-post
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « mobile-post »
<b:includable id='mobile-post' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion mobile-post](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQKBOaNkRF3uoTyGC0b9vhkBDhQ-ct7Xwr2u8xW9Uirz4rE7dYwu-vmyLHUpJ-1AyeMelGt8YkFtI4lwHQfO9Z54gQumxP4nwvq9TabogoDHqS5MHM-sD0xr7bHG4pZFc2waTGmCc7K_Vi/s320-rw/004.jpg)
Étape 3 : Choisir un emplacement
L'inclusion mobile-post
contient 3 balises où peuvent être intégré un code XML :
<div class='post-header-line-1'> <!-- Ajouter le code ici / Add Code here --> </div>
<div class='post-footer-line post-footer-line-1'> <!-- Ajouter le code ici / Add Code here --> </div>
<div class='post-footer-line post-footer-line-2'> <!-- Ajouter le code ici / Add Code here --> </div>
Ajouter un code dans les options des articles - Gadget Blog Version 1 - vue mobile-index
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « mobile-index-post »
<b:includable id='mobile-index-post' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion mobile-index-post](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioKPqcms_69-fagB4d7UlIfa-aqxgGUSUf8F9xkoT8qtuVvoLzKkYBll22cfC5PGyqPmpIyMxvvtqaSh7QnNeAKGkvJ-snmJSLmFyfM2tYH_8sQr9XKX9WTdx8ol_eyJEkcXKZZCpzCpb7/s320-rw/006.jpg)
Étape 3 : Choisir un emplacement
L'endroit le mieux approprié est à proximité de l'option du lien de commentaires.
<div class='mobile-index-comment'>
<!-- Ajouter le code ici / Add code here --> </div>
![Repérer la balise et ajouter un code XML après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq_NUg0Irbp5t6RIre9V5l8rNmC5VQcz4cB0qoBvddJbDVJBBfyeml8II3bd6GmV5ccuzQvQZiAFZh1nrlDrWlmVJIi3sG-S1znOPR2UIO7_eptBhyR-BGce0lpAU9j29lCkIG0OVg2fzp/s320-rw/007.jpg)
Ajouter un code dans les options des articles - Gadget Blog Version 2
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtjencohTwIr7KD6HcTlBYvnrC88zIHGqY-g0iykpfEn56H4UtN37f7jxtFuD01KxJTP1-a0ni2pIDEFVCQmL-SK9PCs__dxvKDv50lyOU53QNFSrDE9LTwtt1uWkioy_X6enuW2ut6U2u/s320-rw/028.jpg)
Étape 2 : Déployer l'inclusion « postFooter »
<b:includable id='postFooter' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion postFooter](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJDeH_ZO21Un8_ZTKsDFtpPAGaqTFZKZqgowwm5m-Zkwn8oxWBBf9yQVfNWh3CvdkWjHDk8Kp8tqFE9AoLDyouShJx4x6Wpp7eh22JdVfhxcfv2RQQdRJeEm96mJ05jbUYenvqc6YwW9NZ/s320-rw/029.jpg)
Étape 3 : Choisir un emplacement
Dans les layouts Version 3, le contenu de l'inclusion postFooter
peut varier d'un thème à l'autre. Intégrez le code XML de préférence au début de l'inclusion :
<b:includable id='postFooter' var='post'> <!-- Ajouter le code ici / Add Code here -->
![Repérer la balise et ajouter un code XML après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitzc9QseNwLlz_rUOvnaekoyuDx9rlMI9-PMlTlcytvZT3z3jr0OLRiC9lthminPcyQU6vjl1K3xbZlv94D9vjictDXDmfxln-YO9ZR5rhz25BO_xBHl0ir6Y_frIzXPJFmMQ2UVWke9aN/s320-rw/030.jpg)
Ajouter un code à proximité du snippet - Gadget FeaturedPost Version 1
Étape 1 : Déployer le gadget « FeaturedPost1 »
<b:widget id='FeaturedPost1' locked='false' title='title' type='FeaturedPost'></b:widget>
![Repérer et développer les balises b:widget du gadget FeaturedPost](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjV0q8Q6PtVyRSYYZZIZnOGL660_zoucQO8Clo38jW1CL6BK50Fsv-XPF2BKsG6hC9jSgbjClHKpxAHYwZFtRz5okoIpmuveInOxBtUJZbUQcrotv_D7Km4aByHPkZ4sxRwvmHb9rEY7ijk/s320-rw/035.jpg)
Étape 2 : Déployer l'inclusion « content »
<b:includable id='content'></b:includable>
![Repérer et développer les balises de l'inclusion content](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidgCLnTMKQvTRxQuYDdYDlLCKZJ4sbEPqCJDCJAXKZ6NF3gID_t5ef1JVbp6Y7jhoj5BZYJh3-gB7cnGHsihs2OMEAttIod6GkpWkO4krcbx6v4QbRqiQ4o1y8brThl9wp2GQeX7aeTMs1/s320-rw/036.jpg)
Étape 3 : Choisir un emplacement
<!-- Add code here / Ajouter le code ici--> <b:if cond='data:showSnippet and data:postSummary != ""'> <p> <data:postSummary/> </p> </b:if> <!-- Or add code here / Ou ajouter le code ici -->
![Repérer la balise et ajouter un code XML après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgEXdrYb1NjOz6N8ijbzvjniQAcFHN9CIsXUfTvkFRWgwRtEAAtiZTnMoLfaj4V3AqkHl53HhyNCJoYOAQAJCouaG4kKFO4CMRhH-q2-CZGS3y9p6jvHcVCtoAhcacaUW3j0ejo2Lb1Pft/s320-rw/037.jpg)
Ajouter un code à proximité du snippet - Gadget FeaturedPost Version 2
Étape 1 : Déployer le gadget « FeaturedPost1 »
<b:widget id='FeaturedPost1' locked='true' title='title' type='FeaturedPost' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget FeaturedPost](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2tiUTt4aPR0YGLw8r3bCjyeWxKt29zlkSEYBET8cvX7H5pRmM61UggyHoADEpLCXygZQa35WVPTZIs8gt5ksukkTSMN02QtXjaKdnQzJE_ctl8ok1OBp0Oo2D9Vxlcl_4nYWbErRv-WoW/s320-rw/031.jpg)
Étape 2 : Créer une nouvelle inclusion et choisir l'emplacement
Après les balises de réglages <b:widget-settings></b:widget-settings>
ajoutez une nouvelle inclusion. A l'intérieur, vous ajoutez votre code XML personnalisé à l'un des endroits mentionnés.
<b:includable id='postSnippet'> <!-- Ajouter code personnel ici / Add custom code here --> <b:include name='super.postSnippet'/> <!-- Ou Ajouter code personnel ici / Or Add custom code here --> </b:includable>
![Ajouter une nouvelle inclusion](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUN5GAztIoCquqDGYSB2ZkhsHNDM-f9qecfqs_h4InYW5MZP_lO2eCEMghOhM0ZtskLX7IGNBHjlFv2yod-_va74H5WGaatIJ30Rk0QHYZy16dI2EJPWehFhwZcCrFdWwcOaKS1x2sKNsn/s320-rw/032.jpg)
Ajouter un code à proximité du snippet - Gadget PopularPosts Version 1
Étape 1 : Déployer le gadget « PopularPosts1 »
<b:widget id='PopularPosts1' locked='false' title='title' type='PopularPosts'></b:widget>
![Repérer et développer les balises b:widget du gadget PopularPosts](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKUbxwNf2g3hyphenhyphenPESUhk6zYqOR_0nq5jc5-32Fht6e1L-iSUtESQrqeXaDF4a7o1uaZrU4tDWWGMMahFMt-RNpJDHqvsRvuSJ8377U-nCA_gDveVgEOd9gLncAZghTu4Gi5t2lXhZ6Yda8F/s320-rw/038.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihj3yUWSGYY2nRfnoo9fTAwfpw7YZhfdoOsfxXdlPy9spcm3Umeovzg-TYPMkGNHuxU1sMl6OtGP7oiwVIKpbAYyHJku1mp-FDR8BMilTiECjpaKX4jgEkToz_k8bfmxncWY0dtDAkiZR8/s320-rw/039.jpg)
Étape 3 : Choisir un emplacement
<div style='clear: both;'/> </b:if> <!-- Add code here / Ajouter le code ici--> </li> </b:loop>
![Repérer la balise et ajouter un code XML après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4Wx9Oc-JlDOtPhiPG72l2x4fJj2MpLAjycnHYLXHt9QiCFaH_q1qF9XAJmXGBorAeCNvtqNK9x0Q1qT9Rt2CvKp-E1JheqDpwsd3pKJP2rY54-emb8FiuBcRu79zI8-AL_11b4eHlM4TN/s320-rw/040.jpg)
Ajouter un code à proximité du snippet - Gadget PopularPosts Version 2
Étape 1 : Déployer le gadget « PopularPosts1 »
<b:widget id='PopularPosts1' locked='true' title='title' type='PopularPosts' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget PopularPosts](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcNQwB1gp0nSppZmgky0B5IaR1KdCf8vTkIhd-HhTaiNpIsxKcYOSZIfDOCdNl5BeyJdCNWHjo1QTYOUfkIEXrSRg4eRA1n28TEIcY4ylo8YPDdAyvcaqiXQV8kgAjfEtTpC1061qAW-22/s320-rw/033.jpg)
Étape 2 : Créer une nouvelle inclusion et choisir l'emplacement
Après les balises de réglages <b:widget-settings></b:widget-settings>
ajoutez une nouvelle inclusion. A l'intérieur, vous ajoutez votre code XML personnalisé à l'un des endroits mentionnés.
<b:includable id='postSnippet'> <!-- Ajouter code personnel ici / Add custom code here --> <b:include name='super.postSnippet'/> <!-- Ou Ajouter code personnel ici / Or Add custom code here --> </b:includable>
![Ajouter une nouvelle inclusion](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcdcgWctmMv_3Bkwpm_1BNSmnT5xB_RWVjWJtxtkoGSb75gs4CuP41xgT0HlbVgiXrbeD6KEmrB8YOD5mRcTMAYK7Hp2g_5ma3v1aBDENWvAFLEDVN-QVp_UL08nVUL0jjmghWgtyuJY7L/s320-rw/034.jpg)
Ajouter un code après la balise <body>
Étape 1 : Rechercher la balise « body »
Activez la recherche intégrée en cliquant d'abord dans l'éditeur et ensuite, appuyez sur les touches CTRL+F.
Dans la boîte de recherche, tapez :<body
![Rechercher et localiser la balise body](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBU-nAM4h-7A8ns_YGH0us90-xn8n-3_17-nklhlai-AofnewZyN5vhxQNhTdCnsBi5LDqsAjA51OhNECrYnEh84QA_oQH6gcv4DVIIdsM89VqdYNPxxzH2ylq2fcdIdmXeghdpEjilgNn/s320-rw/008.jpg)
Selon les thèmes, la balise peut renfermer plusieurs attributs :
<body expr:class='"loading" + data:blog.mobileClass'>
<body>
Étape 2 : Ajouter du contenu après la balise
Lorsque vous avez repéré la balise, vous pouvez ajouter un code XML juste après.
<body expr:class='"loading" + data:blog.mobileClass'> <!-- Ajouter le code ici / Add code here -->
<body> <!-- Ajouter le code ici / Add code here -->
Si la balise est suivie de balises <b:class>
ou/et <b:attr>
, vous injecter votre code après ces balises.
<body> <b:class ... /> <b:attr ... /> <!-- Ajouter le code ici / Add code here -->
![Ajouter un code XML après la balise body](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSVBkpejQzCcJLAsFc8LXGSTBPdMIuBiZB_lMmiWH_vtuMRZfE2IGY1e7aX3JT2IudUgcQUsK3IKjUOlPEqmyBsFIkcjn6iag0_kWnAIrqUYoTDynRTtl3HUyYTp9N4zBZq9hHB1Aaf0eH/s320-rw/009.jpg)
Remarque 1 :
Ne jamais ajouter un code entre les balises </head>
et <body>
. C'est une erreur.
Remarque 2 :
Il y a toujours qu'une seule balise <body>
dans le code XML d'un thème.
Ajouter un code dans la barre de partage - Gadget Blog Version 1 - Vue web
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « shareButtons »
<b:includable id='shareButtons' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion shareButtons](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG9pgjNUVamqXW1a9ATN9De9XdQiPQCdtstoPLHrOZ0g6PX-82HjayUi_lvu7I6UvVo0tlgsCP7Duh-oqYtJmb-va2988rxul-daCMqOH5bo3Xs41FutZRYI3Vi1r4-LcYL6gNRs-3HS4b/s320-rw/010.jpg)
Étape 3 : Choisir un emplacement
L'inclusion shareButtons
contient plusieurs emplacements où peuvent être intégré un code XML :
<b:includable id='shareButtons' var='post'> <!-- Ajouter le code ici / Add code here -->
</b:if> <!-- Ajouter le code ici / Add code here -->
![Les emplacements plausibles pour ajouter un code XML dans la barre de partage](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwQ5bFiiyMZVkVN4cWVI-OkxfEsOmprmUdQMUzd-OIc8cRySJi-XF3bz715A8oBX3IUidYWe3SAkhvnJ7M-_YhDlONrbfnx7aa2Sw2DE6hnzJjl9nCbf3iCayzf0Aot7mB2Cmwrf9_b80H/s320-rw/011.jpg)
Ajouter un code à côté du bouton de partage - Gadget Blog Version 1 - Vue modile
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « mobile-post »
<b:includable id='mobile-post' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion mobile-post](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQKBOaNkRF3uoTyGC0b9vhkBDhQ-ct7Xwr2u8xW9Uirz4rE7dYwu-vmyLHUpJ-1AyeMelGt8YkFtI4lwHQfO9Z54gQumxP4nwvq9TabogoDHqS5MHM-sD0xr7bHG4pZFc2waTGmCc7K_Vi/s320-rw/004.jpg)
Étape 3 : Choisir un emplacement
L'inclusion mobile-post
contient le code de la barre de partage de la version mobile. Un code XML peut être ajouté à l'un des emplacements suivants :
<!-- Ajouter le code ici / Add code here --> <b:if cond='data:top.showMobileShare'>
</b:if> <!-- Ajouter le code ici / Add code here -->
![Emplacements plausible pour ajouter un code XML dans la barre de partage de la version mobile personnalisée](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrIt5KY_o3GW_mo77-nB5I6Df_vCMqlqKoO2LWw61Sj3kpIEzliXSiv92FLs_Ejo2EnAMrgC34OwS_WxgvTX5JKAih7Gbpqyx-4SYHPu4gKu2_l6heaBfM7K2GWyna1J4m11eu3RBx8ssy/s320-rw/012.jpg)
Ajouter un code dans l'option Profil de l'auteur de l'article - Gadget Blog Version 1 - Vue web
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « post »
<b:includable id='post' var='post'></b:includable>
![Repérer et développer les balises de l'inclusion Post](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAyy7M2r-bb9L9FwwLC8r8mpK3LPER159Mi_bCqAyc8fPn2xNHJ4idigcACAlpe_9RCs_EgQQ3Z3TaRd3bSZdo8HcvBXIX7DK-BYvuzb_vJeWoiDOGmjgkgPz_y84Li4614-YrmVaoMf2L/s320-rw/002.jpg)
Étape 3 : Choisir un emplacement
Un code XML peut être ajouté avant ou après la description du profil de l'auteur :
<!-- Ajouter le code ici / Add code here --> <span itemprop='description'><data:post.authorAboutMe/></span> <!-- Ou, ajouter le code ici / or, add code here -->
![Repérer l'emplacement et ajouter un code XML avant ou après](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwufnfwOBvRuq8kj9XPvrMQdKQQuBzclUEDSVF2oRjC82Qfk1ooPJqmrwQir0XKAHFAa5X4W_UznE6EhtiiGMYBP7v-aLoevugZZSmX0otp3VXljAxQI8z1uhqdnCOXtMpc2iCs6w0WDar/s320-rw/015.jpg)
Ajouter un code sous le nom de l'auteur - Gadget Profile Version 1
Étape 1 : Déployer le gadget « Profile »
<b:widget id='Profile1' locked='false' title='WIDGET_TITLE' type='Profile' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Profile](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTm0IFqCX8CKgVGu1w0JeOn_ndLWm6W2KW8LWQoT8iRYzkVhhOBUXLzDoVeFA125azIX_Hvu9TZlryxBz-jcqeXLs_0oH_L08hyI8GlCOjVyaDfP1tYkkuldRveH5NKLjIcvYCqXyoCQ16/s320-rw/016.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipSzAFmLiKeBUMkIifpNQ8vU4-hHt3XpsGto6PlavBDo2TPL0X4kv3OFBJcE4hyphenhyphenTpxDaRAcZEiRNseZZ8mVucmJCaltUnFF1Ygq0n2TolyMNuyjnosRucA1WUQ160wB_CN4w9_Oa6V1RtM/s320-rw/017.jpg)
Étape 3 : Choisir un emplacement
L'emplacement à trouver est situé dans l'inclusion main
. Un code XML peut être ajouté après :
<div class='g-follow' data-annotation='bubble' data-height='20' expr:data-href='data:userUrl'/> </b:if> <!-- Ajouter le code ici / Add code here -->
![Repérer la balise et ajouter un code XML après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDQk8W4XyQnHbIwLrpenMDDGPwQ5G0ZGZFikSfVmPZx6yd_UQz9w0dWzfbceBacMvd9Xs1PO0ukXdtKSBTufbDvmmdfQMfturyGowPhMigbYrh6ryaoAF7-imp-zXmImThcVtbdaWA-vv5/s320-rw/018.jpg)
Ajouter un code à côté des noms des contributeurs - Gadget Profile Version 1
Étape 1 : Déployer le gadget « Profile »
<b:widget id='Profile1' locked='false' title='WIDGET_TITLE' type='Profile' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Profile](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTm0IFqCX8CKgVGu1w0JeOn_ndLWm6W2KW8LWQoT8iRYzkVhhOBUXLzDoVeFA125azIX_Hvu9TZlryxBz-jcqeXLs_0oH_L08hyI8GlCOjVyaDfP1tYkkuldRveH5NKLjIcvYCqXyoCQ16/s320-rw/016.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipSzAFmLiKeBUMkIifpNQ8vU4-hHt3XpsGto6PlavBDo2TPL0X4kv3OFBJcE4hyphenhyphenTpxDaRAcZEiRNseZZ8mVucmJCaltUnFF1Ygq0n2TolyMNuyjnosRucA1WUQ160wB_CN4w9_Oa6V1RtM/s320-rw/017.jpg)
Étape 3 : Choisir un emplacement
L'emplacement à trouver est situé dans l'inclusion main
. Un code XML peut être ajouté à l'endroit mentionné ci-dessous :
<li><a class='profile-name-link g-profile' expr:href='data:i.userUrl' expr:style='"background-image: url(" + data:i.profileLogo + ");"'><data:i.display-name/></a><!-- Ajouter le code ici / Add code here --></li>
![Repérer l'emplacement et ajouter un code XML après](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8zdMGVnX7XzMg-6zU1bGYW2EY_QMGzFbLX7hwckea8GthZGo1fW81VDRwENvrq4w9pDszvYBxhx5H3T6iFSTEtFUasuWCUcTqBCRxqjmHTrASj7y66EUB2B1zwwfkkuJu92JW3HtdfCe8/s320-rw/021.jpg)
Ajouter un code à proximité du message d'état - Gadget Blog Version 1
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main' var='top'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7drGS5Zb0qf0QZV21SqGVPRdkoL1a_PPTaD6B1phBArjz9CsbsVxU0XxGauvroaoQrw2ViXUED0N5h2TIcQZJMNWcxPYdLXQAF2hXTIY2mBTtBOcoHsl1V6eJ-RX1_vbywHpCciafREs0/s320-rw/022.jpg)
Étape 3 : Choisir un emplacement
Le code XML du message d'état se trouve dans l'inclusion main
. Un code XML peut être ajouté avant ou après :
<!-- Ajouter le code ici / Add code here --> <b:include data='top' name='status-message'/> <!-- OU Ajouter le code ici / or Add code here -->
![Repérer la balise et ajouter un code XML avant ou après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi621svyha5A4igPEB303KwM7HFMqliR-2l0qV-sy5qy9s16JzQLirwcbbDkVR9uOOg_qkTvvq9_ZPZTfIGo0-7-uuj4rZZPf9j4lt-OuofuWkOelQDrMz6rxp2g79XHR9k52DC6mui-yHA/s320-rw/023.jpg)
Ajouter un code à proximité de la pagination - Gadget Blog Version 1 - Vue web
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main' var='top'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7drGS5Zb0qf0QZV21SqGVPRdkoL1a_PPTaD6B1phBArjz9CsbsVxU0XxGauvroaoQrw2ViXUED0N5h2TIcQZJMNWcxPYdLXQAF2hXTIY2mBTtBOcoHsl1V6eJ-RX1_vbywHpCciafREs0/s320-rw/022.jpg)
Étape 3 : Choisir un emplacement
Le code XML des liens de navigation se trouve dans l'inclusion main
. Un code XML peut être ajouté avant ou après :
<!-- Ajouter le code ici / Add code here --> <!-- navigation --> <b:include name='nextprev'/> <!-- OU Ajouter le code ici / Or add code here -->
![Repérer la balise et ajouter un code XML avant ou après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiL2kv6vqPAgIpNaO3qoX8Ux9vhOsW7F7_JfaJCNm7rB3XovJqalY8DJVAPVUHpAQ8W3nZEbOek7xF7hlJ_OgDKLGxUAtuTK0gXbxrwdHRqbcD_-GsK7-wPCjetn4wnLrJlor0xQao85Tzo/s320-rw/024.jpg)
Ajouter un code à proximité de la pagination - Gadget Blog Version 1 - Vue mobile
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « mobile-main »
<b:includable id='mobile-main' var='top'></b:includable>
![Repérer et développer les balises de l'inclusion mobile-main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMGUGFOFU0pu_Z1U0K1IX1GcwFGAs9eII9tEAtDolRU65DTQF1iRarJ4u_3TNaF5H9Ronu_B5eIdrV-qz3eH9SLvyfLPMZvKb-wMPY1oauqoIcdFMfNxEq5NEgiNn9Qd9Rv3CnEhaIJOx7/s320-rw/026.jpg)
Étape 3 : Choisir un emplacement
Le code XML des liens de navigation de la version mobile personnalisée se trouve dans l'inclusion mobile-main
. Un code XML peut être ajouté avant ou après :
<!-- Ajouter le code ici / Add code here --> <b:include name='mobile-nextprev'/> <!-- OU Ajouter le code ici / or add code here -->
![Repérer la balise et ajouter un code XML avant ou après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvfFyO32U9Dhmsg2fCTb6vw1NhJ-tdZWecyEimIUhe74tlbroNTv8sQcvkdiaiBJskDC5sIdhhKZmp_qMUrlLPCByAh2SDnCZmSBBxaHnTrhxRzpoFpVEn3dJQzk-6nM0t8DShHNp7Y4y4/s320-rw/027.jpg)
Ajouter un code à proximité des liens de flux - Gadget Blog Version 1
Étape 1 : Déployer le gadget « Blog1 »
<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog' visible='true'></b:widget>
![Repérer et développer les balises b:widget du gadget Blog](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxLuxbfeRNPtIsDiuMRxFUTUzUOolOq19hJvZw4pioVlcJbbMqKrwFPKHGMzm7VSEzW0_AnYO7wn5pq9ORtxNwmB1HU-rQj6MBJM166bbCCJX5kJEr0shtzh0t3Q8Gy0NNGKKCG7MHR0sp/s320-rw/001.jpg)
Étape 2 : Déployer l'inclusion « main »
<b:includable id='main' var='top'></b:includable>
![Repérer et développer les balises de l'inclusion main](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7drGS5Zb0qf0QZV21SqGVPRdkoL1a_PPTaD6B1phBArjz9CsbsVxU0XxGauvroaoQrw2ViXUED0N5h2TIcQZJMNWcxPYdLXQAF2hXTIY2mBTtBOcoHsl1V6eJ-RX1_vbywHpCciafREs0/s320-rw/022.jpg)
Étape 3 : Choisir un emplacement
Le code XML des liens de flux se trouve dans l'inclusion main
. Un code XML peut être ajouté avant ou après :
<!-- Ajouter le code ici / Add code here --> <!-- feed links --> <b:include name='feedLinks'/> <!-- OU Ajouter le code ici / or add code here -->
![Repérer la balise et ajouter un code XML avant ou après la balise](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6doM1vnOqXf6QLzX8jhaPz2TlCEu2bC_KwHfrMYQ0I9YQ9OaahDmHrzVmXsXYF1qQETKICcVGEUbVmnvpWuLEJqekYWR-M1iV-5U8S5leJ0CG5i5W6mREkXu-5f6M4FxPxqaJT8tChk2h/s320-rw/025.jpg)