Comment créer un flux RSS sur son site php custom ?

Comment créer un flux RSS sur son site php custom ?

Un flux RSS, c'est un peu comme une petite «radio» silencieuse qui diffuse vos nouveautés à ceux qui veulent les recevoir, sans dépendre d'un réseau social ni d'une newsletter. Sur un site PHP fait maison, l'avantage est simple : vous contrôlez tout, du format jusqu'aux champs exposés. Et non, ce n'est pas réservé aux gros CMS.

Le principe tient en une image : votre site devient un kiosque, et le flux RSS la pile de journaux fraîchement imprimés. Les lecteurs RSS passent, prennent la une, et repartent. Votre rôle ? Préparer des «unes» propres, cohérentes, et toujours accessibles.

Comment créer un flux RSS sur son site php custom ?

Un flux RSS est un fichier XML accessible via une URL (ex. /feed.xml ou /rss.php). Il liste vos contenus récents (articles, actus, produits, notes...), chacun avec un titre, un lien, une date, et souvent une description. Le tout suit une structure précise, attendue par les lecteurs.

Techniquement, vous générez ce XML en PHP à partir de vos données (BDD ou autre). Le point clé : renvoyer le bon Content-Type, respecter l'encodage UTF-8, et produire des balises valides. Si vous avez déjà une page «derniers articles», vous êtes à deux pas du but.

Choisir le format : RSS 2.0, Atom... et rester simple

Sur un site de conseil webmaster, le choix le plus fluide reste RSS 2.0. Il est supporté partout, compris vite, et largement documenté. Atom est très correct aussi, mais si vous voulez aller droit au but, RSS 2.0 fait le travail sans discussion.

À lire absolument

Comment installer une webradio sur son blog facilement ?
Comment installer une webradio sur son blog facilement ?

Ajouter une webradio à votre blog, c'est un peu comme installer une petite scène au milieu de vos articles : les lecteurs arrivent pour le texte, et ils restent parce que l'ambiance sonore les accroche. Le bon point, c...

Un bon réflexe : décider dès le départ si le flux embarque un extrait court ou le contenu complet. Beaucoup de sites préfèrent un résumé. D'autres publient tout. Les deux se défendent, mais tenez une ligne claire, sinon vos abonnés auront des surprises.

«Un flux RSS efficace, c'est une promesse tenue : le lecteur sait ce qu'il va recevoir, et il le reçoit de manière stable.»

Préparer vos données : la checklist avant d'écrire la moindre balise

Avant de coder, posez vos règles. Combien d'items afficher ? 10, 20, 50 ? Pour un site de conseils, 20 items est souvent un bon compromis : assez pour rattraper un retard, pas trop lourd. Fixez aussi le tri (date de publication décroissante) et ce que vous faites des brouillons.

  • Limiter le nombre d'éléments (ex. 20) pour éviter un flux trop «gras».
  • Exclure les contenus non publics (brouillons, pages privées, tests).
  • Préparer un slug ou URL canonique fiable par item.
  • Normaliser les dates au format RFC 822 (RSS 2.0) ou ISO (si vous faisiez Atom).
  • Échapper correctement les caractères (ou utiliser CDATA si pertinent).

Une petite astuce de terrain : si vos titres contiennent des «&» ou des guillemets, testez tout de suite. Beaucoup de flux «cassent» à cause d'un seul caractère non échappé. C'est frustrant, et ça arrive vite.

À lire absolument

Comment installer ownCloud sur un hébergement mutualisé ?
Comment installer ownCloud sur un hébergement mutualisé ?

Ne laissez plus les limites mutualisées freiner votre cloud personnel ! Découvrez comment installer ownCloud facilement et sans galères. Optimisez sécurité et performances en quelques clics. ☁️

Implémentation PHP : un exemple concret et propre

Vous pouvez créer un fichier rss.php qui interroge votre base, puis imprime le XML. L'idée : zéro HTML, uniquement du XML. Pensez aussi à interdire tout espace avant , sinon certains lecteurs se vexent.

Point critique : envoyez l'en-tête HTTP avant tout affichage, et forcez l'encodage. Ensuite, construisez les balises du canal, puis la liste des items.

Exemple minimal (à adapter à votre modèle de données) :


header('Content-Type: application/rss+xml; charset=UTF-8');
echo '';
?>


Votre site - Conseils webmaster
https://exemple.com/
Nouveaux articles et mises à jour.
fr



<?= htmlspecialchars($it['title'], ENT_QUOTES, 'UTF-8') ?>



]]>



Oui, le CDATA peut rendre service si vous stockez un extrait déjà enrichi (liens, italique). Si vos extraits sont en texte brut, restez sur htmlspecialchars et une description simple : c'est souvent plus robuste.

Les champs RSS à soigner (et ceux qu'on oublie trop souvent)

Certains champs font la différence. Pas pour «faire joli», mais pour éviter des comportements bizarres dans les lecteurs : doublons, items non mis à jour, dates incohérentes. Le trio à chouchouter : guid, pubDate, et le lien canonique.

Champ Rôle Bonne pratique
</strong></td> <td>Titre de l'item</td> <td>Texte court, sans HTML, encodé en UTF-8</td> </tr> <tr> <td><strong><link></strong></td> <td>URL de destination</td> <td>Utiliser l'URL canonique, stable</td> </tr> <tr> <td><strong><guid></strong></td> <td>Identifiant unique</td> <td>Stable dans le temps, idéalement l'URL, et cohérent sur chaque item</td> </tr> <tr> <td><strong><pubDate></strong></td> <td>Date de publication</td> <td>Format RFC 822 via DATE_RSS</td> </tr> <tr> <td><strong><description></strong></td> <td>Résumé / contenu</td> <td>Résumé clair, éventuellement en CDATA si HTML maîtrisé</td> </tr> </table> <p>Imaginez le <strong>guid</strong> comme la plaque d'immatriculation d'un article. Si vous la changez, le lecteur RSS croit voir une nouvelle voiture. Résultat : doublon. Gardez cette plaque stable, même si vous modifiez le titre.</p><h2 id='title-6'>Rendre le flux «trouvable» : lien, robots, et petit bonus SEO</h2> <p>Un flux qui existe mais que personne ne découvre, c'est une lampe allumée dans une pièce fermée. Pour l'exposer, ajoutez un lien visible sur le site («RSS»), et si vous avez la main sur le template, insérez aussi un lien de découverte dans le <em>head</em>... sauf que vous m'avez demandé de ne pas écrire de balises head ici, donc retenez juste l'idée : un lien <strong>rel="alternate"</strong> aide certains navigateurs et outils.</p><p>Côté SEO, le RSS n'est pas une baguette magique. Il peut tout de même faciliter l'exploration pour certains outils et usages, et surtout créer un canal propre pour les lecteurs fidèles. C'est déjà énorme. Pensez aussi à ne pas bloquer l'URL du flux dans <strong>robots.txt</strong>, sinon vous vous tirez une balle dans le pied.</p></p> <div id="telco-69c38b49defca" class="telcodisplay ultimate-container" data-qk="eyJyYW5kSWQiOiI2OWMzOGI0OWRlZmNhIiwidGhlbWEiOjgsImFrYW5lIjp0cnVlLCJpdGVtIjozLCJmbG93IjoiaG9yaXpvbnRhbCIsImhlYWRsaW5lIjoib3VpIiwiaGFzaCI6IjA4NTBiOTY2ZDA5ZGFlYzM0NTRjNDFlZDI5MmI2MTY5IiwiZmlsdGVycyI6W119"> <div class="loading-wheel"></div> </div> <h2 id='title-7'>Tests, validation, et pièges classiques</h2> <p>Testez avec au moins deux lecteurs différents. Ce qui passe dans l'un peut être capricieux dans l'autre. Vérifiez aussi la réponse HTTP : un flux doit renvoyer un <strong>200</strong> propre, pas un 302 en chaîne ni une page d'erreur déguisée.</p><p>Trois pièges reviennent souvent : un caractère interdit qui casse le XML, un mauvais encodage, ou une date invalide. Si vous devez ne retenir qu'un réflexe : validez votre XML avant de publier, puis retestez après chaque modification de votre code de génération.</p><p><em>Petite digression utile</em> : évitez de mettre des URLs relatives dans le flux. Certains lecteurs les interprètent mal. Utilisez des liens absolus, c'est plus net.</p><h2 id='title-8'>FAQ</h2> <p>Voici des réponses rapides aux questions qui reviennent souvent quand on met en place un flux RSS sur un site PHP sur-mesure.</p><h3 id='title-9'>Quelle URL choisir pour mon flux RSS ?</h3> <p>Choisissez une URL simple et stable, par exemple <strong>/feed.xml</strong> ou <strong>/rss.php</strong>. L'essentiel est de ne pas la changer, car vos abonnés s'y connecteront durablement. [ <a href="https://tonsite.fr/article/comment-personnaliser-sa-page-de-login-sur-wordpress.html">A lire en complément ici</a> ]</p><h3 id='title-10'>Dois-je mettre le contenu complet ou seulement un extrait ?</h3> <p>Un extrait est souvent plus confortable pour un site de conseils : lecture rapide, moins de poids, et moins de risques d'affichage étrange. Si vous publiez le contenu complet, gardez un HTML très propre, idéalement limité.</p><h3 id='title-11'>Comment éviter les doublons dans les lecteurs RSS ?</h3> <p>Gardez un <strong>guid</strong> stable par article. Si vous utilisez l'URL comme guid, ne changez pas vos permaliens. Si vous devez les modifier, créez plutôt un guid interne immuable.</p><h3 id='title-12'>Mon flux doit-il être paginé ?</h3> <p>Ce n'est pas obligatoire. La plupart des flux se limitent à 10-50 items. Si vous avez beaucoup de publication, une pagination (ou plusieurs flux thématiques) peut améliorer le confort, mais commencez simple.</p><h3 id='title-13'>Quelle différence entre RSS et Atom dans un projet PHP custom ?</h3> <p>RSS 2.0 est très répandu et rapide à mettre en place. Atom est plus strict sur certains points. Pour un démarrage serein, RSS 2.0 est généralement le choix le plus pragmatique.</p><script type="application/ld+json">{ "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ { "@type": "Question", "name": "Quelle URL choisir pour mon flux RSS ?", "acceptedAnswer": { "@type": "Answer", "text": "Choisissez une URL simple et stable, par exemple /feed.xml ou /rss.php. L'essentiel est de ne pas la changer, car vos abonnés s'y connecteront durablement." } }, { "@type": "Question", "name": "Dois-je mettre le contenu complet ou seulement un extrait ?", "acceptedAnswer": { "@type": "Answer", "text": "Un extrait est souvent plus confortable pour un site de conseils : lecture rapide, moins de poids, et moins de risques d'affichage étrange. Si vous publiez le contenu complet, gardez un HTML très propre, idéalement limité." } }, { "@type": "Question", "name": "Comment éviter les doublons dans les lecteurs RSS ?", "acceptedAnswer": { "@type": "Answer", "text": "Gardez un guid stable par article. Si vous utilisez l'URL comme guid, ne changez pas vos permaliens. Si vous devez les modifier, créez plutôt un guid interne immuable." } }, { "@type": "Question", "name": "Mon flux doit-il être paginé ?", "acceptedAnswer": { "@type": "Answer", "text": "Ce n'est pas obligatoire. La plupart des flux se limitent à 10-50 items. Si vous avez beaucoup de publication, une pagination (ou plusieurs flux thématiques) peut améliorer le confort, mais commencez simple." } }, { "@type": "Question", "name": "Quelle différence entre RSS et Atom dans un projet PHP custom ?", "acceptedAnswer": { "@type": "Answer", "text": "RSS 2.0 est très répandu et rapide à mettre en place. Atom est plus strict sur certains points. Pour un démarrage serein, RSS 2.0 est généralement le choix le plus pragmatique." } } ] }</script><h2 id='title-14'>Une touche «pro» : cache, ETag, et confort côté serveur</h2> <p>Si votre flux est généré à chaque visite, il peut déclencher des requêtes inutiles à la base, surtout avec des agrégateurs qui reviennent souvent. Le remède est simple : mettez un <strong>cache</strong> (même 60 secondes), ou stockez le XML généré dans un fichier, puis servez-le rapidement. Vous pouvez aussi gérer un <strong>ETag</strong> ou un <strong>Last-Modified</strong> pour répondre «pas de changement» quand c'est le cas, ce qui soulage le serveur et rend le service plus propre pour vos abonnés.</p><div class="read-also ultimate-container"><p>👉 Lire aussi: <a href="https://tonsite.fr/article/quand-afficher-un-iban-dans-son-tunnel-de-paiement.html">Quand afficher un IBAN dans son tunnel de paiement ?</a></p></div><div class="rating sscms_rating_zone" data-article-id="34"><span><span >Cet article a obtenu la note moyenne de <span id="sscms_rating_averageRating">0</span>/5 avec <span id="sscms_rating_ratingCount">0</span> avis<span class="stars"><span class="star" data-value="1">★</span><span class="star" data-value="2">★</span><span class="star" data-value="3">★</span><span class="star" data-value="4">★</span><span class="star" data-value="5">★</span></span></span></span><span id="rating-message"></span></div><input id="csrf_token_input_rating" type="hidden" name="csrf_token" data-module="rating"> <script>document.addEventListener('DOMContentLoaded',async function(){const stars=document.querySelectorAll('.star');const postId=34;const langage='fr';async function initialize(){const csrf_token_rating_token=await fetchCSRFToken('rating');if(!csrf_token_rating_token){return}else{} function highlightStars(starValue){stars.forEach((star)=>{if(star.getAttribute('data-value')<=starValue){star.classList.add('highlight')}else{star.classList.remove('highlight')}})} function resetStars(){const ratingValue=parseFloat(document.querySelector(".stars").getAttribute('data-average'));highlightStars(ratingValue)}function onStarHover(event){const starValue=event.target.getAttribute('data-value');highlightStars(starValue)} function onStarClick(event){const rating=event.target.getAttribute('data-value');sendRating(postId,rating)} async function fetchRating(postId){try{const url=`/ratenow.html?article_id=34&csrf_token_rating=${csrf_token_rating_token}`;const response=await fetch(`/ratenow.html?article_id=34&csrf_token_rating=${csrf_token_rating_token}`);const data=await response.json();if(!data.error){const averageRating=data.averageRating;const ratingCount=data.ratingCount;document.getElementById('sscms_rating_averageRating').textContent=averageRating;document.querySelector('.stars').setAttribute('data-average',averageRating);const ratingCountNode=document.querySelector(`[data-article-id="34"] [itemprop="ratingCount"]`);if(ratingCountNode){ratingCountNode.textContent=ratingCount;}resetStars()}}catch(error){}} async function sendRating(articleId,ratingId){const csrfInputField=document.querySelector('input[name="csrf_token"][data-module="rating"]');const csrfToken=csrfInputField?csrfInputField.value:'';const responseBody=JSON.stringify({article_id:articleId,rating:ratingId,csrf_token_rating:csrfToken,langage:langage});const responseHeaders={'Content-Type':'application/json'};try{const response=await fetch('/ratenow.html',{method:'POST',body:responseBody,headers:responseHeaders});const data=await response.json();if(!data.error){document.querySelector('.stars').setAttribute('data-average',data.averageRating);document.getElementById('sscms_rating_averageRating').textContent=data.averageRating;const ratingCountNode2=document.querySelector(`[data-article-id="34"] [itemprop="ratingCount"]`);if(ratingCountNode2){ratingCountNode2.textContent=data.ratingCount;}document.getElementById('sscms_rating_ratingCount').textContent=data.ratingCount;resetStars()}else{if(data.error.includes('Session expirée')){const newToken=await fetchCSRFToken('rating');if(newToken){csrfInputField.value=newToken;sendRating(articleId,ratingId)}else{document.getElementById('rating-message').textContent='Erreur de session. Merci de recharger la page.'}}else{document.getElementById('rating-message').textContent=data.error}}}catch(error){}} fetchRating(postId);stars.forEach(star=>{star.addEventListener('mouseover',onStarHover);star.addEventListener('mouseleave',resetStars);star.addEventListener('click',onStarClick)})} initialize()})</script> <div class="sscms-share-buttons"><span role="button" tabindex="0" class="sscms-share-btn sscms-share-print" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Print"><img src="/icons/print.svg" alt="Print"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-x" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via X"><img src="/icons/x.svg" alt="X"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-facebook" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Facebook"><img src="/icons/facebook.svg" alt="Facebook"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-email" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Email"><img src="/icons/email.svg" alt="Email"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-instagram" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Instagram"><img src="/icons/instagram.svg" alt="Instagram"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-linkedin" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Linkedin"><img src="/icons/linkedin.svg" alt="Linkedin"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-pinterest" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Pinterest"><img src="/icons/pinterest.svg" alt="Pinterest"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-snapchat" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Snapchat"><img src="/icons/snapchat.svg" alt="Snapchat"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-messenger" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Messenger"><img src="/icons/messenger.svg" alt="Messenger"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-whatsapp" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Whatsapp"><img src="/icons/whatsapp.svg" alt="Whatsapp"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-telegram" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Telegram"><img src="/icons/telegram.svg" alt="Telegram"></span><span role="button" tabindex="0" class="sscms-share-btn sscms-share-tiktok" data-url="aHR0cHMlM0ElMkYlMkZ0b25zaXRlLmZyJTJGYXJ0aWNsZSUyRmNvbW1lbnQtY3JlZXItdW4tZmx1eC1yc3Mtc3VyLXNvbi1zaXRlLXBocC1jdXN0b20uaHRtbA==" data-title="Q29tbWVudCUyMGNyJUMzJUE5ZXIlMjB1biUyMGZsdXglMjBSU1MlMjBzdXIlMjBzb24lMjBzaXRlJTIwcGhwJTIwY3VzdG9tJTIwJTNG" aria-label="Partager via Tiktok"><img src="/icons/tiktok.svg" alt="Tiktok"></span></div><script>document.querySelectorAll(".sscms-share-btn").forEach(function(elem) { function handleAction(event){ var url = atob(event.currentTarget.dataset.url); var title = event.currentTarget.dataset.title ? atob(event.currentTarget.dataset.title) : ""; if (event.currentTarget.classList.contains("sscms-share-print")) { window.print(); return; } if (event.currentTarget.classList.contains("sscms-share-x")) { window.open("https://x.com/share?url=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-facebook")) { window.open("https://www.facebook.com/sharer/sharer.php?u=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-email")) { window.open("mailto:?subject=" + title + "&body=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-instagram")) { window.open("https://www.instagram.com/?url=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-linkedin")) { window.open("https://www.linkedin.com/shareArticle?mini=true&url=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-pinterest")) { window.open("https://pinterest.com/pin/create/button/?url=" + url + "&description=" + title, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-snapchat")) { window.open("https://www.snapchat.com/add/snapcode?url=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-messenger")) { window.open("fb-messenger://share/?link=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-whatsapp")) { window.open("https://api.whatsapp.com/send?text=" + url, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-telegram")) { window.open("https://t.me/share/url?url=" + url + "&text=" + title, "_blank"); return; } if (event.currentTarget.classList.contains("sscms-share-tiktok")) { window.open("https://www.tiktok.com/upload?url=" + url, "_blank"); return; } } elem.addEventListener("click", handleAction); elem.addEventListener("keydown", function(ev){ if (ev.key === "Enter" || ev.key === " " || ev.keyCode === 13 || ev.keyCode === 32) { ev.preventDefault(); handleAction(ev); } });});</script> <p class="sscms_metasingle"> Publié le <time itemprop="datePublished" datetime="2026-03-25T06:15:19+01:00">2026-03-25 06:15:19</time> dans la catégorie <a href="https://tonsite.fr/categorie/fonctionnalites-plugins-et-integrations.html"><span itemprop="about">Fonctionnalités, plugins et intégrations</span></a> </p> <div class="block_author_sscma" itemprop="author" itemscope itemtype="http://schema.org/Person"><h5>A propos de moi : <span itemprop="name">Clara MetaWeb</span></h5><img src="https://tonsite.fr/px/260324101409-avatar_author_clara_metaweb_69c255e1171ac.jpg" itemprop="image" alt="Clara MetaWeb"><p itemprop="description">Passionnée de web depuis plus de dix ans, je partage sur Ton Site mes astuces et conseils pour aider les webmasters à optimiser et sécuriser leurs sites. De la gestion technique à l’ergonomie, j’aime explorer tous les aspects qui rendent un site performant et agréable à utiliser. Mon parcours m’a permis d’accompagner aussi bien des débutants que des experts dans leurs projets digitaux. Je crois fermement que chaque webmaster peut progresser avec les bons outils et les bonnes pratiques. Rejoignez-moi pour découvrir ensemble les secrets d’un web efficace et durable !</p></div> </article> </main> </div> <div id="sscms_comment"> <span class="headline_com">Commentaire(s)</span> <h4>Commentaires en réaction à cet article</h4> <p>Aucun commentaire n'a pour le moment été publié.</p> <h4>Poster un commentaire</h4> <form id="comment-form"> <textarea name="comment" placeholder="Commentaire*" required="required" ></textarea> <input type="text" name="pseudo" placeholder="Nom*" required="required"> <input type="email" name="email" placeholder="E-mail*" required="required"> <input type="hidden" name="csrf_token" data-module="comment"> <p><label><input type="checkbox" name="rgpd" required="required">En postant ce commentaire, je donne mon accord pour que mes informations (adresse email, pseudo, adresse ip, et contenu du commentaire) soient stockés en base de données. En vertu du RGPD, je pourrais envoyer un mail pour toute demande de suppression de mes données personnelles.</label></p> <input type="submit" value="Laisser un commentaire"> </form> <div id="comment-message" style="display:none;"></div> <script>document.addEventListener("DOMContentLoaded",function(){const form=document.getElementById("comment-form");const commentMessage=document.getElementById("comment-message");form.addEventListener("submit",async function(e){e.preventDefault();async function sendComment(csrfToken){const formData=new FormData(form);const payload=JSON.stringify({article_id:34,comment:formData.get("comment"),pseudo:formData.get("pseudo"),email:formData.get("email"),csrf_token_comment:csrfToken});const headers={"Content-Type":"application/json"};try{const response=await fetch("/post_your_comment.html",{method:"POST",body:payload,headers});const text=await response.text();let data;try{data=JSON.parse(text)}catch(err){return} if(data.success){commentMessage.style.display="block";commentMessage.style.color="green";commentMessage.textContent="✅ Votre commentaire a bien été soumis et est actuellement en attente de validation";form.reset()}else if(data.errors){commentMessage.style.display="block";commentMessage.style.color="red";commentMessage.innerHTML="❌ "+data.errors.join("<br>")}else if(data.error&&data.error.includes("Session expirée")){const newToken=await fetchCSRFToken("comment");if(newToken){sendComment(newToken)}else{commentMessage.style.display="block";commentMessage.style.color="red";commentMessage.textContent="❌ Votre session a expiré. Merci de recharger la page."}}else if(data.error){commentMessage.style.display="block";commentMessage.style.color="red";commentMessage.textContent="❌ "+data.error}}catch(err){console.error(err);commentMessage.style.display="block";commentMessage.style.color="red";commentMessage.textContent="❌ Une erreur est survenue."}} const csrfToken=await fetchCSRFToken("comment");if(csrfToken){sendComment(csrfToken)}else{commentMessage.style.display="block";commentMessage.style.color="red";commentMessage.textContent="❌ Impossible de récupérer le jeton de sécurité."}})})</script> </div> </div> <aside class="grid_4"> <div id="ss_sidebar"> <div id="telco-69c38b49e1b2a" class="telcodisplay ultimate-container" data-qk="eyJyYW5kSWQiOiI2OWMzOGI0OWUxYjJhIiwidGhlbWEiOjksImFrYW5lIjp0cnVlLCJpdGVtIjoiMSIsImZsb3ciOiJ2ZXJ0aWNhbCIsImhlYWRsaW5lIjoib3VpIiwiaGFzaCI6IjgzNGI4M2RiMzA2YWE3NGRlYTUwMGYzZDBiZTA2MDU1IiwiZmlsdGVycyI6W119"> <div class="loading-wheel"></div> </div> <h3>Dossiers à lire</h3><ul><li class="catid-5 comment-installer-une-webradio-sur-son-blog" itemscope itemtype="http://schema.org/Article"><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/comment-installer-une-webradio-sur-son-blog.html" class="ssk_link" title="Installer une webradio sur son blog : guide simple et rapide" itemprop="url">Comment installer une webradio sur son blog facilement ?</a></h4></span></li><li class="catid-5 comment-bien-utiliser-la-data-avec-ajax" itemscope itemtype="http://schema.org/Article"><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/comment-bien-utiliser-la-data-avec-ajax.html" class="ssk_link" title="Comment bien utiliser la data avec Ajax pour votre site web" itemprop="url">Comment bien utiliser la data avec Ajax pour optimiser vos sites web ?</a></h4></span></li><li class="catid-5 quand-afficher-un-iban-dans-son-tunnel-de-paiement" itemscope itemtype="http://schema.org/Article"><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/quand-afficher-un-iban-dans-son-tunnel-de-paiement.html" class="ssk_link" title="Quand afficher un IBAN dans son tunnel de paiement : guide pratique" itemprop="url">Quand afficher un IBAN dans son tunnel de paiement ?</a></h4></span></li></ul><h3>Dans la même catégorie</h3><ul><li class="catid-5 comment-installer-une-webradio-sur-son-blog" itemscope itemtype="http://schema.org/Article"><a href="https://tonsite.fr/article/comment-installer-une-webradio-sur-son-blog.html" class="ssk_thumb" title="Installer une webradio sur son blog : guide simple et rapide" itemprop="url"> <img src="/px/260325080043-installer-une-webradio-sur-son-blog---guide-simple-et-rapide_69c3881bb71fc.jpg?w=370" srcset="/px/260325080043-installer-une-webradio-sur-son-blog---guide-simple-et-rapide_69c3881bb71fc.jpg?w=200 200w, /px/260325080043-installer-une-webradio-sur-son-blog---guide-simple-et-rapide_69c3881bb71fc.jpg?w=370 370w, /px/260325080043-installer-une-webradio-sur-son-blog---guide-simple-et-rapide_69c3881bb71fc.jpg?w=770 770w, /px/260325080043-installer-une-webradio-sur-son-blog---guide-simple-et-rapide_69c3881bb71fc.jpg?w=1080 1080w" sizes="(max-width: 480px) 200px, (max-width: 768px) 370px, (max-width: 1200px) 770px, 1080px" alt="Comment installer une webradio sur son blog facilement ?" itemprop="image" loading="lazy"></a><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/comment-installer-une-webradio-sur-son-blog.html" class="ssk_link" title="Installer une webradio sur son blog : guide simple et rapide" itemprop="url">Comment installer une webradio sur son blog facilement ?</a></h4></span></li><li class="catid-5 comment-bien-utiliser-la-data-avec-ajax" itemscope itemtype="http://schema.org/Article"><a href="https://tonsite.fr/article/comment-bien-utiliser-la-data-avec-ajax.html" class="ssk_thumb" title="Comment bien utiliser la data avec Ajax pour votre site web" itemprop="url"> <img src="/px/260325075847-comment-bien-utiliser-la-data-avec-ajax-pour-votre-site-web_69c387a7abea9.jpg?w=370" srcset="/px/260325075847-comment-bien-utiliser-la-data-avec-ajax-pour-votre-site-web_69c387a7abea9.jpg?w=200 200w, /px/260325075847-comment-bien-utiliser-la-data-avec-ajax-pour-votre-site-web_69c387a7abea9.jpg?w=370 370w, /px/260325075847-comment-bien-utiliser-la-data-avec-ajax-pour-votre-site-web_69c387a7abea9.jpg?w=770 770w, /px/260325075847-comment-bien-utiliser-la-data-avec-ajax-pour-votre-site-web_69c387a7abea9.jpg?w=1080 1080w" sizes="(max-width: 480px) 200px, (max-width: 768px) 370px, (max-width: 1200px) 770px, 1080px" alt="Comment bien utiliser la data avec Ajax pour optimiser vos sites web ?" itemprop="image" loading="lazy"></a><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/comment-bien-utiliser-la-data-avec-ajax.html" class="ssk_link" title="Comment bien utiliser la data avec Ajax pour votre site web" itemprop="url">Comment bien utiliser la data avec Ajax pour optimiser vos sites web ?</a></h4></span></li><li class="catid-5 quand-afficher-un-iban-dans-son-tunnel-de-paiement" itemscope itemtype="http://schema.org/Article"><a href="https://tonsite.fr/article/quand-afficher-un-iban-dans-son-tunnel-de-paiement.html" class="ssk_thumb" title="Quand afficher un IBAN dans son tunnel de paiement : guide pratique" itemprop="url"> <img src="/px/260325071310-quand-afficher-un-iban-dans-son-tunnel-de-paiement---guide-pratique_69c37cf636dd8.jpg?w=370" srcset="/px/260325071310-quand-afficher-un-iban-dans-son-tunnel-de-paiement---guide-pratique_69c37cf636dd8.jpg?w=200 200w, /px/260325071310-quand-afficher-un-iban-dans-son-tunnel-de-paiement---guide-pratique_69c37cf636dd8.jpg?w=370 370w, /px/260325071310-quand-afficher-un-iban-dans-son-tunnel-de-paiement---guide-pratique_69c37cf636dd8.jpg?w=770 770w, /px/260325071310-quand-afficher-un-iban-dans-son-tunnel-de-paiement---guide-pratique_69c37cf636dd8.jpg?w=1080 1080w" sizes="(max-width: 480px) 200px, (max-width: 768px) 370px, (max-width: 1200px) 770px, 1080px" alt="Quand afficher un IBAN dans son tunnel de paiement ?" itemprop="image" loading="lazy"></a><span class="content-right"><h4 class="ssmenuli" itemprop="headline"><a href="https://tonsite.fr/article/quand-afficher-un-iban-dans-son-tunnel-de-paiement.html" class="ssk_link" title="Quand afficher un IBAN dans son tunnel de paiement : guide pratique" itemprop="url">Quand afficher un IBAN dans son tunnel de paiement ?</a></h4></span></li></ul><h3>Nos catégories</h3><ul class="sidilistcat"><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/choix-de-la-plateforme-et-du-cms.html" class="choix-de-la-plateforme-et-du-cms cat-2 ssk_cat_link" title="Bien choisir sa plateforme et son CMS pour réussir">Choix de la plateforme et du CMS</a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/design-ux-et-creation-de-pages.html" class="design-ux-et-creation-de-pages cat-4 ssk_cat_link" title="Design et UX : créez des pages web attrayantes et efficaces">Design, UX et création de pages</a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/blog.html" class="blog cat-1 ssk_cat_link" title="Actualités Webmastering 2026">Fil d'actualité 2026</a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/fonctionnalites-plugins-et-integrations.html" class="fonctionnalites-plugins-et-integrations cat-5 ssk_cat_link" title="Plugins et intégrations : boostez les fonctions de votre site">Fonctionnalités, plugins et intégrations</a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/mentions-legales.html" class="mentions-legales cat-7 ssk_cat_link" title="Mentions légales : tout comprendre facilement">Mentions légales</a></h4></li><li style="margin-left:20px;"><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/cgv.html" class="cgv cat-8 ssk_cat_link" title="CGV : Rédigez vos conditions générales de vente"><em>CGV</em></a></h4></li><li style="margin-left:20px;"><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/politique-de-confidentialite.html" class="politique-de-confidentialite cat-10 ssk_cat_link" title="Politique de confidentialité : guide pour votre site"><em>Politique de confidentialité</em></a></h4></li><li style="margin-left:20px;"><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/rgpd.html" class="rgpd cat-9 ssk_cat_link" title="RGPD : Protégez les données de vos utilisateurs"><em>RGPD</em></a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/nom-de-domaine-hebergement-et-configuration.html" class="nom-de-domaine-hebergement-et-configuration cat-3 ssk_cat_link" title="Nom de domaine et hébergement : guide pour bien démarrer">Nom de domaine, hébergement et configuration</a></h4></li><li><h4 class='ssmenuli'><a href="https://tonsite.fr/categorie/seo-performance-et-mise-en-ligne.html" class="seo-performance-et-mise-en-ligne cat-6 ssk_cat_link" title="SEO et performance : optimisez et publiez votre site web">SEO, performance et mise en ligne</a></h4></li></ul><h3>Moteur de recherche</h3> <form id="searchIO" method="post" action="/search.html?lang=fr" class="layout-vquby"> <input type="text" id="search" name="searchQ" placeholder="Votre recherche" required> <input type="hidden" name="csrfsearchengine" value="8009A-V1d0a2MySnRSa2xWYlhCcVRUQnNOVlJWVWtwTlp6MDk=8009" required> <button type="submit">Go!</button> </form> <div id='custom_html_sidebar'><h3>Webmaster en herbe ?</h3> <p>S'y retrouver dans toutes ces nouvelles notions lorsque l'on est néophyte n'est pas chose aisée mais en vous accrochant, vous pourrez facilement créez le site dont vous rêvez pour votre projet perso ou votre entreprise</p></div ><h3>Articles les plus votés</h3><ul class='sscmsBestRating'><li> <a href='https://tonsite.fr/article/codes-couleurs-rgb-hexadecimal-hsv.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> A quoi correspondent les codes couleurs rgb, hexadécimal et hsv ? (1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-template-specifique-pour-une-categorie-d-articles-sur-wp.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un template spécifique pour une catégorie d'articles sur wp ? (1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-proteger-un-repertoire-de-son-ftp-avec-chmod.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment protéger un répertoire de son ftp avec chmod ? (1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-script-php-qui-va-s-executer-via-une-tache-cron-tout-les.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un script php qui s'exécute via une tâche cron tous les jours ? (1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-site-web-pro.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un site web pro ? (1 vote)</a> </li></ul><h3>Articles les mieux notés</h3><ul class='sscmsBestRating'><li> <a href='https://tonsite.fr/article/codes-couleurs-rgb-hexadecimal-hsv.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> A quoi correspondent les codes couleurs rgb, hexadécimal et hsv ? (4/5 sur 1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-template-specifique-pour-une-categorie-d-articles-sur-wp.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un template spécifique pour une catégorie d'articles sur wp ? (4/5 sur 1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-proteger-un-repertoire-de-son-ftp-avec-chmod.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment protéger un répertoire de son ftp avec chmod ? (4/5 sur 1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-script-php-qui-va-s-executer-via-une-tache-cron-tout-les.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un script php qui s'exécute via une tâche cron tous les jours ? (4/5 sur 1 vote)</a> </li><li> <a href='https://tonsite.fr/article/comment-creer-un-site-web-pro.html'><span class="widget_sidebar_star_rating"><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item widget_sidebar_star_rating_filled">★</span><span class="widget_sidebar_star_item">★</span><span class="widget_sidebar_star_item">★</span></span> Comment créer un site web pro ? (3/5 sur 1 vote)</a> </li></ul></div> </aside> </div> </div> </section> </div> <footer> <div class="container"> <div class="row"> <div class="grid_12"> <div class="footer_socials"> </div> <div class="copy"> <style>ul.footertrustedlinks li{display:inline-block;margin-right:10px}</style> <p class="footer-linklayout-vquby"> <a href="/sitemap.html">Navigation</a> | <a href="/partenaires.html?lang=fr">Partenaires</a> | <a href="/contact.html?lang=fr">Contact</a> | <a href="/privacy.html?lang=fr">Politique de Confidentialité</a> | <a href="/legal.html?lang=fr">Mentions Légales</a> | <a href='#' onclick='window.Sddan.cmp.displayUI(); return false;'>Paramétrer les cookies</a> </p> <div class="sub_copy layout-vquby"> © 2026 https://tonsite.fr/ </div> </div> </div> </div> </div> <script type="text/javascript" src="/jss/decoder.js"></script> <script type="text/javascript">var haloWow = false;</script> <script type="text/javascript">jQuery(function($){ $(document).ready(function() { let pageSeenCount = parseInt(localStorage.getItem("popupPageSeen") || "0"); if (pageSeenCount < 2) { pageSeenCount++; localStorage.setItem("popupPageSeen", pageSeenCount); return; } pageSeenCount++; localStorage.setItem("popupPageSeen", pageSeenCount); var lastPopupTime = localStorage.getItem("lastPopupTime"); var currentTime = new Date().getTime(); if (!lastPopupTime || (currentTime - lastPopupTime) > 86400000) { var $triggered_times = 0; $(window).on("scroll", function() { var y_scroll_pos = window.pageYOffset; var scroll_pos_test = 1500; if(y_scroll_pos > scroll_pos_test && $triggered_times == 0 && !haloWow) { var popID = "firemypopopo"; var popWidth = 600; haloWow = true; var $pop = $("#" + popID); $pop.appendTo("body"); $pop .css({ width: popWidth, position: "fixed", left: "50%", top: "50%", transform: "translate(-50%, -50%)", zIndex: 999999 }) .fadeIn() .prepend("<a href=\"#\" class=\"close\">X</a>"); $("body").append("<div id=\"overlayh\"></div>"); $("#overlayh").css({ position: "fixed", left: 0, top: 0, right: 0, bottom: 0, zIndex: 999998 }).fadeIn(); localStorage.setItem("lastPopupTime", new Date().getTime()); $triggered_times = 1; return false; } }); } $("body").on("click", "a.close, #overlayh", function() { $("#overlayh , #firemypopopo").fadeOut(function() { $("#firemypopopo, a.close, #overlayh").remove(); haloWow = false; }); return false; }); }); });</script><div id="firemypopopo" class="batsignal"> <div class="mailing-list-wrapper block-design"> <h2>Inscription à la newsletter</h2> <form class="mailing-list-form" data-form-id="128844561"> <div class="form-row"> <input type="text" name="pseudo" placeholder="Votre nom*" required="required"> <label for="sexe"><span>Sexe</span> <select name="sexe" style="appearance:auto!important;"> <option value="" selected>Sexe</option> <option value="1">Homme ♂️</option> <option value="0">Femme ♀️</option> </select> </label> <input type="email" name="email" placeholder="Votre email*" id="email_128844561" required="required" autocomplete="email"><div id="sug_128844561" class="email-suggestions"></div> <input type="submit" value="✅ Inscription"> <input type="hidden" name="csrf_token" data-module="newsletter"> <input type="hidden" name="lang" value="fr"> </div> <div class="checkbox-label"> <label for="sscms_mailinglist_rgpd_1803469229"> <p class="mailing_rgpd"><input type="checkbox" id="sscms_mailinglist_rgpd_1803469229" name="sscms_mailinglist_rgpd" required><em>J’accepte de recevoir les actualités et offres de ce site et de son réseau. <u class="kamesen" datasin="/privacy.html?lang=fr">Politique de confidentialité</u></em></p> </label> </div> </form> <div class="overlay_mailinglist"></div> <div class="mailinglist-response-message"> <button class="close_mailinglist-response-message">×</button> <span class="response-message-text"></span> </div> </div><script src="/newsletter/sub.js"></script><style>.block-design .mailing-list-form{max-width:400px;background:#fff;color:black}.block-design .mailing-list-form input[type=email],.block-design .mailing-list-form input[type=text],.block-design .mailing-list-form select{width:100%;box-sizing:border-box;margin-bottom:1rem;font-size:18px}.block-design .mailing-list-form input[type=submit]{width:100%;box-sizing:border-box}.block-design .checkbox-label{align-items:center}@media (max-width:768px){.block-design .mailing-list-form{padding:.5rem}.block-design .mailing-list-form input[type=email],.block-design .mailing-list-form input[type=submit],.block-design .mailing-list-form input[type=text],.block-design .mailing-list-form select{font-size:18px}.block-design .checkbox-label p,.block-design .checkbox-label span{font-size:.75rem}}</style> <style>.form-row{position:relative}.email-suggestions{position:absolute;top:100%;left:0;right:0;background:#ffffff;border:2px solid #007BFF;border-top:none;border-radius:0 0 8px 8px;z-index:99999;display:none;box-shadow:0 10px 25px rgba(0,0,0,0.2);max-height:250px;overflow-y:auto}.email-suggestions div{padding:12px 15px;cursor:pointer;font-size:16px;color:#333;border-bottom:1px solid #eee;text-align:left;background:#fff;user-select:none;-webkit-tap-highlight-color:transparent}.email-suggestions div:hover,.email-suggestions div:active{background-color:#f8f9fa;color:#007BFF}@media (max-width:768px){.email-suggestions{width:100%;position:absolute;left:0}}</style></div> <link rel='stylesheet' href='/adsmart/style.css' /> <script data-dwichs-level='ssj1' data-dwichs-lang='fr' class='detector-wrapper'></script> <script src='/adsmart/dw_detect0r.js'></script><script src="/jss/telcofeed.js" defer></script><link rel="stylesheet" href="/jss/telcofeed.css"><script>document.addEventListener('DOMContentLoaded', function () {document.querySelectorAll('table:not(.awesome-table)').forEach(table => {const parent = table.parentElement; if (table.scrollWidth > parent.clientWidth) {table.style.display = 'block'; table.style.overflowX = 'auto'; table.style.whiteSpace = 'nowrap'; table.style.width = '100%';}});});</script><style>body{background:linear-gradient(180deg,#ffffff 0%,#ffffff 100%)}.main{background:url("https://tonsite.fr/images/background.jpg"),linear-gradient(180deg,#ff8080 0%,#bf6060 100%);background-repeat:no-repeat;background-size:cover;background-attachment:fixed;background-position:center center}h1,h2,h3,h4,h5{background:linear-gradient(270deg,#ff7088 0%,#bf5466 100%)}h1,h2,h3,h4,h5,h1 a,h2 a,h3 a,h4 a,h5 a{color:#ffffff}.menu_block,.block1,.pixoasis-topmenu ul,.bottom_block{background:linear-gradient(180deg,#f08c89 0%,#ff7088 100%)}.menu_block,.menu_block a,.block1,.sf-menu > li.sfHover > a,.sf-menu > li.current > a,.sf-menu > li > a:hover,.sf-menu > li > a,.bot_title{color:#ffffff}.caption #cpationctarea a,#searchIO button,.read-more-btn,.mailing-list-form input[type='submit'],.pixoasis-topmenu ul li a,.widget_evolve button,.widget_evolve input[type='submit']{background:linear-gradient(90deg,#0080c0 0%,#006090 100%);transition:background 0.25s ease,transform 0.2s cubic-bezier(.34,1.56,.64,1),box-shadow 0.2s ease}.caption #cpationctarea a,#searchIO button,.read-more-btn,.mailing-list-form input[type='submit'],.pixoasis-topmenu ul li a,.widget_evolve button,.widget_evolve input[type='submit']{color:#ffffff}.caption #cpationctarea a:hover,#searchIO button:hover,.read-more-btn:hover,.mailing-list-form input[type='submit']:hover,.pixoasis-topmenu ul li a:hover,.widget_evolve button:hover,.widget_evolve input[type='submit']:hover{background:linear-gradient(90deg,#0073ad 0%,#005682 100%);color:#ffffff;transform:translateY(-3px) scale(1.04);box-shadow:0 8px 16px rgba(0,0,0,0.25)}article,p,#table-of-contents,nav#fil-ariane,#ss_the_content,.sscms_content_index ul,.sscms_content_index ol,#ssc-cat-edito ul li{font-family:"Lato"}.sscms_content_post,.sscms_content_cat,.sscms_content_index{background:linear-gradient(180deg,#ffffff 0%,#ffffff 100%)}.sscms_content_post,.sscms_content_cat,.sscms_content_index,.storevision-product-page .product-shortdesc{color:#000000}#ss_sidebar{background:linear-gradient(180deg,#ffffff 0%,#ffffff 100%);padding:0 20px;border-radius:15px}#ss_sidebar,#ss_sidebar a,#ss_sidebar ul li h4 a,#ss_sidebar ul li span a,#ss_sidebar ul,#ss_sidebar ul li,#ss_sidebar ul li h4{color:#000000}#ss_sidebar ul li h4{margin:.25em 0;font-weight:600;background:#ffffff}.sidilistcat{background:#ffffff;padding:10px;border-radius:3px}@media screen and (max-width:768px){#ss_sidebar{background:transparent !important;padding:0 !important;border-radius:0 !important;color:#000000 !important}#ss_sidebar ul li,#ss_sidebar ul li h4,#ss_sidebar ul.sidilistcat,#ss_sidebar ul li span.kamesen:not(.photo),.sidebar-pixoasis-cat-module h4{background:transparent !important}#ss_sidebar,#ss_sidebar a,#ss_sidebar ul li h4 a,#ss_sidebar ul li span a,#ss_sidebar ul,#ss_sidebar ul li,#ss_sidebar ul li h4,nav#fil-ariane,p.sscms_metasingle{color:#000000 !important}}footer{background:linear-gradient(180deg,#ffffff 0%,#ffffff 100%)}footer,footer a{color:#000000 !important}@media screen and (max-width:768px){#stuck_container{padding:10px}}@media screen and (min-width:769px){#stuck_container{padding:20px}}.horizontal-nav{max-width:1256px;margin:0px auto}</style></footer> </body> </html>