L’application « Bulk SEO » permet d’appliquer les fondamentaux du SEO. Vous pourrez, par exemple, modifier les balises title, canonical, hreflang, meta robot et ajouter un bloc de lien sur des milliers de pages en paramétrant un fichier CSV. C’est l’application qui va vous permettre de gagner en agilité au quotidien 😉.
Pour utiliser « Bulk SEO », suivez les étapes ci-dessous.
La colonne url permet d’indiquer la page sur laquelle vous souhaitez appliquer des modifications.
La colonne url est obligatoire pour chaque ligne.
Nous attendons une url valide qui répond avec un statut code 200 dans la colonne
Exemple dans le fichier csv
Une URL valide doit être structurée avec le protocole (http:// ou https://) suivi du domaine complet.
Ci-dessous quelques exemples d’URL qui sont valides :
<url> |
---|
https://www.edgeseo.io/ |
https://edgeseo.io/ |
https://www.edgeseo.io/blog |
https://www.edgeseo.io/blog?param=1 |
Ci-dessous quelques exemples d’URL qui retourneront une erreur :
❌ www.edgeseo.io → Il manque le protocole https:// ou http://
❌ edgeseo.io → Il manque le protocole https:// ou http://
❌ /blog → Il manque le protocole https:// ou http:// et le domaine complet.
La colonne title permet d’ajouter ou modifier le contenu de la balise title présent dans le code source de votre page.
Comment ça marche ?
title |
---|
Mon super titre avec un émoji 🚀 |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <meta charset="UTF-8">
5 <title>Mon super titre avec un émoji 🚀</title>
6</head>
7<body>
8 <!-- Le contenu de votre page -->
9</body>
10</html>
La colonne meta-description permet d’ajouter ou modifier le contenu de la balise meta description présent dans le code source de votre page.
Comment ça marche ?
Exemple dans le fichier csv
meta-description |
---|
Mon nouvelle description qui va améliorer mon CTR 🤑 dans les #SERP |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <meta name="description" content="Mon nouvelle description qui va améliorer mon CTR 🤑 dans les #SERP">
5</head>
6<body>
7 <!-- Le contenu de votre page -->
8</body>
9</html>
La colonne canonical permet d’ajouter ou modifier le contenu de la balise canonical présent dans le code source de votre page.
Comment ça marche ?
Exemple dans le fichier csv
canonical |
---|
https://www.edgeseo.io |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <link rel="canonical" href="https://www.edgeseo.io">
5</head>
6<body>
7 <!-- Le contenu de votre page -->
8</body>
9</html>
La colonne meta-robots permet d’ajouter ou modifier le contenu de la balise meta robots présent dans le code source de votre page.
Vous pouvez utiliser les propriétés index / noindex et follow / nofollow séparé par une « , ». Nous vous donnons quelques exemples plus bas 👇
Comment ça marche ?
meta-robots |
---|
index,follow |
noindex,nofollow |
index,nofollow |
noindex,follow |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <meta name="robots" content="index, follow">
5</head>
6<body>
7 <!-- Le contenu de votre page -->
8</body>
9</html>
Les colonnes hn-target et hn-content permettent de remplacer le contenu texte d’une ou plusieurs balises hn présentent dans le code source de votre page.La colonne hn-target permet de cibler la balise hn via un sélecteur CSS sur laquelle on souhaite modifier le texte.
La colonne hn-content permet d’ajouter le contenu texte à modifier de la balise hn ciblé.
Comment ça marche ?
hn-target | hn-content |
---|---|
h1.maClass | h2.classT | Mon nouveau titre 😍 | Mon nouveau sous-titre |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4
5</head>
6<body>
7 <h1 class="maClass">Mon nouveau titre 😍</h1>
8 <h2 class="classT">Mon nouveau sous-titre</h2>
9</body>
10</html>
La colonne hreflang-defaut permet d’ajouter la balise hreflang="x-default"
Les colonnes hreflang-pays et hreflang-url permettent d’ajouter une balise hreflang="x-default"
La colonne hreflang-pays permet d’ajouter le code pays pour l’url.
La colonne hreflang-url permet d’ajouter l’url associée au code pays.
Comment ça marche ?
Exemple dans le fichier csv
hreflang-defaut | hreflang-pays | hreflang-url |
---|---|---|
https://url-defaut.com | en|fr | https://url-defaut.com/en | https://url-defaut.com/fr |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <link rel="alternate" hreflang="en" href="https://url-defaut.com/en">
5 <link rel="alternate" hreflang="fr" href="https://url-defaut.com/fr">
6 <link rel="alternate" hreflang="x-default" href="https://url-defaut.com">
7</head>
8<body>
9
10</body>
11</html>
Les colonnes html-target et html-content permettent d’ajouter du contenu html dans votre page.
La colonne html-target permet de cibler la zone où vous souhaitez ajouter le html via un mot-clé + un sélecteur CSS
La colonne html-content permet d’indiquer le contenu html à ajouter dans la zone ciblée.
Comment ça marche ?
html-target | html-content |
---|---|
prepend_inside div.maClass | <p>Mon super contenu optimisé pour le SEO</p> <div class=”link”> <a href=”#”>ancre de lien 1</a><a href=”#”>ancre de lien 2</a> </div> |
Code source original
1<!DOCTYPE >
2<html>
3<head>
4
5</head>
6<body>
7 <div class="maClass">
8 <p>un pararagraphe</p>
9 </div>
10</body>
11</html>
Code source modifié
1<!DOCTYPE >
2<html>
3<head>
4
5</head>
6<body>
7 <div class="maClass">
8 <p>Mon super contenu optimisé pour le SEO</p>
9 <div class=”link”>
10 <a href=”#”>ancre de lien 1</a>
11 <a href=”#”>ancre de lien 2</a>
12 </div>
13 <p>un pararagraphe</p>
14 </div>
15</body>
16</html>
Focus sur les mots-clés pour cibler une zone
Pour illustrer le comportement de chaque mot-clé, nous allons partir de ce code html.Nous verrons en fonction du mot-clé où se positionne le contenu html que nous souhaitons ajouter dans la page.
prepend_inside
Ajoute le contenu html au début de l'élément ciblé dans le DOM.
Résultat avec prepend_inside.
1<!-- Code original -->
2<div class="maClass">
3 <p>Contenu existant</p>
4</div>
5
6<!-- Code ajouté avec le mot clé prepend_inside div.maClass -->
7<div class="maClass">
8 <p>Mon super contenu optimisé pour le SEO</p>
9 <div class=”link”>
10 <a href=”#”>ancre de lien 1</a>
11 <a href=”#”>ancre de lien 2</a>
12 </div>
13
14 <p>Contenu existant</p>
15</div>
insert_after_outside
Ajoute le contenu html immédiatement après l'élément ciblé dans le DOM.
Résultat avec insert_after_outside.
1<!-- Code original -->
2<div class="maClass">
3 <p>Contenu existant</p>
4</div>
5
6<!-- Code ajouté avec le mot clé insert_after_outside div.maClass -->
7<div class="maClass">
8 <p>Contenu existant</p>
9</div>
10<p>Mon super contenu optimisé pour le SEO</p>
11<div class=”link”>
12 <a href=”#”>ancre de lien 1</a>
13 <a href=”#”>ancre de lien 2</a>
14</div>
append_inside
Ajoute le contenu html à la fin de l'élément ciblé dans le DOM.
Résultat avec append_inside.
1<!-- Code original -->
2<div class="maClass">
3 <p>Contenu existant</p>
4</div>
5
6<!-- Code ajouté avec le mot clé append_inside div.maClass -->
7<div class="maClass">
8 <p>Contenu existant</p>
9
10 <p>Mon super contenu optimisé pour le SEO</p>
11 <div class=”link”>
12 <a href=”#”>ancre de lien 1</a>
13 <a href=”#”>ancre de lien 2</a>
14 </div>
15</div>
insert_before_outside
Ajoute le contenu html avant l'élément ciblé dans le DOM.
Résultat avec insert_before_outside.
1<!-- Code original -->
2<div class="maClass">
3 <p>Contenu existant</p>
4</div>
5
6<!-- Code ajouté avec le mot clé insert_before_outside div.maClass -->
7<p>Mon super contenu optimisé pour le SEO</p>
8<div class=”link”>
9 <a href=”#”>ancre de lien 1</a>
10 <a href=”#”>ancre de lien 2</a>
11</div>
12<div class="maClass">
13 <p>Contenu existant</p>
14</div>
La colonne html-remove permet de supprimer du contenu html de votre page en ciblant celui-ci via un sélecteur CSS.
Comment ça marche ?
Exemple dans le fichier csv
html-remove |
---|
span.maClass2 , h3 |
Code source original
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <div class="main">
6 <h1>Mon titre 🍿</h1>
7 <span class="maClass2">
8 <h2>Contenu duppliqué</h2>
9 <p>Intellectum est enim mihi quidem in multis, et maxime in me ipso, sed paulo ante in omnibus, cum M</p>
10 </span>
11 <p>Marcellum senatui reique publicae concessisti, commemoratis praesertim offensionibus, te auctoritatem huius ordinis dignitatemque rei publicae tuis vel doloribus vel suspicionibus anteferre</p>
12 <h3>Mon titre qui ne sert à rien 😉</h3>
13 <a href="#">coucou !</a>
14 </div>
15</body>
16</html>
Code source modifié
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <div class="main">
6 <h1>Mon titre 🍿</h1>
7
8 <p>Marcellum senatui reique publicae concessisti, commemoratis praesertim offensionibus, te auctoritatem huius ordinis dignitatemque rei publicae tuis vel doloribus vel suspicionibus anteferre</p>
9
10 <a href="#">coucou !</a>
11 </div>
12</body>
13</html>
Les colonnes balise-switcher-target et balise-switcher-replace permettent de modifier une balise html avec une autre.
La colonne balise-switcher-target permet de cibler la balise html que l’on souhaite modifier via un sélecteur CSS
La colonne balise-switcher-replace permet d’indiquer la balise html que l’on souhaite utiliser pour remplacer la balise <html> ciblée.
Comment ça marche ?
Exemple dans le fichier csv
balise-switcher-target | balise-switcher-replace |
---|---|
h1.maClassC | h2.classT | span | div |
Code source original
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <h1 class="maClass">Mon nouveau titre 😍</h1>
6 <h2 class="classT">Mon nouveau sous-titre</h2>
7</body>
8</html>
Code source modifié
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <span class="maClass">Mon nouveau titre 😍</span>
6 <div class="classT">Mon nouveau sous-titre</div>
7</body>
8</html>
La colonne link-obfuscation permet d’obfusquer un lien a href=”” en ciblant celui-ci via un sélecteur CSS.
Comment ça marche ?
Exemple dans le fichier csv
link-obfuscation |
---|
a[href="/mentions-legales"] , li a.maClass |
Code source original
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <div class="main">
6 <a href="/mentions-legales">Mentions legales</a>
7 <li class="maClass">
8 <a href="/link/link/link">lien</a>
9 <li>
10 </div>
11</body>
12</html>
Code source modifié
1<!DOCTYPE >
2<html>
3<head></head>
4<body>
5 <div class="main">
6 <span rel="aHR0cHM6Ly9mci5iZW5ldHRvbi5jb20vcHJpdmFjeS9wcml2YWN5Lmh0bWw=">Mentions legales</span>
7 <li class="maClass">
8 <span rel="aHR0cHM6Ly9mci5iZW5ldHRvbi5jb20vY29va2llc18vY29va2llc18uaHRtbA==">lien</a>
9 <li>
10 </div>
11</body>
12</html>
La colonne schema-org permet d’ajouter des données structurées de type schema.org.
Comment ça marche ?
Exemple dans le fichier csv
schema-org |
---|
{"@context": "http://schema.org/","@type": "Recipe","name": ""},{"@context": "http://schema.org","@type": "WebPage",} |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <script type="application/ld+json">
5 {
6 "@context": "http://schema.org/",
7 "@type": "Recipe",
8 "name": ""
9 },
10 {
11 "@context": "http://schema.org",
12 "@type": "WebPage",
13 }
14 </script>
15
16</head>
17<body>
18 <!-- Le contenu de votre page -->
19</body>
20</html>
La colonne opengraph permet d’ajouter des données structurées de type open graph.
Comment ça marche ?
Exemple dans le fichier csv
opengraph |
---|
<meta property="og:title" content="Titre de la page"><meta property="og:type" content="website"><meta property="og:url" content="URL de la page"><meta property="og:image" content="URL de l'image"><meta property="og:description" content="Description de la page"><meta property="og:site_name" content="Nom du site"><meta property="og:locale" content="fr_FR"> |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <meta property="og:title" content="Titre de la page">
5 <meta property="og:type" content="website">
6 <meta property="og:url" content="URL de la page">
7 <meta property="og:image" content="URL de l'image">
8 <meta property="og:description" content="Description de la page">
9 <meta property="og:site_name" content="Nom du site">
10 <meta property="og:locale" content="fr_FR">
11</head>
12<body>
13 <!-- Le contenu de votre page -->
14</body>
15</html>
La colonne twitter-card permet d’ajouter des données structurées de type open Twitter card.
Comment ça marche ?
Exemple dans le fichier csv
twitter-card |
---|
<meta name="twitter:card" content="summary"><meta name="twitter:site" content="@NomDuCompteTwitter"><meta name="twitter:title" content="Titre de la page"><meta name="twitter:description" content="Description de la page"><meta name="twitter:image" content="URL de l'image"><meta name="twitter:url" content="URL de la page"> |
Résultat dans le code source
1<!DOCTYPE >
2<html>
3<head>
4 <meta name="twitter:card" content="summary">
5 <meta name="twitter:site" content="@NomDuCompteTwitter">
6 <meta name="twitter:title" content="Titre de la page">
7 <meta name="twitter:description" content="Description de la page">
8 <meta name="twitter:image" content="URL de l'image">
9 <meta name="twitter:url" content="URL de la page">
10</head>
11<body>
12 <!-- Le contenu de votre page -->
13</body>
14</html>