Menu

Bulk SEO

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 😉.

Le tutoriel en vidéo

Comment utiliser l’application « Bulk SEO » ?

Pour utiliser « Bulk SEO », suivez les étapes ci-dessous.

  1. Pour accéder à l'application « Bulk SEO », connectez-vous à notre solution EdgeSEO puis cliquer sur le bouton configurer de l'application « Bulk SEO»
  2. Si c’est la première fois que vous utilisez l’application, télécharger le template CSV depuis l'interface ou dupliquer le template GoogleSheet > onglet BULK SEO
  3. Si vous avez déjà utilisé « Bulk SEO », 🚨 il faut repartir de votre fichier existant. L’application « Bulk SEO » fonctionne avec un mécanisme « annule et remplace » du fichier csv. Vous pouvez télécharger le fichier actuellement en production à partir du lien sur l’interface.
  4. Compléter les colonnes du fichier CSV avec vos données. On vous donne tous les détails de chaque colonne plus bas  👇
  5. Télécharger votre fichier et cliquer sur bouton sauvegarder.
  6. Vérifier que les modifications sont bien appliquées sur vos urls.

Les colonnes du fichier « Bulk SEO »

url

keyboard_arrow_down

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.

title

keyboard_arrow_down

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 ?

  1. Si la colonne title est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez un contenu dans la colonne title, nous remplaçons le contenu existant de la balise title par celui que vous avez renseigné dans la colonne title.
  3. Si vous ajoutez un contenu dans la colonne title et qu'il n'y a pas de balise title dans le code source de votre page, nous ajoutons la balise title avec le contenu que vous avez renseigné dans la colonne title.
title

Mon super titre avec un émoji 🚀

Résultat dans le code source

1<!DOCTYPE html>
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>

meta-description

keyboard_arrow_down

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 ?

  1. Si la colonne est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez un contenu dans la colonne meta-description, nous remplaçons le contenu existant de la balise meta description par celui que vous avez renseigné dans la colonne meta-description.
  3. Si vous ajoutez un contenu dans la colonne meta-description et qu'il n'y a pas de balise meta description dans le code source de votre page, nous ajoutons la balise meta description avec le contenu que vous avez renseigné dans la colonne meta-description.

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 html>
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>

canonical

keyboard_arrow_down

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 ?

  1. Si la colonne canonical est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez une url dans la colonne canonical, nous remplaçons le contenu existant de la balise canonical par celui que vous avez renseigné dans la colonne canonical.
  3. Si vous ajoutez une url dans la colonne canonical et qu'il n'y a pas de balise canonical dans le code source de votre page, nous ajoutons la balise canonical avec le contenu que vous avez renseigné dans la colonne canonical.

Exemple dans le fichier csv

canonical

https://www.edgeseo.io

Résultat dans le code source

1<!DOCTYPE html>
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>

meta-robots

keyboard_arrow_down

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 ?

  1. Si la colonne meta-robots est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez des propriétés dans la colonne meta-robots, nous remplaçons le contenu existant de la balise meta robots avec les propriétés que vous avez renseignées dans la colonne meta-robots.
  3. Si vous ajoutez des propriétés dans la colonne meta-robots et qu'il n'y a pas de balise meta robots dans le code source de votre page, nous ajoutons la balise meta robots avec les propriétés que vous avez renseigné dans la colonne meta-robots.
meta-robots

index,follow

noindex,nofollow

index,nofollow

noindex,follow

Résultat dans le code source

1<!DOCTYPE html>
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>

hn-target, hn-content

keyboard_arrow_down

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 ?

  1. Si les colonnes hn-target et hn-content sont vides, nous ne réalisons aucune action.
  2. Si vous renseignez la colonne hn-target et hn-content, nous remplaçons le contenu texte de la balise hn ciblé dans la colonne hn-target avec le contenu de la colonne hn-content.
  3. Pour modifier plusieurs contenus des balises hn dans votre page, vous utilisez le séparateur « | » pour les colonnes hn-target et hn-content. Nous vous donnons un exemple ci-dessous 👇
hn-targethn-content
h1.maClass | h2.classTMon nouveau titre 😍 | Mon nouveau sous-titre

Résultat dans le code source

1<!DOCTYPE html>
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>

hreflang-defaut, hreflang-pays, hreflang-url

keyboard_arrow_down

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 ?

  1. Si la colonne hreflang-defaut est vide, nous ne réalisons aucune action.
  2. Si vous avez renseigné la colonne hreflang-defaut, nous ajoutons une balise hreflang="x-default" avec le contenu de la colonne hreflang-defaut.
  3. Si les colonnes hreflang-pays et hreflang-url sont vides, nous ne réalisons aucune action.
  4. Si vous avez renseigné la colonne hreflang-pays et hreflang-url, nous ajoutons une balise link rel="alternate" hreflang="hreflang-pays" href="hreflang-url"> avec les contenus de la colonne hreflang-pays et hreflang-url.
  5. Pour ajouter plusieurs balises link rel="alternate" hreflang="" href="" dans votre page, vous utilisez le séparateur « | » pour les colonnes hreflang-pays et hreflang-url. Nous vous donnons un exemple ci-dessous 👇

Exemple dans le fichier csv

hreflang-defauthreflang-payshreflang-url
https://url-defaut.comen|frhttps://url-defaut.com/en | https://url-defaut.com/fr

Résultat dans le code source

1<!DOCTYPE html>
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>

html-target, html-content

keyboard_arrow_down

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 ?

  1. Si les colonnes html-target et html-content sont vides, nous ne réalisons aucune action.
  2. Si vous renseignez la colonne html-target et html-content, nous ajoutons le contenu <html> présent dans la colonne html-content dans la zone ciblée par la colonne html-target
  3. Pour remplacer plusieurs contenus html dans votre page, vous utilisez le séparateur « | » pour les colonnes html-target et html-content. Nous vous donnons un exemple ci-dessous 👇
html-targethtml-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 html>
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 html>
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>

html-remove

keyboard_arrow_down

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 ?

  1. Si la colonne html-remove est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez un sélecteur CSS dans la colonne html-remove, nous supprimons le contenu html ciblé par le sélecteur.
  3. Pour supprimer plusieurs contenus html dans votre page, vous pouvez utiliser le séparateur « , » pour indiquer plusieurs sélecteur CSS dans la colonne html-remove. Nous vous donnons un exemple ci-dessous 👇

Exemple dans le fichier csv

html-remove

span.maClass2 , h3

Code source original

1<!DOCTYPE html>
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 html>
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>

balise-switcher-target, balise-switcher-replace

keyboard_arrow_down

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 ?

  1. Si les colonnes balise-switcher-target et balise-switcher-replace sont vides, nous ne réalisons aucune action.
  2. Si vous renseignez les colonnes balise-switcher-target et balise-switcher-replace, nous remplaçons la balise html ciblé dans la colonne balise-switcher-target par la balise renseignée dans la colonne balise-switcher-replace.
  3. Pour modifier plusieurs balises html dans votre page, vous utilisez le séparateur « | » pour les colonnes balise-switcher-target et balise-switcher-replace
  4. . Nous vous donnons un exemple ci-dessous 👇

Exemple dans le fichier csv

balise-switcher-targetbalise-switcher-replace
h1.maClassC | h2.classTspan | div

Code source original

1<!DOCTYPE html>
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 html>
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>

link-obfuscation

keyboard_arrow_down

La colonne link-obfuscation permet d’obfusquer un lien a href=”” en ciblant celui-ci via un sélecteur CSS.

Comment ça marche ?

  1. Si la colonne link-obfuscation est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez un sélecteur CSS dans la colonne link-obfuscation, nous offusquons le lien ciblé par le sélecteur.
  3. Pour offusquer plusieurs balise href=”” dans votre page, vous pouvez utiliser le séparateur « , » pour indiquer plusieurs sélecteur CSS dans la colonne link-obfuscation. Nous vous donnons un exemple ci-dessous 👇

Exemple dans le fichier csv

link-obfuscation

a[href="/mentions-legales"] , li a.maClass

Code source original

1<!DOCTYPE html>
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 html>
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>

schema-org

keyboard_arrow_down

La colonne schema-org permet d’ajouter des données structurées de type schema.org.

Comment ça marche ?

  1. Si la colonne schema-org est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez des données structurées dans la colonne schema-org, nous les ajoutons dans la balise head de la page.
  3. Pour ajouter plusieurs types de données structurées dans votre page, vous pouvez utiliser le séparateur « , » pour les ajouter dans la colonne schema-org. Nous vous donnons un exemple ci-dessous 👇

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 html>
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>

opengraph

keyboard_arrow_down

La colonne opengraph permet d’ajouter des données structurées de type open graph.

Comment ça marche ?

  1. Si la colonne opengraph est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez des données structurées dans la colonne opengraph, nous les ajoutons dans la balise head de la page.

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 html>
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>

twitter-card

keyboard_arrow_down

La colonne twitter-card permet d’ajouter des données structurées de type open Twitter card.

Comment ça marche ?

  1. Si la colonne twitter-card est vide, nous ne réalisons aucune action.
  2. Si vous ajoutez des données structurées dans la colonne twitter-card, nous les ajoutons dans la balise head de la page.

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 html>
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>