Comment ajouter Infinite Scroll à votre blog WordPress

Lors d’une conversation avec Matt Mullenweg au WordCamp Atlanta, il nous a dit qu’ils ajoutaient un défilement infini à certains sites Web de partenaires VIP sur WordPress.com, car les résultats étaient stupéfiants. Il a suggéré d’essayer d’ajouter cela à notre projet List25. Après quelques recherches, nous avons découvert qu’il était assez facile à mettre en œuvre. Cela nous a pris moins de 1 minute pour installer Infinite Scroll dans WordPress. Dans cet article, nous allons vous montrer comment installer vous-même Infinite Scroll dans WordPress..

Mise à jour: Nous avons retiré ce plugin de notre site. Pendant les périodes de pointe, nos serveurs se bloquaient. À chaque fois que de nombreux utilisateurs commençaient à faire du défilement infini, nous remarquions que notre mémoire était épuisée, ce qui empêchait le serveur de répondre. Cela fonctionnerait probablement très bien pour les petits sites.

Qu'est-ce que Infinite Scroll??

Traditionnellement, l'utilisateur devait cliquer sur la page suivante ou sur la page précédente pour visiter le contenu de publication plus ancien. Cependant, récemment, une nouvelle tendance a été lancée par des sites populaires (tels que Facebook et Twitter) dans lesquels ils chargent automatiquement le contenu de la page suivante lorsque l'utilisateur clique au bas de la publication. Cette technique s’est révélée être une augmentation du temps passé sur la page par l’utilisateur, car le nouveau contenu se charge automatiquement..

Si vous utilisez Facebook ou Twitter, vous avez déjà visionné l'aperçu en direct de cela. Toutefois, si vous voulez savoir à quoi cela ressemble sur un site WordPress, consultez List25..

Comment faire pour ajouter Infinite Scroll dans WordPress

La première chose à faire est d’installer et d’activer le plugin Infinite Scroll..

Lors de l'activation, une nouvelle option de menu sera ajoutée sous l'onglet des paramètres, appelée Infinite Scroll. Sur près de 90% des sites de blogues, cela devrait fonctionner sans changer un seul paramètre. Toutefois, si vous avez un blog conçu relativement sur mesure, vous devrez alors ajuster les «sélecteurs». Allez sur la page de configuration du plugin et cliquez sur l'onglet sélecteurs.

Le plugin pré-remplira les sélecteurs en fonction des normes. Le sélecteur de contenu serait la div qui enveloppe votre contenu sur la page principale. Dans notre thème, c'était #content. C'est très standard et la plupart des auteurs de thèmes l'utilisent. Nous n'avons pas eu à changer cette partie. Le sélecteur de messages par défaut était #content div.post, ce qui est standard sur la plupart des sites de style blog. Toutefois, nous enveloppons nos messages avec un autre div appelé .post-container. Cela nous permet de diviser notre vignette et le contenu du site en deux grilles distinctes. Lorsque nous avons installé le plugin pour la première fois, celui-ci fonctionnait, mais il ne chargeait pas nos vignettes. Il s'est avéré que la raison pour laquelle les miniatures n'étaient pas chargées était que le sélecteur de publication n'était pas ce que nous voulions..

Pour le sélecteur de navigation et le sélecteur de page suivante, vous n'aurez probablement pas à le changer car il s'agit de paramètres très standard et presque 99% des thèmes l'utilisent (ou espérons-le).

Dans l'écran Options générales, vous pouvez personnaliser l'image de chargement, le texte chargé, le texte final, etc..

Ceci est un plugin très cool que nous venons d'installer. Si vous souhaitez ajouter un défilement infini à votre site, alors ce plugin est fait pour vous.

Il est important de noter que cela ne fonctionne que sur la page d'accueil de votre blog. Cela ne fonctionnera pas sur les pages d'archives de catégories / balises.

Obtenir le plugin Infinite Scroll