Hoe de achtergrond van afbeeldingen instellen in WordPress

Er zijn meer manieren om achtergrondafbeeldingen toe te voegen in WordPress. Van basis tot zeer geavanceerd met het veranderen van themacode. We zijn echter verheugd om een gebruiksvriendelijke tool te introduceren die ideaal is voor websitebeheerders zonder kennis van codering en ontwerp. Citadela Pro invoegtoepassing wordt geleverd met veel functies en instellingen voor het aanpassen van de website.

Probeer de krachtige blokken, instellingen en functies in de Citadela Pro plugin gratis. We bieden een 7-dagen proefversie met alle premium functies. Je kunt de perfecte tool ontdekken waarmee je achtergrondafbeeldingen kunt toevoegen aan WordPress pagina's, posts en aangepaste posttypes.

De Cluster is een Gutenberg blok in WordPress waarmee je een achtergrondafbeelding kunt toevoegen. Met het multifunctionele element kun je de achtergrond van WordPress veranderen ten opzichte van de standaard. Je kunt niet alleen een achtergrondafbeelding toevoegen, maar je kunt het ook combineren met andere blokken. Je krijgt veel variaties en veelzijdigheid.

In combinatie met de Pagina Titelblokkrijg je met gemak een fantastisch uitziende website. Je kunt meer Gutenberg blokken toevoegen en de achtergrondafbeelding in WordPress aanpassen. Je kunt ook een set blokken opslaan als herbruikbare blokken en een thema overal op je website toevoegen. Zo kun je de achtergrond van je WordPress website in één keer veranderen.

Hoe voeg je een achtergrondafbeelding toe in WordPress met het Gutenberg blok?

WordPress Achtergrondafbeelding via Clusterblok

We introduceren je handige blok dat we hebben gemaakt voor WordPress Gutenberg blok voor achtergrondafbeelding - Cluster blok. Het is onderdeel van onze eigen blokken groep. Citadela Pro plugin heeft veel functies om je te helpen prachtige website te maken. Alle AitThemes aangepaste blokken zijn beschikbaar in Citadela Pro invoegtoepassing.

Lees Cluster Block documentatie voor detailinstellingen.

Met clusterblok kunt u meerdere blokken groeperen tot één blok. Je kunt effectief met de hele geclusterde groep werken alsof het één blok was. Clusterbreedte kan worden ingesteld op volledige paginabreedte, wat betekent dat je een extra grote ruimte hebt om verschillende blokken toe te voegen.

Cluster rekt niet uit tot volledige breedte als:

• Je hebt een actieve zijbalk
• Als u kolommen gebruikt die de ruimte voor Cluster

Omdat sommige van de WordPress kernblokken alleen kunnen worden uitgelijnd op inhoudsbreedte, biedt Clusterblok een grotere variabiliteit bij het bouwen van je website. Een geweldige functie is ook dat je in WordPress een achtergrondafbeelding kunt instellen, de kleur ervan kunt veranderen of een achtergrondafbeelding overlay kunt instellen. De achtergrond kan dus worden aangepast aan het ontwerp van de website.

In dit artikel laten we het je zien:

• Zo voeg je een clusterblok toe aan de WordPress editor
• Groeperen binnen cluster
• Basisinstellingen in werkbalk
• Kleur koptekst en scheidingsteken
• Hoe voeg ik een achtergrondafbeelding toe onder gegroepeerde blokken
• Wat is Achtergrond overlay
• Wat is het verschil tussen groepsblok en Ait Clusterblok?

Hoe Clusterblok toevoegen

Clusterblok is een premium blok en is alleen beschikbaar als u het volgende installeert en activeert Citadela Blokken plugin. Na het installeren van de plugin wordt Cluster block automatisch toegevoegd aan de WordPress block editor en kun je er meteen mee aan de slag.

Clusterblok kan worden toegevoegd aan zowel berichten als pagina's. Klik gewoon op het "+"-teken in de bovenste balk of ergens op het bureaublad van de editor. Zoek daarna gewoon naar het clusterblok.

De tweede optie om een clusterblok toe te voegen is door "/" en daarna de bloknaam in te typen. Clusterblok is dan klaar voor gebruik.

Blokken groeperen met Cluster

De belangrijkste functie van een clusterblok is het groeperen van meerdere blokken in één blok. Laten we eens kijken hoe het werkt. Als je een clusterblok invoegt op je pagina, zie je meteen een plaatshouder "Voeg hier meer blokken in". Als je erop klikt, krijg je een lijst met alle beschikbare blokken. Je kunt ook naar het gewenste blok zoeken met de zoekbalk bovenaan de lijst.

Alle geneste blokken hebben alle standaardopties en -instellingen beschikbaar. Als je bijvoorbeeld een blok met afbeeldingen invoegt, kun je een afbeelding uploaden of selecteren in de mediabibliotheek.

Met Clusterblok kun je bijvoorbeeld een opvallende sectie op je website maken om je recente werk te presenteren. Voeg afbeeldingen uit je portfolio toe en zet er een achtergrondafbeelding onder. Je hebt zojuist een mooie link naar je portfolio gemaakt.

Clusterblok kan ook worden gebruikt om een aantrekkelijke productpresentatie te maken. Je kunt een productafbeelding instellen als achtergrond van de sectie en de kleur kiezen. Serviceblok kan ook genest worden binnen Clusterblok.

Meerdere blokken in één

Als je meerdere geneste blokken aan een cluster wilt toevoegen, kun je het Kolom-blok gebruiken. Met het Kolom-blok kunt u meerdere blokken naast elkaar toevoegen. Elke kolom kan een ander inhoudstype hebben, zoals een afbeelding, alinea, lijst of knop.

Een typisch voorbeeld van meerdere kolommen in combinatie met Clusterblok is een website met één pagina.

Basisinstellingen in werkbalk: Opties voor inhoudsuitlijning

Standaard is de breedte van het clusterblok ingesteld op de inhoudsgrootte. U kunt dit gedrag wijzigen in de werkbalk. De volgende opties zijn beschikbaar:

• Grootte inhoud - standaardoptie, clusterblok heeft dezelfde breedte als inhoud.
• Breed formaat - inhoud binnen Cluster is breder dan de breedte van de inhoud.
• Formaat volledige breedte - in dit geval is de Clusterbreedte van links naar rechts van het browservenster.

Het is belangrijk om te weten dat deze instelling alleen effect heeft op Clusterinhoud als het huidige actieve thema dit ondersteunt. Alle geneste blokken kunnen worden geconfigureerd op basis van de beschikbaarheid van hun opties.

Instellingen voor de kleur van koppen en scheidingstekens

Kleur van kop veranderen

Sinds WP 5.3 kun je de kleur van je header veranderen via het Heading-blok. Dit is een erg handige functie - vooral als je een donkere lay-out en kleurenschema hebt, is het beter om de standaard tekstkleur (die zwart is) te veranderen in een lichtere kleur.

Tot de nieuwe versie was het niet mogelijk om de kleur van de koptekst te wijzigen, wat problemen veroorzaakte met de zichtbaarheid op een donkere achtergrond. Daarom gebeurde het vaak dat de koptekst opging in de achtergrondafbeelding van WordPress of de foto die je had toegevoegd. Nu kun je de juiste kleur voor de koptekst kiezen om je site te laten schitteren.

Nieuwe kleur voor Scheidingsteken gebruikt op je website

Als je in je WP een achtergrondafbeelding of een ander type inhoud toevoegt, moet je deze soms scheiden van de rest van de website. Hiervoor kun je een speciaal blok genaamd Separator gebruiken. Door Separator in te voegen kun je:

• Specifieke blokken scheiden
• Hele tekst opsplitsen in kleinere delen
• Markeer belangrijke onderdelen
• Zorg voor betere leesbaarheid van de inhoud
• Vereenvoudig de navigatie op je website

Bovendien kun je nu de kleur van de scheidingslijn wijzigen met het bijgewerkte WordPress. Gekleurde Scheidingsteken zijn perfect om het kleurenschema van je website compleet te maken.

Hoe voeg ik een achtergrondafbeelding toe onder gegroepeerde blokken

De ware kracht van het clusterblok is dat je een achtergrondafbeelding kunt toevoegen en de achtergrondkleur onder de gegroepeerde blokken kunt instellen. Alles kan eenvoudig worden geconfigureerd in de WordPress Inspector. Laten we eens kijken hoe we dit kunnen doen.

1. Klik op Achtergrondafbeelding en activeer de functie "Achtergrondafbeelding weergeven".
2. Klik op "Afbeelding selecteren". De mediabibliotheek wordt geopend. Je kunt een bestaande afbeelding selecteren of een nieuwe afbeelding uploaden naar je bibliotheek.
3. Achtergrondafbeelding kan ook worden ingesteld op vast. Dit betekent dat als je de pagina scrollt, de achtergrond niet meebeweegt met de inhoud en dat de positie vast blijft.
4. Je kunt ook kiezen welk deel van de achtergrondafbeelding moet worden weergegeven met "Focal Point Picker". Het is ook mogelijk om een deel van de afbeelding te kiezen met behulp van een percentage.

Achtergrond overlay

Een van de geavanceerde opties in Cluster is Achtergrondafbeelding overlay. U kunt een van de standaardkleuren kiezen of een aangepaste kleur met de kleurenkiezer. Het is ook mogelijk om de opaciteit van de kleur in te stellen. Deze blokinstellingen van Cluster helpen u om een echt aantrekkelijke websitepresentatie te maken.

Nieuw groepsblok beschikbaar in core

Wat is het verschil tussen Groepsblok en AitThemes Clusterblok?

Ons op maat gemaakte Clusterblok is eerder uitgebracht dan het Groepsblok en biedt een complexere oplossing. Je kunt het blok Groep gebruiken om meerdere blokken te groeperen, maar het heeft nog steeds beperkte functies. Je kunt bijvoorbeeld geen overlappende kleur instellen in het blok - je kunt alleen een basisachtergrondkleur kiezen die rond de afbeelding wordt geplaatst, niet eroverheen.

Achtergrondafbeeldingen bewerken is een fluitje van een cent in ons Clusterblok.

Je kunt een achtergrondafbeelding uploaden naar je WordPress, er een achtergrondkleur voor instellen en ook een overlay van de achtergrondkleur (en de opaciteit van de overlay ook aanpassen!). Het duurt maar een paar minuten.