Afin de lancer un réseau mondial peu coûteux de sites gérés par des volontaires qui fourniraient aux acheteurs des annuaires classés par catégories dans les magasins locaux, je devais tirer parti de la puissance de WordPress avec des personnalisations et des solutions de contournement inhabituelles. Il existe un certain nombre d'approches pour fournir des expériences locales avec WordPress. Dans ce tutoriel, je vais vous montrer pourquoi et comment nous avons décidé de créer une solution personnalisée..
En juillet, j'ai lancé un guide mondial sur les alternatives au shopping sur Internet chez Amazon, appelé FleetheJungle.com, et la réponse a été excellente. Nous avons reçu beaucoup de couverture médiatique et de trafic ultérieur. Ce n'est pas une application basée sur une base de données; Au lieu de cela, nous avons exploité le thème exceptionnel de la base de connaissances KnowHow:
Mais pour développer le site, nous devions proposer des versions géolocales pour chaque ville. Certes, le site mondial aide les visiteurs à annuler leur statut de membre principal ou à trouver une alternative aux livres Kindle, mais rien n'incitait les gens à soutenir les petites entreprises de leurs communautés..
Pour commencer, nous avons créé un guide pour les acheteurs locaux dans la ville voisine de Portland, une ville qui possède un fier héritage de petites entreprises indépendantes et insolites..
Crédit: Forest and Waves Carte de Portland par Edward Juan.
Le défi technique
Certes, j'ai assez écrit sur le lancement rapide d'une multitude de sites Web WordPress à l'aide de recettes préconfigurées et pré-optimisées, mais le maintien des exigences associées à un réseau peut prendre énormément de temps, comme la gestion du référencement, des mises à niveau de plugins, etc..
J'ai aussi envisagé WordPress Multisite mais même si je sais elle est beaucoup grandi, nous avons eu un certain nombre de jumelages difficiles et nous n’avions probablement jamais imaginé être ensemble. Une fois que vous êtes impliqué avec "elle", il est très difficile de rompre.
J'avais besoin d'une solution plus simple.
Dans ce didacticiel, je vais vous guider dans les personnalisations et les astuces que j'ai utilisées avec WordPress et dans le thème de ma base de connaissances pour lancer notre guide d'achat à Portland et faciliter le lancement de nombreuses autres villes, tout en évitant les frais généraux liés à la gestion de dizaines, voire de centaines de. des sites.
Les exigences du réseau géolocal
Voici certaines des exigences de base pour lancer plus de sites:
1. Maintenir un site mondial. Je voulais garder le domaine principal global, flottehejungle.com intact, sans articles locaux, mais plutôt un guide des villes disponibles..
2. Localiser par sous-domaine. Je voulais un contenu localisé par sous-domaine. Par exemple, une visite sur http://portland.fleethejungle.com permettrait de promouvoir le contenu local sur le site tout en réutilisant certaines catégories de sites nationaux spécifiques liées aux achats sur Internet plus large, par exemple. streaming vidéo (il n'y a pas d'alternative à HBO Now basée sur Portland). CraigsList fournit un bon modèle pour cela.
3. Intégration entre local et mondial. Je voulais fournir aux visiteurs locaux une explication des différences entre leur site local et le site mondial tout en les encourageant à participer à l'amélioration des listes de leur ville..
4. Géré par des bénévoles. Je souhaitais faciliter l'ajout régulier de villes sur le site de manière à ce qu'il ne nécessite que des volontaires possédant des compétences de base en matière de blogs pour se lancer et se maintenir. Il y a trop de conditions pour lancer de nouveaux sites WordPress pour chaque ville afin de le faire facilement avec des volontaires.
5. Maintenance minimale. Enfin, je souhaitais que la maintenance du réseau du site soit aussi simple que l’exécution d’un seul site..
Explorons certaines des approches techniques souvent utilisées pour répondre à ce type d'exigences..
Approches techniques
Pour la gestion de contenu, j'ai envisagé trois approches de base:
Exécuter différentes installations de WordPress.
Utilisez WordPress Multisite pour exécuter différents sites.
Personnaliser WordPress pour filtrer dynamiquement le contenu en fonction de la géographie.
Comme je l'ai dit plus tôt, je ne suis pas un fan de Multisite et je voulais éviter la complexité liée au lancement et à la maintenance de nombreux sites WordPress. Un site comme Flee the Jungle aurait tellement de contenu central qu'il faudrait réutiliser dans plusieurs pages de la ville (par exemple, comment mettre fin à votre abonnement Prime), et je ne voulais pas avoir à maintenir ce contenu sur différentes installations WordPress -ou écrire du code pour le faire.
J'ai décidé de filtrer le contenu en fonction du domaine ou du sous-domaine utilisé par le visiteur dans le navigateur..
Si vous avez lu mon tutoriel Comment utiliser les cartes de quartier de Zillow et la géolocalisation HTML5, vous savez utiliser la géolocalisation basée sur un navigateur HTML5 pour déterminer la position d'un utilisateur. Cependant, je voulais que l'utilisateur ait plus de contrôle.
Je voulais que l'utilisateur utilise un sous-domaine comme celui qui a travaillé pendant des années avec CraigsList pour les guider vers leur ville.
Mais la domination de WordPress sur les URL absolues rend cela difficile. Lorsque j'ai commencé à expérimenter le suivi du sous-domaine entrant pour une ville et à le mapper sur des liens sur la page, j'ai rencontré l'habitude de WordPress de créer des liens absolus presque partout. Un collègue à qui j'ai parlé en a tout de suite ri quand je lui ai posé la question. C'est un ennemi commun des développeurs WordPress..
Dans ce didacticiel, je vais partager les personnalisations dans les requêtes PHP de notre thème pour créer nos sites basés sur des villes et la manière dont nous avons finalement résolu le problème des URL absolues..
Personnaliser WordPress pour Geolocal
Voici comment j'ai décidé d'implémenter des sites urbains pour Flee the Jungle qui pourraient être facilement gérés et créés par des blogueurs locaux sans compétences techniques supplémentaires..
Exploitation du marquage avec des sous-domaines
Les articles écrits pour les villes seraient étiquetés par nom de ville, par exemple. "portland". Les articles pour le site global seraient étiquetés "dans le monde entier". Je souhaitais pouvoir inclure des articles sur les magasins Internet dans le monde entier pour certaines catégories de supports locaux moins efficaces, tels que le streaming vidéo. D'autres catégories sont certainement appropriées pour se concentrer exclusivement sur les magasins locaux tels que les épiceries, les magasins automobiles et les magasins de jouets.
Page d'accueil géolocal d'un site de ville
Pour les sites géolocaux, nous maintenons les catégories mondiales en place et ne montrons que des articles différents pour les catégories appropriées localement. A l'avenir, nous ajouterons des articles internationaux aux choix locaux d'une catégorie, le cas échéant..
Lorsque les visiteurs consultent les pages de catégories et effectuent des recherches, nous filtrons et personnalisons également les résultats en fonction de ces choix de conception..
Variables définies
Pour ce faire, nous définissons des tableaux dans le thème par leurs identifiants:
liste des catégories pour le monde entier
liste des catégories pour les villes locales
liste des villes actives et leurs préfixes de sous-domaines
Voici quelques exemples. Tout d’abord, voici mon tableau d’ID de catégorie mondiaux (non locaux):
// Les ID de catégorie qui sont mondiaux, numériques à afficher sans modifications // par ex. Mise en route, Alternatives Prime and Smile, Streaming Media, etc. $ nonlocal_category_ids = [1,22,29,30,46,57,60,195];
Vous pouvez récupérer ceux qui jettent un œil sur l'ID de la catégorie dans la liste des catégories du tableau de bord (en survolant la souris avec le nom de la catégorie, comme indiqué ci-dessous avec les balises):
Ou bien, éditez la catégorie et récupérez l'ID de l'URL d'édition (Commencer est 29):
Voici les ID de tag pour Seattle et Portland:
// ID de balises pour les noms de ville, par exemple. Seattle, Portland $ known_cities = array (49,211);
Seattle est 49. Vous pouvez voir l'identifiant du tag en survolant la ville et en laissant la barre d'état le révéler:
Utiliser le sous-domaine pour géolocaliser
Pour obtenir le domaine ou le sous-domaine, j'ai utilisé le conseil WordPress de Trevor Scott et je l'ai placé dans le fichier functions.php de mon thème..
Voici l'éditeur de thèmes WordPress Dashboard:
Et voici le code de Trevor:
/ ** * @author Trevor Scott * @version 1.0 2010-12-07 * https: //wordpress.org/support/topic/how-do-i-get-sub-domain-name * Saisissez la partie sous-domaine de l'URL. S'il n'y a pas de sous-domaine, le domaine racine * est renvoyé. Par défaut, cette fonction * retourne * la valeur sous forme de chaîne *. L'appel de la fonction avec echo = true affiche la réponse directement sur * l'écran. * * @param bool $ echo * / fonction arrest_subdomain ($ echo = false) $ hostAddress = explode ('.', $ _SERVER ["HTTP_HOST"]); if (is_array ($ hostAddress)) if (eregi ("^ www $", $ hostAddress [0])) $ passBack = 1; else $ passBack = 0; if ($ echo == false) return ($ hostAddress [$ passBack]); else echo ($ hostAddress [$ passBack]); else return (false);
Page d'accueil globale
Lorsque les visiteurs arrivent sur la page d'accueil globale, le domaine est flottehejungle.com plutôt qu'un sous-domaine. J'ai créé une autre fonction, configure_geolocal (), qui est appelé au début du fichier modèle header.php. Voici la première partie de la fonction:
function configure_geolocal () global $ nonlocal_category_ids; global $ known_cities; global $ domain_locale; global $ logo_image_url; // ID de balises pour les noms de ville, par exemple. Seattle, Portland $ known_cities = array (49,211); // Les ID de catégorie qui sont mondiaux, numériques à afficher sans modifications // par ex. Mise en route, Alternatives Prime and Smile, Streaming Media, etc. $ nonlocal_category_ids = [1,22,29,30,46,57,60,195]; $ domain_locale = arrêté_sousdomaine (); if ($ domain_locale == 'www' ou $ domain_locale == 'flottehejungle') $ domain_locale = false;
Voici comment ça s'appelle par get_header () dans le header.php du thème:
>
Quand le domaine est global, $ domain_locale sera faux. Dans ces circonstances, je vais exclure les articles marqués localement par les villes. Et je vais le faire sur la page d'accueil et la page de catégorie. Lorsque le domaine fait référence à une ville locale, $ domain_locale représentera le préfixe, par exemple Seattle ou Portland.
Dans la page d'accueil du thème, si le visiteur est sur le site mondial (domaine racine), j'exclus les articles étiquetés avec des villes du $ st_cat_post_args tableau. Toutefois, si le visiteur se trouve sur une page de ville et que le sous-domaine est connu, nous affichons uniquement les articles locaux dans la plupart des catégories, à l'exception de ceux identifiés pour nonlocal_category_ids. Ce sont les articles les plus appropriés pour le contenu non local, tel que le streaming vidéo:
global $ known_cities; global $ nonlocal_category_ids; global $ domain_locale; if ($ domain_locale === false) // visite racine $ st_cat_post_args ['tag__not_in'] = $ Connue_cities; else // ville locale en cours de visualisation mais incluant les articles internationaux dans cette catégorie if (in_array ($ st_category-> term_id, $ nonlocal_category_ids) $ st_cat_post_args ['tag_slug__in'] = array ($ domain_locale, 'worldwide'); else // affiche uniquement les articles locaux $ st_cat_post_args ['tag_slug__in'] = array ($ domain_locale);
Voici le code dans le contexte de plus de la fonction:
// Liste des messages $ st_cat_post_num = of_get_option ('st_hp_cat_postnum'); $ st_posts_order = of_get_option ('st_hp_cat_posts_order'); global $ post; // Si show posts est 0, ne fait rien si ($ st_cat_post_num! = 0) // Listé par populaire? if ($ st_posts_order == 'meta_value_num') $ st_cat_post_args = array ('numberposts' => $ st_cat_post_num, 'orderby' => $ st_posts_order, 'meta_key' => '_st_post_views_count', term_id); else $ st_cat_post_args = array ('numberposts' => $ st_cat_post_num, 'orderby' => $ st_posts_order, 'category__in' => $ st_category-> term_id); global $ known_cities; global $ nonlocal_category_ids; global $ domain_locale; if ($ domain_locale === false) // visite racine $ st_cat_post_args ['tag__not_in'] = $ Connue_cities; else // ville locale en cours de visualisation mais incluant les articles internationaux dans cette catégorie if (in_array ($ st_category-> term_id, $ nonlocal_category_ids) $ st_cat_post_args ['tag_slug__in'] = array ($ domain_locale, 'worldwide'); else // affiche uniquement les articles locaux $ st_cat_post_args ['tag_slug__in'] = array ($ domain_locale); $ st_cat_posts = get_posts ($ st_cat_post_args); echo '
Personnalisation du comportement des pages de liste de catégories
Avec le thème KnowHow, les visiteurs peuvent également cliquer sur les en-têtes de catégorie pour les amener à une liste d'articles dans la catégorie..
S'ils figurent sur le site global, je souhaite afficher uniquement des articles globaux. J'ai choisi de marquer tous les articles mondiaux comme "mondial" pour faciliter cette tâche..
Donc, pour le site mondial, je ne montre que les articles marqués 'dans le monde' et pour les sites de villes locales, je ne montre que les articles marqués pour cette ville. Si la catégorie est un cas exceptionnel pour les deux, nous incluons des articles de la ville actuelle et du monde entier..
Voici le code dans category.php du thème:
Je ne personnalise pas la requête ici car les performances ne sont pas un problème majeur pour le moment. Je saute des résultats hors contexte et ne les affiche pas.
À l'avenir, je pourrai personnaliser davantage cette fonctionnalité pour les sites urbains en affichant les résultats mondiaux au bas de la page de catégorie dans une section distincte..
Personnalisation de la recherche
Il est également important d'effectuer ces types de personnalisation pour la recherche. Le thème KnowHow fournit un résultat de recherche AJAX ou une page générée de résultats. Nous devons fournir du code pour personnaliser chaque option.
Live AJAX Recherche
Pour la recherche en direct, il n'y a pas get_header () appel donc nous avons besoin de configurer notre emplacement dynamiquement:
Ensuite, nous intégrons la même logique que celle utilisée sur les pages de catégorie dans les résultats de recherche en direct:
// vérifie si une de ses catégories est exclue de la variable locale $ category_excluded = false; foreach ((get_the_category ()) en tant que $ category) if (in_array ($ category-> ID_cat, $ GLOBALS ['nonlocal_category_ids']))) $ category_excluded = true; Pause; if ($ GLOBALS ["domain_locale"]!! == false && has_tag ($ GLOBALS ["domain_locale"]) || ($ category_excluded && has_tag ('worldwide'))) ?>
//#FAQ-"> ">
//#FAQ-"> ">
Page de résultats de recherche dynamique
Si ce n'est pas AJAX, alors get_header () s’appelle pour nous et c’est un peu plus simple:
Comme je l'ai mentionné ci-dessus pour les catégories, je peux décider de personnaliser les résultats de la recherche afin d'afficher une deuxième section de résultats pour des articles généraux sur des sites urbains..
Approches du contenu
Pour fournir aux visiteurs locaux une explication des différences entre leur site local et le site mondial tout en les encourageant à contribuer à l'amélioration des listings de leur ville, j'ai utilisé un plugin que j'ai écrit en janvier 2015 pour Envato Tuts +: Les avantages de l'utilisation du Free Shortcoder Plugin. C'est un plugin qui vous permet essentiellement d'utiliser des macros pour développer du contenu HTML réutilisable. Pour chaque article sur la ville, nous l'utilisons pour personnaliser ce que les visiteurs locaux voient lorsqu'ils arrivent de Portland..
Une fois le plugin installé, j'ai créé un shortcode pour chaque ville, tel que [sc: pdx] qui fournit un texte de présentation simple en haut des pages d’articles locaux:
Ensuite, chaque fois que nous avons ajouté un article local, nous avons inclus le shortcode [sc: pdx] au sommet:
Voici à quoi ressemble l'article à l'arrivée des visiteurs:
Surmonter les liens absolus
Je suis un utilisateur de longue date de Digital Ocean, mais je deviens également un fan plus enthousiaste de WP Engine. Un hébergement bien géré offre des avantages dans certaines circonstances. Il s’est avéré que WP Engine offrait une solution au problème des URL absolues de WordPress, qui était meilleure que les alternatives.
WP Engine offre un filtre de post-traitement dans lequel vous pouvez utiliser des expressions régulières pour modifier le code. Après avoir envisagé d'autres approches pour modifier WordPress et utiliser ses propres API pour cela, j'ai décidé qu'il serait plus simple de simplement remplacer les liens absolus vers FleeTheJungle.com par des adresses relatives. Cela a permis aux utilisateurs visitant un sous-domaine basé sur une ville de rester dans le site géolocal:
Avant la configuration, les visites dans le sous-domaine Portland Flee the Jungle avaient des liens sortants vers le site flotte mondial flottehejungle.com, répartis sur plusieurs pages. Après la configuration, les liens sortants sont restés cohérents avec le domaine ou le sous-domaine entrant.
J'ai essentiellement utilisé le filtre de post-traitement pour éliminer les URL absolues et permettre à l'URL du navigateur et aux adresses relatives de piloter la navigation..
Inscriptions de la ville
Pour créer un répertoire des villes où Flee the Jungle est et serait disponible, j'ai créé une page répertoriant les villes où les utilisateurs du monde entier pourraient accéder. Je l'utilise aussi pour attirer des volontaires pour lancer des sites pour leurs villes..
La fonction Configure_Geolocal () terminée
Voici le code final que nous avons utilisé dans WordPress pour configure_geolocal ():
function configure_geolocal () global $ nonlocal_category_ids; global $ known_cities; global $ domain_locale; global $ logo_image_url; // ID de balises pour les noms de ville, par exemple. Seattle, Portland $ known_cities = array (49,211); // Les ID de catégorie qui sont mondiaux, numériques à afficher sans modifications // par ex. Mise en route, Alternatives Prime and Smile, Streaming Media, etc. $ nonlocal_category_ids = [1,22,29,30,46,57,60,195]; $ domain_locale = arrêté_sousdomaine (); if ($ domain_locale == 'www' ou $ domain_locale == 'flottehejungle') $ domain_locale = false; $ logo_image_url = '/wp-content/uploads/2015/10/ftj-logo-global.gif'; else if ($ domain_locale == 'pdx' ou $ domain_locale == 'portland') $ domain_locale = 'portland'; $ logo_image_url = '/wp-content/uploads/2015/10/ftj-logo-portland.gif'; else if ($ domain_locale == 'sea' ou $ domain_locale == 'seattle') $ domain_locale = 'seattle'; $ logo_image_url = '/wp-content/uploads/2015/10/ftj-logo-seattle.gif'; else // ville inconnue - redirect wp_redirect ('http://fleethejungle.com/cities'); sortie;
Exigences diverses
Personnaliser le logo
Bien sûr, je voulais implémenter la personnalisation de base du logo en fonction du sous-domaine. Le thème KnowHow ne prend pas cela en charge de manière native.
Si vous remarquez en finale configure_geolocal () code, je définis une URL de bibliothèque multimédia pour les logos de chaque ville.
Ensuite, le code dans header.php personnalise l'URL du logo du thème en fonction du domaine ici:
"href =""> ">
Hébergement de domaines et sous-domaines
Le mappage de domaine de WP Engine peut être un peu déroutant pour les non-initiés. Vous devez ajouter des domaines pour votre site et les mapper sur le système d'adressage interne de WP Engine. Si vous voulez que les sous-domaines fonctionnent correctement, vous devez configurer individuellement chaque sous-domaine à partir du tableau de bord des domaines du moteur WP..
Cela m'a pris un peu de temps pour comprendre. Ici, j'ajoute une page d'arrivée pour espace réservé pour San Francisco, accessible par sanfrancisco.fleethejungle.com ou sfbay.fleethejungle.com. WP Engine facilite la configuration de ces redirections:
Voici une vue préliminaire des domaines configurés pour Flee the Jungle aux niveaux global et local:
Malheureusement, les villes que vous n’ajoutez pas explicitement à la redirection vers une erreur 404 dans WP Engine. Il y a d'autres moyens de contourner ce problème, mais pour le moment, j'ajoute simplement des villes plus grandes à la configuration. Les utilisateurs sont généralement redirigés vers la page d'accueil globale ou vers une ville préexistante. Ils peuvent ensuite se porter volontaires pour créer leur propre ville..
Autres issues
L’optimisation des moteurs de recherche internes de Google est bien connue pour être assez secrète, mais une grande partie du trafic d’aiguillage que reçoit votre site en dépend..
Une partie de notre contenu apparaîtra dans plusieurs domaines, mais une grande partie sera distincte selon la ville dans laquelle vous naviguez. Google n'aime pas voir le même contenu sur plusieurs sites, mais il est également bon pour l'indexation séparée des sous-domaines..
Franchement, je n'ai aucune idée de la manière dont le modèle de réseau géolocal Flee the Jungle sera reçu et classé dans son grand mégaplex de superinformatique. C'est une priorité inférieure pour moi pour le moment. La base du trafic de Fuyez la jungle est le soutien de la base et le partage social.
En clôture
Veuillez comparer les différences de contenu entre Flee the Jungle et le site de la ville de Portland dans le monde:
Certes, j'aurais pu aborder le défi de la création de sites géolocaux de différentes manières. Cependant, Fuyez la jungle reste une initiative bénévole. J'avais besoin d'une solution simple et rapide tout en facilitant l'ajout de villes, en exploitant les blogueurs en tant que bénévoles. L'approche que j'ai décrite a rapidement atteint ces objectifs.
Le résultat de toute cette personnalisation est que nous avons une seule installation WordPress capable d'exécuter des centaines de variantes géo-locales de notre site, avec un contenu local et mondial filtré et organisé de manière appropriée. Plus important encore, les volontaires peuvent créer et lancer des villes n’ayant que les compétences de base d’un blogueur WordPress. C’est tellement plus simple et plus rapide que mon «ami» WordPress multisite ou qui exécute des installations séparées. L'avenir est relativement illimité.
J'espère que vous avez apprécié ce tutoriel et que vous apprécierez comment vous avez pu aborder ce défi. Si vous souhaitez lancer un guide d'achat pour votre ville, contactez-nous. Si vous êtes intéressé par la création d'un site de ce type, j'ai écrit un didacticiel détaillé, étape par étape, permettant de créer votre propre site Web de base de connaissances sur WordPress. Supposons que vous souhaitiez lancer votre propre site de fans Harry Potter. Il s'agit d'un guide simple pour commencer..
N'hésitez pas à poster vos questions et commentaires ci-dessous. Vous pouvez également me contacter sur Twitter @reifman ou m'envoyer un email directement. Vous pouvez également parcourir ma page d’instructeur Envato Tuts + pour voir les autres tutoriels que j’ai écrits..
Liens connexes
Portland fuie la jungle
Comment utiliser les cartes de quartier Zillow et la géolocalisation HTML5
Share
Crédit: Forest and Waves Carte de Portland par Edward Juan.
Accentsconagua
