otto

woensdag, 23 november 2022


Hoe je met Layout Paragraphs jouw Layout kunt perfectionaliseren

Zowel de layout builder als de layout Paragraphs modules pogen het maken van complexe layouts te vereenvoudigen op een veel handigere en intuïtievere manier dan ooit eerder mogelijk was met Drupal.
Paragraphs layout
Wat zijn Drupal Layout Paragraphs?

Volgens de projectpagina op drupal.org, biedt Layout Paragraphs een intuïtieve drag-and-drop ervaring voor het bouwen van flexibele lay-outs in combinatie met de module Paragraphs. Paragraphs is  de voorkeursmethode voor het omgaan met complexe inhoudsstructuren in Drupal. Deze module wordt door menig Drupal developer erkend als een best practise als het gaat om het beheren van content. Bij VDMi zijn wij dan ook erg trots dat het onze developers waren die deze module ooit bedacht en ontwikkeld hebben. De Layout Paragraphs module, die later werd bedacht en ontwikkeld door andere developers, dient dan ook als een uitbreiding op de Paragraphs module. Maar wat voegt deze dan toe?   

Kort gezegd is de Layout Paragraphs module bedoeld om het overzicht te behouden tussen de verschillende complexe layout structuren die  in de Paragraphs ontstaan. De module  is dan ook  bedoeld om de inhoudelijke en structurele behoeften van sitebouwers en content  editors te scheiden. 

Bij het gebruik van Paragraphs in het verleden waren extra paragrafen, of meerdere versies van dezelfde paragrafen, nodig om verschillende layouts en stijlen te bieden aan content creators. Zo was het toendertijd voor content editors erg lastig om zich een goed beeld te kunnen vormen van van hoe hun pagina er uiteindelijk aan de front-end zijde uit de verf zou  komen. De Layout Paragraphs module is toen bedacht, om de content creator een idee te geven welke inhoudelijke Paragraphs nodig zijn, en een beter idee te geven van hoe de pagina eruit zal zien, tijdens het bewerken al.

Het concept van Layout Paragraphs is niet echt een nieuw idee. Het bouwt voort op een lange geschiedenis van opmaaksystemen zoals panels, display suite, blokken en panelizer, maar maakt gebruik van meer centrale API's zoals Entity API en Layout Builder API.

Waarom Layout Paragraphs?

We weten nu dat Layout Paragraphs op het gebied van gebruiksvriendelijkheid een waardevolle toevoeging is aan de Paragraphs module. Maar waarom zouden we uberhaupt gebruik willen maken van Paragraphs? Er zijn immers tal van andere gebruiksvriendelijke modules om de lay-out van jouw website te optimaliseren. Neem bijvoorbeeld de Layout Builder.

De Layout Builder was tot voor kort de meest gebruiksvriendelijke module op het gebied van front-end design. De module stelt je namelijk in staat om gemakkelijk (drag & drop) velden van een bepaald type content in de layout rangschikken. Daarnaast kun je ook andere dingen toevoegen, zoals blokken, views of free form, handgemaakte (html) content. Maar de nadruk ligt op het verdelen van deze atomaire velden van een node over de layout.

Met de Layout Builder module kun je dus op zich al heel wat. Wat maakt de Layout Paragraphs module dan zo waardevol? Aan de hand van deze module kunnen tekortkomingen in eerdere drupal mechanismen die traditioneel werden gebruikt om complexere lay-outs te generen, wel worden ondervangen. Denk hierbij aan de volgende lay-out structuren: blokken, display suite, panelen of zelfs preprocessing hooks samen met aangepaste template bestanden - afhankelijk van de specifieke taak, deed een van hen of een combinatie van verschillende mechanismen het werk.

Het probleem hiervan, is dat jij waarschijnlijk geen inhouse Drupal developer hebt. Je besteedt waarschijnlijk wel werk uit aan Drupal specialisten. Hoewel zij je goed kunnen helpen, snappen wij dat het vervelend kan zijn om bij het minste of geringste contact op te nemen met jouw Drupal developers. Dat is dan ook precies het probleem dat optreedt wanneer men gebruik maakt van Layout Builder. Iemand zonder uitgebreide kennis van Drupal is dan namelijk niet in staat om bijvoorbeeld een ad hoc landingspagina te maken met vrije inhoud en een ietwat fancy lay-out, die afwijkt van de gebruikelijke presentatie van de bovenstaande bestaande inhoudstypen. Dit leidde duidelijk tot frustratie bij ondernemers, aangezien zij niet zo maar wanneer zij wilden hun lay-out kunnen aanpassen. Zij vroegen ons als Drupal specialisten dan ook telkens: "Waarom kunnen we niet snel zelf aanpassingen doen, zonder er ontwikkelaars bij te betrekken?"

Het antwoord op die vraag wordt gevonden in de Layout Paragraphs module.  Deze zorgt namelijk voor een geweldige gebruikerservaring in termen van eenvoud, gebruiksgemak en flexibiliteit wat betreft het layout gedeelte en de mooie en intuïtieve drag & drop interface. Anderzijds stelt het theme makers en sitebouwers in staat om in hun ontwerpen consistentie af te dwingen, aangezien de bouwstenen (d.w.z. groeperingen van velden) die in de beschikbare lay-outs kunnen worden verplaatst, perfect kunnen worden gedefinieerd en gevalideerd door middel van Paragraphs.

Content componenten

Wij noemen deze groeperingen van velden ‘ Content componenten’. Dit zijn namelijk vooraf gebouwde, belangrijke gedeelten content die een specifiek doel dienen. De Layout Paragraphs module is zeer geschikt om een dergelijk systeem  te realiseren. Het is cruciaal voor onze projecten, omdat we de gebruikers meestal niet willen vermoeien met vragen als:

"Moet ik hier een header gebruiken?"
"Moet de introtekst een groter lettertype gebruiken en als eerste paragraaf worden weergegeven?".
"Zou ik hier een call-to-action knop gebruiken of liever een tekstlink?"

We kunnen nog wel even doorgaan, maar de boodschap is vast duidelijk. In plaats van gebruikers in elke context volledige vrijheid te laten, terwijl zij niet in staat zijn de content zelf netjes aan te passen en ze ondertussen te moeten overbelasten met tal van vragen, is het veel handiger om van tevoren overeengekomen content componenten te realiseren. Zo heb jij binnen deze componenten namelijk volledige vrijheid, zonder hier enige kennis van Drupal voor nodig te hebben.

Conclusie

Zowel de layout builder als de layout Paragraphs modules pogen het maken van complexe layouts te vereenvoudigen op een veel handigere en intuïtievere manier dan ooit eerder mogelijk was met Drupal. En beide bereiken dit doel, waarbij de keuze voor een van beide echter moet worden bepaald door het type inhoud dat moet worden bewerkt.

Als jij een relatief simpele een productpagina met veel velden met productgegevens zoals hoogte, breedte, gewicht, kleur enz., wil uitwerken, zou Layout Builder zeker voldoen, omdat deze ontwikkeld is om met al deze velden van één inhoudstype te werken. Ben jij echter van plan een ietwat complexere website te realiseren, hetgeen vaak de reden is om uberhaupt voor Drupal te kiezen,  dan is het aan te raden de Layout Paragraphs module te gebruiken. In gevallen waarin de inhoud namelijk niet bestaat uit strikt gedefinieerde velden en niet kan worden voorzien, kun je het beste kiezen voor Layout Paragraphs. Hoe dan ook - beiden bieden een gebruikerservaring die veel verder gaat dan voorheen het geval was. Dit is dan ook tekenend voor de mate van ontwikkeling die nog steeds gaande is in de Drupal space.