HYPERstack slimme widgets voor nóg soepeler contentbeheer

Het kan ontzettend frustrerend zijn voor een contentbeheerder van een webshop, wanneer specifieke content niet kan worden aangepast vanuit de backend vanwege harde codering. Of nog vervelender, dat er voor de gewenste aanpassingen een bepaalde HTML kennis nodig is. Zelf rommelen in de editor met <div> en class=”my-class” elementen? Nee dankjewel. De kans dat dit fout gaat is groot. Bij HYPER hebben we daar legendarisch goede oplossingen voor bedacht, zodat jij je daar geen zorgen meer over hoeft te maken!

Wat is een widget?

Een widget is een stukje interactieve software die vaak wordt gebruikt om specifieke informatie of een functionaliteit weer te geven op een webshop. Widgets kennen we voornamelijk van onze mobiel of tablet. Denk hierbij aan klokken, weerberichten, agenda’s en meer. Ook in de backend van een webshop zijn ze goed toepasbaar. Zo bieden ze contentbeheerders de mogelijkheid om snel en gemakkelijk taken uit te voeren zonder in de lastige code te werken. Widgets kunnen vaak aangepast en verplaatst worden om aan de behoeften van de contentbeheerder te voldoen.

Wat maakt een widget slim?

Een default widget van Magento bevat niet veel mogelijkheden. Daarbij wordt er vaak gebruikgemaakt van code binnen deze editors om de elementen te positioneren naar de wens van de contentbeheerder. Hiervoor heeft de beheerder kennis nodig van HTML. Wanneer ze dit niet beheersen, kan het gebruik van een default Magento widget onnodig lastig zijn.

Maar wat maken onze HYPER widgets nou zo slim? Het zit hem voornamelijk in de manier hoe onze widgets te gebruiken zijn. In onze Slimme Widget Module maken we gebruik van [wrap]‘s, [container-title] en meer. Op deze manier hebben de contentbeheerders veel meer vrijheid om de pagina er zo uit te laten zien zoals zij dat willen, zonder dat er HTML kennis voor nodig is. Daarnaast hebben onze widgets de mogelijkheid om verschillende afbeeldingen te tonen voor mobile / tablet / desktop. Zo ziet het er op elk device strak uit.

Wij zouden HYPER niet zijn als onze slimme widgets ook nog geoptimaliseerd zijn voor de beste performance! In onze Slimme Widget Module wordt een image optimizer gebruikt die de afbeeldingen naar het juiste formaat schaalt. Voor nog meer performance winst is er de mogelijkheid om lazyload uit te zetten, bijvoorbeeld wanneer de afbeelding bovenaan de pagina staat. Alles voor de beste performance!

WYSIWYG-editor: widget opties in Magento 2

Magento 2 heeft standaard de optie tot WYSIWYG-editor: What You See Is What You Get. In een WYSIWYG-editor wordt de tekst en de opmaak in realtime weergegeven terwijl jij aan de invulling werkt, waardoor het gemakkelijker wordt om de gewenste opmaak en lay-out te bereiken zonder dat technische kennis van HTML of opmaakcodes nodig is.

Wij houden ons bezig met het uitbreiden van deze widgets, het technische gedeelte. Ze kunnen verder nog gestyled worden naar eigen wens. Jij hoeft je dan alleen nog maar druk te maken over het invullen van de widget en waar je deze getoond wil hebben. 

Dynamische en statische widgets

Bij HYPER hebben we zowel dynamische als statische widgets. Deze zijn vrij instelbaar door de beheerder en ook gemakkelijk aan te passen. We maken gebruik van wraps voor gebruiksvriendelijkheid. Nee, dit zijn geen wraps die je kan eten, ook al zijn ze erg populair tijdens onze lunches. Wraps zijn een manier van het bundelen van widgets, hierbij geef je ze ook een specifieke stijl mee. Deze shortcodes kunnen ook gebruikt worden in WordPress. Onze klanten gebruiken ze voornamelijk om de pagina’s verder te stylen. Zo is het voor iedereen gemakkelijk te gebruiken en eventueel aan te passen. Zie hieronder een voorbeeld van hoe het eruit kan zien:

Zie hieronder het voorbeeld van De Notenshop:

Widgets:

Desktop versie:

Mobile:

Het is mogelijk om verschillende widgets te tonen, of verbergen, per device. In het voorbeeld hierboven is te zien dat er op desktop maar 4 widgets zichtbaar zijn, terwijl er op mobile 8 widgets tonen. Daarbij is er ook de mogelijkheid om ze net anders te stijlen per device.

En zo werkt de module!

De Slimme Widget Module bevat enkele van onze voorgebouwde widgets. Daarnaast bouwen we voor elke klant specifieke nieuwe widgets bij. Elke webshop heeft namelijk zijn eigen behoeftes. Met de shortcodes kan iedereen gemakkelijk elke pagina instellen naar wens. Onze slimme widgets maken het ook mogelijk om per device een eigen afbeelding in te stellen. Zo toont op elk device de zuiverste foto. En natuurlijk wordt hier ook altijd rekening gehouden met performance!

De slimme widget module bevat:

• Shortcodes
• HYPER widgets
• Uitbreidingen op default Magento Widgets

Waarom zou ik als webshop eigenaar dynamische widgets inzetten?

Beter de vraag zou moeten zijn, waarom zou je het niet willen! Alle belangrijke pagina’s zijn zelf instelbaar waarbij je eenvoudig alles kan wijzigen wanneer er een nieuwe actie aankomt, of iets veranderd is.

Nooit meer ‘s nachts acties instellen met de timed banner

Met onze timed banners hoef je nooit meer om 12 uur ’s nachts je bed uit om die nieuwe actie banner online te zetten. Nee, ga gewoon lekker op tijd naar bed en zie dat je banners automatisch aangepast worden op het gewenste tijdstip.

Ontwikkeld door ons, met liefde

Wij zagen dat onze klanten tegen het probleem aan liepen dat ze niet gemakkelijk zelf pagina’s konden inrichten. Daar was altijd extra hulp voor nodig, niet nodig! Met onze module heeft de contentbeheerder de volledige eigen vrijheid om gemakkelijk en snel zelf eigen landingspagina’s, CMS-pagina’s en categoriepagina’s in te richten. Met eenvoudige shortcodes die voor iedereen begrijpelijk zijn, ook zonder technische kennis. Zo hoef je niet voor elke wijziging contact te zoeken.

Wil jij meer informatie over HYPERstack? Klik dan hier.