Gutenberg komt binnenkort naar WordPress. Is uw website klaar? Hoewel we nog steeds niet precies weten welke vorm het zal aannemen, zal dit nieuwe inhoudssysteem in de toekomst worden toegevoegd aan de kern van WordPress. Laten we eens kijken naar de mogelijke gevolgen die dit zou kunnen hebben op uw site en naar manieren waarop u probleemgebieden van tevoren kunt bepalen en oplossen..
Gutenberg is een WordPress-project dat gebruikers meer flexibiliteit wil bij het ontwerpen van hun inhoud. In wezen wil het project de huidige editor vervangen, die voornamelijk als tekstverwerker werkt, met een meer visuele en gestructureerde interface. Momenteel is Gutenberg een plug-in, en het geeft gebruikers de mogelijkheid om hun inhoud aan te passen op dezelfde manier als Visual Composer of andere slepen-en-neerzetten-editors - zij het op een vereenvoudigde en zeer intuïtieve manier.
Als je meer wilt weten over wat Gutenberg specifiek is, kijk dan eens naar mijn eerdere bericht "What Is WordPress Gutenberg?"
Gutenberg is een enorme onderneming en zal waarschijnlijk een groot aantal eindpunten binnen uw website raken. Dit zijn de drie gebieden die we gaan zoeken naar problemen:
Uw thema: Gutenberg heeft een eigen set met stijlen voor inhoud. Is jouw thema compatibel? Hoe zal het eruitzien met Gutenberg actief?
Uw plug-ins: Het is mogelijk dat Gutenberg op onverwachte manieren met uw andere plug-ins interageert. We zullen kijken naar wat die zouden kunnen zijn, en wat te doen met eventuele problemen die zich voordoen.
Uw inhoud: Gutenberg heeft invloed op hoe uw inhoud zelf wordt weergegeven. We zullen onderzoeken hoe dat kan veranderen hoe uw pagina's eruit zien, en een aantal mogelijke oplossingen bespreken als u problemen ondervindt.
Voordat we beginnen, is het een goed idee om een testruimte in te stellen waar u kunt experimenteren met Gutenberg zonder uw live site te onderbreken. Idealiter moet u uw eigen testgebied instellen of een lokale kopie van uw site maken. Raadpleeg de volgende zelfstudie voor meer informatie over het uitvoeren van een van deze taken:
Als geen van beide mogelijk is, kunt u de tests rechtstreeks op uw site uitvoeren. Dit kan echter riskant zijn, omdat we een aantal onderdelen van uw site activeren en deactiveren. Als u de test live uitvoert, zorg er dan voor dat u een back-up van uw site maakt voordat u begint.
Zodra je weet waar je gaat testen, ga je naar de plug-ins directory en vind je Gutenberg. Zodra het is geïnstalleerd en geactiveerd, lees verder.
Nu u Gutenberg heeft geïnstalleerd, laten we eens kijken naar het eerste gedeelte van uw site dat mogelijk wordt beïnvloed: het thema. Als er op dit moment al grote problemen zijn, zoals databasefouten of problemen met de WordPress-beheerder, ga dan naar de Wat te doen als er te veel problemen zijn sectie.
Omdat Gutenberg voornamelijk met de inhoud van de site samenwerkt, hoeven we slechts een beperkt aantal dingen te testen, gelukkig voor ons.
De eerste is dat Gutenberg wordt geleverd met een eigen stylesheet en een reeks stijlen. Controleer elk van de verschillende paginatypen en sjablonen die op uw site worden gebruikt om ervoor te zorgen dat ze nog steeds op de juiste manier worden weergegeven. De focus zal hier liggen op elementen binnen het hoofdinhoudsgebied van uw pagina's, met name inhoud en beeldblokken. Als u problemen ziet, is de kans groot dat de stijlen van Gutenberg voorrang hebben boven die van uw site.
Om dit te corrigeren, moet u vaststellen waar het probleem vandaan komt. Meestal is het een CSS-selector die is gericht op een HTML-element, of zou het een prioriteit van Gutenberg-stijlen kunnen zijn ten opzichte van uw eigen klassen. Probeer in elk geval waar de fout zich voordoet te identificeren. Bepaal vervolgens waarom de Gutenberg-stijlen de uwe overschrijven en corrigeer uw code zodat deze de voorkeur krijgt.
Probeer eventuele correcties aan te brengen binnen je eigen thema (of beter nog, in een kindthema of een bepaald gebied voor CSS in je thema), in plaats van Gutenberg te veranderen. Als u een van de bestanden in Gutenberg rechtstreeks wijzigt, wordt deze waarschijnlijk overschreven wanneer de plug-in wordt bijgewerkt.
Op dezelfde manier wil je je admin-gebied een keer per keer geven voor stijlproblemen. Thema-opties en andere op maat gemaakte secties gegenereerd door uw thema lijken tot nu toe de grootste boosdoeners. Zodra u stylingproblemen in deze gebieden hebt geïdentificeerd, kunt u deze meestal corrigeren door een kindthema te wijzigen of te maken en de CSS daar aan te passen.
Nadat uw thema is weggewerkt, zijn de plug-ins van uw site de volgende. Houd in het bijzonder de plug-ins in de gaten die shortcodes bevatten die u in uw inhoud gebruikt (bijvoorbeeld Gravity Forms), plug-ins die van invloed zijn op de weergave van uw inhoud (bijv. Toegankelijkheid plug-ins die de tekstgrootte beïnvloeden), en plug-ins die elementen direct in uw pagina invoegen. (zoals geavanceerde aangepaste velden).
Als u dit gebied wilt controleren, moet u eerst een lijst samenstellen van eventuele shortcodes die u mogelijk gebruikt, samen met de pagina's op deze pagina's. Met uw lijst in de hand, bezoekt u elk van deze pagina's om te zien of ze presteren zoals bedoeld. Als je stijlproblemen hebt, heb je waarschijnlijk hetzelfde probleem als hierboven en moet je je stijlen aanpassen.
Als je echter de gevreesde, gerenderde shortcode krijgt, dat wil zeggen dat je pagina de [Korte code]
in plaats van te doen wat het zou moeten doen, is er een andere oplossing. In dit geval kunt u naar het blok kijken waar de shortcode zich bevindt en bevestigen dat dit niet als tekst wordt beschouwd (zoeken naar en verwijderen van ongewenste tags rond de shortcode). Als het probleem zich blijft voordoen, moet u de shortcode verplaatsen naar een meer geschikt bloktype om alles weer actief te krijgen.
Dit probleem komt voort uit hetzelfde probleem dat we eerder hebben behandeld: stijloverschrijvingen. Identificeer de elementen die worden beïnvloed en verbeter de CSS.
Het laatste gebied dat we tegenkomen voor conflicterende kwesties betreft elementcreatie. Elke plug-in die HTML-elementen in een pagina invoegt zonder gebruik te maken van shortcodes is hier verdacht, bijvoorbeeld wanneer PHP aangepaste velden invoert vanuit de plug-in Advanced Custom Fields.
De meest voorkomende misstap bij het maken van elementen draait rond blokken die niet overeenkomen. Aangezien Gutenberg zijn eigen stijlen biedt, bestaat de kans dat als uw elementen in een onbedoeld blok worden gemaakt, ze onjuist worden weergegeven. De oplossing hiervoor is ervoor te zorgen dat uw code elementen toevoegt aan het blok waar u ze wilt hebben.
Dit is niet zo urgent als de andere problemen die we hebben besproken, maar er kunnen enkele complicaties zijn met de manier waarop uw inhoud wordt weergegeven. De meeste van deze problemen zullen zijn van kleine wijzigingen in de styling of hoe blokken zijn georganiseerd. Om dit te corrigeren, moet je met het bloksysteem spelen totdat je je pagina hebt zoals jij het wilt.
Heb je een probleem tegengekomen dat je niet kon oplossen met de suggesties in dit artikel? Geen paniek! Er is nog een tijdje voordat Gutenberg WordPress Core raakt.
Leg eerst vast wat de fout is en welke stappen tot de fout hebben geleid. Hoe meer informatie u kunt verzamelen, hoe beter. Geef al deze informatie door aan het Gutenberg-team. Met een beetje geluk kunnen ze het probleem vaststellen en in een toekomstige versie repareren.
Als je aan een staging-site werkte, dan is dat het enige wat je nu kunt doen. Ga door met het controleren van de release-opmerkingen om te zien of uw probleem is opgelost of werk eventueel aan het oplossen van het probleem.
Als je op je live site zou werken, zou het deactiveren van Gutenberg alles moeten herstellen. Zo niet, dan is het nu het moment om terug te gaan naar die back-up die u hebt gemaakt!
Gutenberg wil een enorme verandering zijn in de WordPress-omgeving, een omgeving die de inhoud ten goede wil veranderen. Voordat het de hoofdtak raakt, moet u controleren of uw site zal werken met de nieuwe wijzigingen. Als je andere problemen hebt dan hier vermeld, betere oplossingen of correcties voor alles in dit artikel, kun je hieronder een reactie achterlaten!