De Spectra of Ultimate Addons for Gutenberg blocks WordPress plugin vind ik één van de beste WordPress plugin’s die, na de introductie van Gutenberg in 2018, op de markt verschenen is.
IN DEZE HANDLEIDING:
- 1 Update zomer 2022: Plugin heet nu Spectra
- 2 Beste Gutenberg WordPress plugin voor blokken maken
- 3 Nieuwe blokken in je WordPress Gutenberg Editor
- 4 Overzicht maken berichten met berichtraster blok
- 5 Websites importeren met Spectra Gutenberg plugin
- 6 WordPress Basiscursus training beginners halfgevorderden
- 7 Cursus WordPress op maat beginners & gevorderden
- 8 Cursus WordPress in Amsterdam
- 9 Alternatieven voor extra blokken met WordPress plugin
Update zomer 2022: Plugin heet nu Spectra
Update zomer 2022: Deze WordPress Plugin is van naam veranderd en heet nu Spectra.
wordpress.org/plugins/ultimate-addons-for-gutenberg
Update 2024: Spectra Pro
Er is nu ook een Pro versie met meer mogelijkheden waaronder een slider. Meer info:
Beste Gutenberg WordPress plugin voor blokken maken
Door deze 3 factoren in gedachten te houden in combinatie met mijn WordPress-ervaring, vind ik dit de beste Gutenberg WordPress plug-in die ik gebruik en aanbeveel. Deze plug-in wordt gemaakt door de bekende WordPress-ontwikkelaars van Brainstorm Force, de mensen achter populaire producten zoals Astra-thema, Schema Pro, Convert Pro, Ultimate Add-on voor Beaver Builder, Ultimate Add-on voor Elementor en de lijst gaat maar door.
Ze hebben een zeer goede staat van dienst in het ontwikkelen van goede plug-ins met veelzijdigheid, schaalbaarheid en prestaties in gedachten. Hun ervaring hen heeft geholpen om Spectra – Addons for Gutenberg blocks WordPress plugin te ontwikkelen, rekening houdend met de prestaties en met name de vermindering van serververzoeken zodat je site sneller werkt. Ik raad je aan om deze plug-in te gebruiken met Gutenberg-compatibele thema’s (zoals Astra) om opties zoals volledige uitlijning en meer te ontgrendelen.
Nieuwe blokken in je WordPress Gutenberg Editor
Nadat je de plug-in hebt geïnstalleerd en geactiveerd, zie je het gedeelte ‘UAGB-blokken’ in uw WordPress Block Editor, dus onder het Plus-teken bovenin.
Je krijgt een mooie hoeveelheid nieuwe blokken:
- Section
- Multi Buttons
- Advanced Heading
- Post Masonry
- Info Box
- Post Timeline
- Call to Action
- Advanced columns
- Google Maps
- Team
- Content Timeline
- Social Share
- Post Grid
- Post Carousal
- Testimonial
- Icon List
Je kan overigens bij de settings van de plugin selectief de modules van deze plug-in activeren of deactiveren. Gebruik je geenSocial Share if Google Maps-blok? Deactiveer de module dan gewoon. Zie video hieronder.
Gutenberg Blokken die tijdens de WordPress cursus worden behandeld
Tijdens een WordPress cursus of traininge behandelen we meestal de onderstaande blokken, afhankelijk van welke training:
Section Gutenberg blok
Hiermee kun je beeldvullende rijen maken
Post Grid Gutenberg blok
Hiermee kun je overzichten van berichten maken
Advanced columns Gutenberg blok
Hiermee kun je kolommen maken.
Handleiding kolommen maken in WordPress met Gutenberg blokken
Overzicht maken berichten met berichtraster blok
Je kan met Spectra mooie overzichten maken berichten met berichtraster blok. Zie dit voorbeeld in Gutenberg:
Het komt er dan zo uit te zien aan de voorkant van je site:
Je kan heel veel instellen. Ook in de gratis versie. Heel soms kan iets niet. Afgeronde hoekjes voor afbeeldingen kan niet zoals in dit voorbeeld. Je kan dit oplossen door CSS toe te voegen aan je thema in je thema customizer. Wel voor gevorderden.
.uagb-post-grid .uagb-post__image img {
object-fit: cover;
aspect-ratio: 1/1;
border-radius: 50%;
padding:1em;
}
Kopjes aanpassen berichtraster
De kopjes aanpassen van berichtraster bijvoorbeeld de kleur:
uagb-post__title h2:not(.wp-block-group h2,.uagb-post__title) {
color:#dd0000;
}
Handleidingen CSS aanpassen
Beste bronnen webdesign webdesigners website html
Bronnen voor webdesign Er zijn veel bronnen voor webdesign beschikbaar voor elk webproject. Hoewel het…
Beste websites CSS html zelf te leren online beginners
CSS aanpassen toevoegen WordPress voor beginners
CSS aanpassen in WordPress CSS aanpassen in WordPress kan op het eerste gezicht ingewikkeld lijken….
Aangepaste CSS toevoegen zonder child theme plugin
CSS selectors overzicht om de HTML-elementen te stijlen
Wat is een selector in CSS en html? Een CSS selector is het eerste deel…
CSS Element inspecteren WordPress aanpassen browser
Websites importeren met Spectra Gutenberg plugin
De ontwikkelaars van Brainstorm Force hebben ook Gutenberg-sites met één klik geïmporteerd in hun plug-in Astra Starter Sites. Dit zijn kant-en-klare webpagina’s en hele websites die puur met de Gutenberg-plug-in zijn gemaakt en die met een klik kunnen worden geïmporteerd in je WordPress website. Om deze plug-in te laten werken, moet uiteraard ook het Astra WordPress Thema en ook deze Spectra plugin op uw site zijn geïnstalleerd.
wordpress.org/plugins/astra-sites
Handleiding Gutenberg Blokken voor WordPress
Bekijk de onderstaande handleiding waarbij de bovengenoemde blokken voor Gutenberg zijn uitgelicht.
Bekijk plugin op WordPress.org:
Cursus of training kolommen maken in WordPress
Tijdens een basiscursus leer je werken met de bovenstaande blokken van de Ultimate Addons for Gutenberg blocks plugin.
WordPress Basiscursus training beginners halfgevorderden
In deze WordPress basiscursus leer je zelf een WordPress website bouwen, beheren en onderhouden. Training voor beginners en halfgevorderden. Online of bij ons.
Cursus WordPress op maat beginners & gevorderden
POPULAIR Wordpress cursus of training op maat voor gevorderden of voor beginners. Haal zo veel mogelijk uit je WordPress website. Leer je website maken op elk niveau.
