Advanced Gutenberg-documentatie

I. ADVANCED GUTENBERG INSTALLEREN

1.1 Installeren

Om onze plug-in te installeren, moet je het standaard WordPress installatieprogramma gebruiken, of unzippen en alles in de map in / wp-content / plugin plaatsen.

 

install-wp-media-map


Klik vervolgens op activeer plugin, om het Advanced Gutenberg-menu te zien verschijnen in het linker menu van WordPress.

Advanced Gutenberg is toegankelijk via het Gutenberg-menu. U hebt ook de parameters in het menu "Instellingen".

1.2 Update de plug-in

Om Advanced Gutenberg bij te werken, kunt u de standaardupdater van WordPress gebruiken. U kunt ook de nieuwe versie van een .zip-bestand downloaden en installeren www.joomunited.com. In elk geval verliest u geen inhoud omdat alles in de database is opgeslagen.

 

-update-gutenberg

 

Zorg dat u altijd de nieuwste versie hebt om beveiligings- en stabiliteitsproblemen te voorkomen.

II. GEMEENSCHAPPELIJKE FUNCTIES

2.1. Blokkeerlijst

Door onze plug-in te gebruiken, kunt u verschillende profielen maken en selecteren welke blokken in de Blokkenlijst zal voor elk profiel beschikbaar zijn.

Om uw eigen profiel in te stellen, kunt u de "Profielvermelding" tab in de “Advanced Gutenberg” menu. Kies een van de profielen en u zult de profielconfiguratie zien.

 

gebruiksvriendelijke editor-profielen

 

Je kunt blokken in Gutenberg in- of uitschakelen door erop te klikken. Wanneer u klaar bent, drukt u op de knop Update List om nieuwe blokpictogrammen bij te werken.

 

blokkeerlijst

 

blocks-list-2

 

Eenmaal opgeslagen, zijn de blokken beschikbaar in uw editor.

 

block gebruikte

 

Geavanceerd knopblok

U kunt een maken Geavanceerde knop door op de knop in het gedeelte Advanced Gutenberg te klikken.

 

geavanceerde-knop

 

In het rechterpaneel kunt u enkele instellingen voor de knop aanpassen:

  • styles: er zijn 4 vooraf gedefinieerde stijlen: standaard, overzicht, vierkant en vierkant overzicht

    • Standaardstijl: selecteer uw standaardstijl

  • Knop link:

    • Link URL

    • Openen op nieuw tabblad: Aan / Uit.

 

adv-button-instellingen

 

  • Tekst kleur:

    • Lettergrootte

    • Achtergrond kleur

    • Tekst kleur

 

text-color-button-instellingen

 

  • Grens:

    • Randstijl: effen, gestippeld, nok, ...

    • Rand kleur

    • Grensbreedte

 

adv-button-grens

 

  • padding: boven, rechts, onder en links.

 

geavanceerde-button-padding

 

  • hover:

    • Kleurinstellingen: achtergrondkleur, tekstkleur en schaduwkleur.

    • Schaduw (H (horizontaal) offset, V (verticaal) offset, vervagen, spreiden), dekking en overgangssnelheid.

 

geavanceerde-button-hover

 

Geavanceerd lijstblok

U kunt een maken Geavanceerde lijst door op de knop in de Advanced Gutenberg-categorie te klikken.

 

geavanceerde lijst

 

Na het invoeren van de inhoud, kunt u de instellingen aanpassen vanaf het rechterpaneel:

  • Tekstinstellingen

    • Lettergrootte

  • Pictogram Instellingen

    • Pictogram (lijst, kleur en grootte)

    • Lijnhoogte

    • Marge

    • vulling

 

geavanceerde-list-instellingen

 

Samenvatting blok

U kunt een maken Samenvatting blokkeren door op de knop in de Advanced Gutenberg-categorie te klikken nadat u ten minste één headingtag in het bericht of de pagina heeft ingesteld. De samenvatting kan worden uitgelijnd naar links, midden of rechts. Gebruik de knop Overzicht bijwerken om dit bij te werken.

 

samenvatting-Gutenberg-inhoud

 

In het rechterdeelvenster zijn er enkele opties die u kunt aanpassen:

  • Laad geminimaliseerd: om de samenvatting standaard te tonen / verbergen

  • Samenvatting koptitel: de koptekst van de samenvatting, die wordt weergegeven wanneer de Belasting geminimaliseerd optie is ingeschakeld

  • Anker kleur: kies een kleur voor de samenvatting

 

samenvatting-settings

 

Teller (optellen) blok

 

U kunt een maken Optellen blok, eventueel met een symbool, door te klikken op de knop in de Advanced Gutenberg-categorie.

 

optellen

 

Vervolgens kunt u vanaf het rechterpaneel enkele opties voor de teller aanpassen:

  • Kleur instellingen: De kleur van de koptekst, de kleur van de optelling en de kleur van de beschrijving

  • columns: 1-3

  • Teller nummer grootte: stel de grootte van de nummers in

  • Contra-up symbool: voeg een karakter toe vóór of na de teller

  • Schakelknop: stel de positie van het symbool in (aan betekent dat het symbool na cijfers komt)

 

count-up-instellingen

 

Geavanceerd beeldblok

De Geavanceerde afbeelding blok kan worden gebruikt om een ​​afbeelding te maken. Om er een toe te voegen, klik op de Geavanceerde afbeelding in de Advanced Gutenberg-categorie en kies vervolgens een afbeelding die u wilt invoegen.

 

geavanceerde image-knop

 

Vervolgens kunt u de afbeeldingstitel en de ondertiteling ervan wijzigen. U kunt de instellingen van de afbeelding aanpassen via het rechterpaneel.

  • Actie bij klikken: open de afbeelding in een lightbox of open een aangepaste URL

  • Link-URL: Link openen in nieuw tabblad (schakelknop)

  • Open link in nieuw tabblad

  • Afbeeldingsgrootte: of de afbeelding moet worden weergegeven met de volledige breedte of met een aangepaste hoogte en breedte

  • Kleur instellingen: Titelkleur, kleur ondertitel, kleur overlay

  • Tekstuitlijning: verticale uitlijning (boven, midden, onder), horizontale uitlijning (links, midden, rechts)

 

geavanceerde image-settings

 

Getuigenisblok

U kunt een testimonial in uw inhoud invoegen door op te klikken getuigenis knop in de Advanced Gutenberg-categorie. Vervolgens kunt u de avatar, naam, functiepositie en beschrijving van de testimonial wijzigen.

 

testimonial-knop

 

Ten slotte kunt u in het rechterdeelvenster de instellingen voor de testimonial aanpassen.

  • Schuifbalkweergave: Aan uit

  • columns: Kolommenbereik in de normale weergave is 1-3 en in de schuifweergave 4-10.

  • avatar: Instellingen voor de afmetingen van de avatar, de achtergrondkleur en de rand, waaronder kleur, radius en breedte

  • Tekstkleuren:

    • Naam kleur

    • Positie kleur

    • Beschrijving Kleur

 

testimonial-settings

 

Map blokkeren

Om de. Te gebruiken Kaart blokkeren, moet u een Google API-sleutel toevoegen in de configuratie. Daarna moet je dit volgen link, Klik op API's en services inschakelen knop, zoek dan en schakel Geolocation API, Maps JavaScript API in.

Eenmaal toegevoegd, kunt u de kaart maken door op de. Te klikken Kaart knop in de Advanced Gutenberg-categorie.

 

map-block

 

Vanaf het rechterpaneel kunt u een locatie invoegen door de lengte- en breedtegraad in te voeren of door een adres in te voeren en vervolgens op de knop Locatie ophalen te drukken

Sommige aanvullende opties voor de kaart zijn beschikbaar:

  • Zoomniveau

  • Hoogte

  • Markeerpictogram

  • Markeertitel

  • Beschrijving van de markering

  • Kaartstijlen: zilver, retro, nacht, ... en u kunt uw aangepaste stijl ook toevoegen.

 

map-instellingen

 

Geavanceerd videoblok

U kunt een video naar een bericht maken door op de knop te klikken Geavanceerde video knop in het Advanced Gutenberg-gedeelte. Vervolgens kunt u de URL van YouTube of Vimeo plakken of een lokale video van uw server gebruiken. U kunt de voorbeeldafbeelding wijzigen door in de linkerbovenhoek op de knop Bewerken te klikken.

 

geavanceerde video

 

Vervolgens kunt u de instellingen voor de video aanpassen in het rechterpaneel.

  • Video in lichtbak openen: de lightbox biedt extra weergaveopties

  • Volledige breedte: als het uit is, moet je een aangepaste breedte voor de video instellen

  • Video hoogte

  • Kleur instellingen: Overlay-kleur en Play-knopkleur

  • Afspeelknop: Pictogramstijl, knopgrootte afspelen

 

geavanceerde video-instellingen

 

Geavanceerd tabelblok

U kunt een tabel maken door op de te klikken Geavanceerde tabel knop in de Advanced Gutenberg-categorie.

 

geavanceerde-table-knop

 

U kunt de tabel bewerken nadat u het aantal kolommen en rijen hebt ingesteld.

 

geavanceerde-table

 

Hierna kunt u tekst invoeren of rijen en kolommen aanpassen vanuit de editor zelf net boven het tabelblok. Meer instellingen kunnen in het rechterpaneel worden gewijzigd.

  • stijlen

    • Standaard

    • Stripes

 

style-table

 

  • Tabel instellingen

    • Maximale wijdte: Zet dit op 0 om een ​​maximale breedte van 100% te maken

    • Tabelcellen met vaste breedte

    • Tabelkop, footer

    • Border is ingestort

 

advanced-table-settings1

 

  • Celinstellingen

    • Kleur instellingen: Achtergrondkleur, Tekstkleur

    • Grens: randstijl, kleur en breedte

    • padding: vulling boven, onder, links en rechts

    • Tekstuitlijning: horizontale en verticale uitlijning

 

single-cellen-settings

 

U kunt zelfs cellen samenvoegen (met de Shift-knop) en samengevoegde cellen splitsen met de Geavanceerde tabel blok.

Geavanceerd accordeonblok

U kunt een maken Geavanceerde accordeon wanneer u meer inhoud in een kleiner gebied wilt weergeven door op te klikken gevorderd Accordeon knop in de Advanced Gutenberg-categorie. Daarna worden er standaard twee groepsaccordeonelementen weergegeven.

 

adv-accordion-block

 

Eenmaal gemaakt, kunt u de koptekst, het hoofdgedeelte of de randopties aanpassen vanuit het rechterpaneel.

  • Accordeoninstellingen:

    • Bodemafstand: Definieer ruimte tussen elke accordeon (alleen frontend-weergave)

    • Eerste samengevouwen: Maak alle accordeons standaard samengevouwen.

  • Headerinstellingen

    • Header Icon Style

    • Kleur instellingen: Achtergrondkleur, tekstkleur en pictogramkleur

 

adv-accordeon-header

 

  • Lichaamskleurinstellingen

    • Achtergrond kleur

    • Tekst kleur

  • Randinstellingen

    • Randstijl: vast, gestippeld of gestippeld

    • Kleurinstellingen

    • Randbreedte, straal

 

adv-accordeon-settings

 

Tabblok

Op dezelfde manier kunt u een maken tab blokkeren wanneer u meer inhoud in een kleiner gebied wilt weergeven. Als u er een wilt invoegen, klikt u op tab knop in de Advanced Gutenberg-categorie.

 

tab-block

 

Vervolgens kunt u de tab-, hoofd- of randopties aanpassen via het rechterpaneel.

  • Tabkleuren

    • Achtergrond kleur

    • Tekst kleur

    • Actieve tabachtergrondkleur, tekstkleur

 

tab-settings

 

  • Lichaamskleuren

    • Achtergrond kleur

    • Tekst kleur

  • Randinstellingen

    • Stijl: effen, onderbroken of gestippeld

    • Kleur

    • Randbreedte, straal

 

tab-settings1

 

Sociale koppelingen blokkeren

Jij kan deel uw sociale links heel gemakkelijk met behulp van de Sociale links blok, die kan worden gemaakt door op de knop in de Advanced Gutenberg-categorie te klikken.

 

sociaal-banden

 

U kunt het kant-en-klare pictogram gebruiken of uw eigen pictogram uploaden en enkele meer opties aanpassen via het rechterpaneel.

  • Vooraf ingestelde pictogrammen: je kunt je eigen pictogram uploaden

  • Vooraf ingestelde pictogramkleur

  • Pictogrammen-instellingen

    • Pictogramgrootte, spatie

 

sociaal-banden-settings

 

Recente berichten blokkeren

Er zijn 3 indelingen beschikbaar om uw recente berichten weer te geven: de raster-, lijst- en schuifregelaarweergaven. U kunt een van deze weergaven maken door op de knop te klikken recente berichten knop in de Advanced Gutenberg-categorie.

 

recent-posts-block

 

U kunt zien hoe de blokken worden weergegeven in de frontend in de afbeelding hierboven of in onze Advanced Gutenberg Demo.

Via het rechterpaneel kunt u de instellingen van elke lay-out aanpassen:

  • Bestellen door

order-by

 

  • Categorie

  • Aantal stuks

  • columns (alleen voor rasterweergave)

  • Toon uitgelichte afbeelding

  • Toon bericht auteur

  • Postdatum weergeven

  • Weergave Meer lezen Link

  • Lees meer tekst

  • Toon berichtfragment

  • Eerste bericht plaatsen als uittreksel: een deel van de eerste tekst in het bericht weergeven als fragment.

 

recent-posts-settings

 

Woo-producten blokkeren

Er zijn 2 lay-outs beschikbaar voor de Woo-producten blokkeren: de weergaven Normaal en Dia kunnen WooCommerce-producten weergeven op uw WordPress-blog. U kunt dit blok invoegen door op te klikken Woo-producten knop in de Advanced Gutenberg-categorie.

 

woo-block

 

U kunt zien hoe de blokken worden weergegeven in de frontend in de afbeelding hierboven of in onze Advanced Gutenberg Demo

In het rechterpaneel kunt u de instellingen van elke lay-out aanpassen:

  • Producten Instellingen

    • product status

    • Categorie

  • opmaak instellingen

    • columns

    • Aantal producten

    • Bestellen

 

woo-settings

 

Afbeeldingen Schuifblok

Als u een aantal afbeeldingen als een dia wilt weergeven, klikt u op Afbeeldingen Slider knop in de Advanced Gutenberg-categorie.

 

new-image-slider

 

Druk vervolgens op Voeg afbeeldingen toe knop om uw afbeeldingen te kiezen die in de dia worden getoond. Hierna kunt u de tekst invoeren Titel en tekst beschrijving voor elke afbeelding.

 

image-slider

 

U kunt de instellingen van de schuifregelaar in het rechterpaneel bewerken.

Beeldinstellingen

  • Actie bij klikken: Geen, afbeelding openen in lightbox en aangepaste koppeling openen

  • Volledige breedte

  • Auto hoogte

  • Laat altijd een overlay zien

Kleurinstellingen

  • Kleur zweven

  • Titel kleur

  • Tekst kleur

 

slide-settings-1

 

Tekstuitlijning

  • Verticale uitlijning

    • Top

    • Centrum

    • Bodem

  • Horizontale uitlijning

    • Links

    • Centrum

    • Rechts

slide-settings-2

 

Contactformulier blokkeren

U kunt een e-mailcontactmelding voor klanten krijgen met dit blok. U kunt dat formulier maken door op te klikken Contact Formulier knop in de Advanced Gutenberg-categorie.

 

Contact Formulier

 

U kunt de instellingen van de Contact Formulier op het rechter paneel.

  • Merk op: Het verschijnt niet als u de optie reCAPTCHA inschakelt in Instellingen.

  • E-mail afzender: U kunt instellingen wijzigen. Er wordt een e-mail verzonden naar de admin-e-mail (standaard) wanneer een contactformulier wordt verzonden.

  • Tekstlabel:

    • Naam ingevoerde plaatsaanduiding

    • Plaatshouder voor e-mailinvoer

    • Plaatshouder voor berichtinvoer

    • Tekst verzenden

    • Lege veld waarschuwingstekst

    • Succestekst indienen

 

contact-settings1

 

  • Invoer kleur: Achtergrondkleur en tekstkleur

  • Grensinstellingen: Randkleur, Randstijl en Randstraal

  • Knopinstellingen verzenden:

    • Kleur instellingen: Rand en tekst, achtergrond

    • Knoop de randradius

    • Knop positie: Links, midden en rechts

contact-settings2

 

Nieuwsbrief blok

Om e-mail van de klant te krijgen, kunt u het e-mailblok maken door op te klikken Nieuwsbrief knop in de Advanced Gutenberg-categorie.

 

nieuwsbrief

 

U kunt de instellingen van de nieuwsbrief in het rechterpaneel bewerken.

  • Merk op: Het verschijnt niet als u de optie reCAPTCHA inschakelt in Instellingen.

  • Formulierinstellingen:

    • Vormstijl: standaard / alternatief

    • Formaatbreedte (px)

  • Tekstlabel:

    • Plaatshouder voor e-mailinvoer

    • Tekst verzenden

    • Lege veld waarschuwingstekst

    • Succestekst indienen

 

newsletter-settings1

 

  • Invoer kleur: Achtergrondkleur en tekstkleur

  • Grensinstellingen: Randkleur, Randstijl en Randstraal

  • Knopinstellingen verzenden:

    • Kleur instellingen: Rand en tekst, achtergrond

    • Knoop de randradius

 

newsletter-settings2

 

Kolommenbeheerblok

Als je een blok wilt maken met andere blokken erin, zou je moeten kiezen Column Manager in de Advanced Gutenberg-categorie. Het zal de stijl voor het blok lijken bij het maken van een nieuw blok.

 

add-kolom-manager-block

 

Vervolgens kunt u elk type blok toevoegen dat u wilt in elke kolom. Hier is een kolombeheerblok met twee kolommen: de linker kolom is Geavanceerde afbeelding en de rechter kolom is de paragraaf Geavanceerde lijst.

 

kolom-manager-block

 

En in het rechterdeelvenster kunt u de instellingen van het blok Kolombeheer aanpassen.

  • Responsieve instellingen

    • Stijl voor elk apparaattype: Desktop, Tablet, Mobiel

    • Ruimte tussen kolommen

    • Vulling: boven, rechts, links en onder

    • Marge: boven, rechts, links en onder

 

column-settings-1

 

 

  • Rij-instellingen

    • Kolommen ingepakt: als uw kolommen overlopen, wordt deze gescheiden naar een nieuwe regel (bijvoorbeeld: gebruik dit met Kolommenafstand).

    • Wrapper Tag: Div, Header, Main, ...

    • Max. Breedte inhoud (px vw,%)

    • Inhoud Max. Hoogte (px, vw, vh)

 

column-settings-2

 

Inloggen / registreren formulierblok

U kunt een aanmeldingsformulier of registratieformulier voor uw website maken door te klikken Login / Registreren formulier knop in het Advanced Gutenberg-gedeelte.

 

login-form-block

 

En u kunt de weergave wijzigen van Aanmelden in Registreren op de navigatiebalk van dit blok of op het rechterpaneel.

 

login-register-vorm

 

En dan kunt u naar het rechterpaneel gaan om meer details over het formulier aan te passen.

  • Eerste vorm: Log in of Registreer

  • Omleiden na inloggen: Home, Dashboard of Aangepast

  • Vormbreedte (Px)

  • Logo weergeven

  • Logo breedte (Px)

  • Pictogram invoerveld weergeven

  • Toon register / header link

  • Kleur koptekst

  • Toon verloren wachtwoord link

 

form-state-setttings

 

  • Plaatsaanduiding voor invoer

    • Login invoer placeholder

    • Gebruikersnaam invoer placeholder

    • Plaatshouder voor e-mailinvoer

  • Tekst / Invoerkleur

    • Achtergrondkleur invoeren

    • Invoerkleur

    • Tekst kleur

  • Randinstellingen

    • Rand kleur

    • Randstijl

    • Grensbreedte

 

input-placeholder-settings

 

  • Verzend knopinstellingen

    • Rand en tekst

    • Achtergrond

    • Knoop de randradius

    • Knop positie

  • Submit Button Hover

    • Hover Colors: Achtergrond-, tekst- en schaduwkleur

    • Schaduw: Dekking, overgangssnelheid en schaduw (H (horizontaal) offset, V (verticaal) offset, vervagen, spreiden)

  • Merk op: We raden ten zeerste aan om Google reCaptcha in te schakelen om spambots te voorkomen. U kunt het inschakelen in Form Recaptcha in Adv. Gutenberg> E-mail & formulier .

 

submit-button-instellingen

 

Zoekbalkblok

U kunt een zoektekstvak aan de voorkant maken door op te klikken Zoekbalk knop in de Advanced Gutenberg-categorie.

 

search-bar-block

 

U kunt de zoekbalkinstellingen op het rechterpaneel aanpassen.

  • styles: er zijn 2 vooraf gedefinieerde stijlen: standaard en klassiek

  • Zoekbalk staat

    • Volledige breedte: aan / uit

    • Breedte

  • Instellingen zoekpictogram

    • Zoekpictogram rechts: Aan / Uit

    • Pictogram zoeken

 

search-bar-settings

 

  • Zoek invoerinstellingen

    • Zoek tijdelijke aanduiding

    • Invoerkleur: achtergrond- en tekstkleur

 

search-input-instellingen

 

  • Instellingen zoekknop

    • Indienen knop tonen: Aan / Uit

    • Zoekknop links: aan / uit

    • Achtergrond- en tekstkleur

    • Randradius

  • Hover Colors: Achtergrond-, tekst- en schaduwkleur

  • Hover Shadow: Dekking, overgangssnelheid en schaduw (H (horizontaal) offset, V (verticaal) offset, vervagen, spreiden)

 

search-button-instellingen

 

2.2. Configuratie

Om de lightbox en bijschriftfunctie voor afbeeldingen te gebruiken, moet u de Open galerijen in lightbox en Bijschrift afbeelding opties in respectievelijk Advanced Gutenberg het tabblad Configuratie in de instellingen.

 

adv-Gutenberg-settings

 

  • Galerijen openen in lightbox: Open galerijafbeeldingen als een pop-up in lightbox-stijl

  • Bijschrift afbeelding: Laad afbeeldingen (alt) attribuut als bijschrift voor lightbox-afbeeldingen

  • Autop verwijderen: Verwijder de functie WordPress-functie autop, gebruikt om te voorkomen dat ongewenste alinea's in sommige blokken worden toegevoegd

  • Google API Key: deze API-sleutel is vereist om het Mapblok te gebruiken

Blokkeert instellingen

  • Blokkeerafstand inschakelen: Pas de minimale verticale afstand tussen blokken automatisch toe - de standaardinstelling is none en de waarden moeten in pixels worden weergegeven

  • Blokkeert pictogramkleur: Stel de kleur in voor blokkenpictogrammen op admin, alleen van toepassing op Advanced Gutenberg-blokken

  • Editor breedte: Definieer de grootte van de redacteurbreedte van de Gutenberg-beheerder

  • Standaardminiatuur: Stel de standaard postminiatuur in die gebruikt moet worden in blokken met recente berichten

  • Visuele gids voor kolommen inschakelen: Grens inschakelen om materialiseren Adv. Gutenberg Kolomblok

Je kunt ook vinden Adv. Gutenberg-instellingen in de rechterbovenhoek van uw Editor, naast de instellingen icoon.

 

editor-adv-Gutenberg-settings

 

2.3 Standaard blokken Config

 

Om de blokken in Advanced Gutenberg aan te passen, kunt u naar het menu gaan Advanced Gutenberg> Configuratie> Standaard blokkeert het tabblad Config.

 

default-blocks-config

 

Voor elk blok kunt u de standaardinstellingen bewerken door op het naastgelegen veld te klikken instellingen icoon.

 

blokken bewerken

 

2.4 E-mail en formulier

Email instellingen

U kunt de afzender en ontvangerinformatie van instellen Contact Formulier blok:

 

Email instellingen

 

Vorm ReCaptcha

Eerst moet u reCaptcha registreren op uw site hieren klik vervolgens op Beheerdersconsole knop om de informatie in te voeren.

Vul daarna de reCAPTCHA-site en reCAPTCHA-geheime sleutel in. Vergeet niet om de optie reCAPTCHA in te schakelen. U kunt ook de taal en het thema voor reCAPTCHA selecteren.

 

-vorm recaptcha

 

Formulieren gegevens

Vanaf hier kunt u downloaden Contact Formulier en Nieuwsbrief formulier gegevens. U kunt een .CSV- of .JSON-bestand exporteren.

 

form-data

 

2.5 Aangepaste stijlen

De Advanced Gutenberg Met de configuratie kunt u ook aangepaste CSS-fragmenten definiëren die kunnen worden gebruikt in uw editor- en HTML-tagopties. Om aangepaste stijlen te gebruiken, navigeert u naar de Aangepaste stijlen pagina van Advanced Gutenberghet linker menu.

Om een ​​nieuwe stijl te maken, klikt u op de "Nieuwe klasse toevoegen" knop onderaan de lijst met stijlen. U kunt uw CSS-rechten bewerken in het veld Aangepaste CSS.

 

custom-stijlen-gutenberg

 

Alle wijzigingen die u aanbrengt, worden links in de pagina weergegeven. Ze worden op de tekenreeks toegepast met "Voorbeeldtekst". De tekst boven en onder de tekenreeks geeft aan hoe uw stijlen eruit zullen zien tussen de rest van de elementen. Nadat u uw aangepaste stijl hebt bewerkt, slaat u deze op met de "Stijlen opslaan" knop.


Als u een stijl op het element in de editor wilt toepassen, moet u het element selecteren en een stijl kiezen in de vervolgkeuzelijst met de naam "Aangepaste stijlen". Om terug te keren naar de standaardstijl en alle aangepaste stijlen te verwijderen, kiest u de “Paragraaf” keuze.

 

custom-css-style-blok