{"id":88903,"date":"2020-07-13T09:40:19","date_gmt":"2021-08-16T08:24:20","guid":{"rendered":"https:\/\/www.ait-themes.club\/?p=88903"},"modified":"2023-10-20T11:30:11","modified_gmt":"2023-10-20T11:30:11","slug":"cluster-block","status":"publish","type":"post","link":"https:\/\/www.ait-themes.club\/nl\/clusterblok\/","title":{"rendered":"Clusterblok"},"content":{"rendered":"<p>Met een clusterblok kun je andere blokken groeperen in \u00e9\u00e9n ouderblok en op die manier een interessante sectie blokken maken met een aangepaste achtergrond.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Block_settings_in_the_toolbar\"><\/span>Blokkeer instellingen in de werkbalk<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Met de werkbalkknoppen op het blok kun je de breedte van het blok wijzigen in Content Size, Wide Size of Fullwidth Size. Zodra de afbeelding als achtergrond is geselecteerd, kunt u met het werkbalkpictogram de afbeelding wijzigen die in een blok wordt weergegeven. Voor Cluster met aangepaste hoogte zijn opties beschikbaar om inhoud verticaal uit te lijnen. U kunt inhoud bovenaan, in het midden of onderaan het clusterblok uitlijnen.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/Toolbar-Cluster-block-Gutenberg-editor-WordPress-1024x629.png\"><img decoding=\"async\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/Toolbar-Cluster-block-Gutenberg-editor-WordPress-1024x629.png\" alt=\"\" class=\"wp-image-86508\"\/><\/a><\/figure>\n<\/div>\n\n\n<p><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/Toolbar-Cluster-block-Gutenberg-editor-WordPress.png\"><\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Block_settings_in_the_sidebar\"><\/span>Blokkeer instellingen in de zijbalk<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In de zijbalkinstellingen van het blok kun je de opties voor achtergrond, overlay, rand, schaduw en hoogte van het blok defini\u00ebren.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Background_settings\"><\/span>Achtergrondinstellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Block biedt vier achtergrondtypes:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Geen<\/li><li>Afbeelding<\/li><li>Enkele kleur<\/li><li>Verloop<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Image_background\"><\/span>Achtergrond afbeelding<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p>Met de opties voor afbeeldingsachtergrond kun je een aangepaste afbeelding uploaden naar de achtergrond en andere extra opties defini\u00ebren:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>achtergrondafbeeldingsgrootte instellen<\/li><li>herhaaloptie instellen voor een afbeelding op de achtergrond<\/li><li>defini\u00ebren of een afbeelding op de achtergrond vast is of met de pagina mee scrolt<\/li><li>positie van een afbeelding op de achtergrond instellen door het brandpunt op een afbeelding te defini\u00ebren<\/li><li>achtergrondkleur of -verloop onder een afbeelding instellen, deze opties zijn handig als je achtergrondafbeelding in transparant png-formaat is<\/li><li>stel een overlay in over de afbeelding, de overlay kan worden gedefinieerd door een enkele kleur of verloop met aangepaste transparantie om een interessante achtergrond te cre\u00ebren<\/li><\/ul>\n\n\n\n<h5 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Responsive_option_for_image_background\"><\/span>Responsieve optie voor afbeeldingsachtergrond<span class=\"ez-toc-section-end\"><\/span><\/h5>\n\n\n\n<p>Hiermee kun je verschillende achtergrondafbeeldingsinstellingen defini\u00ebren voor desktopformaat en aangepast responsief schermformaat. Zodra je een afbeelding als achtergrond uploadt, verschijnt er een ander keuzerondje. Nadat je het hebt ingeschakeld, verschijnen er nieuwe tabbladen. Ga naar het tabblad Mobiel formaat en definieer de parameters.<\/p>\n\n\n\n<p>Je kunt de schermbreedte defini\u00ebren wanneer responsieve opties worden toegepast.<\/p>\n\n\n\n<p>Een responsieve lay-out kan een andere afbeelding op de achtergrond hebben. Verander de afbeelding in een kleiner formaat en versnel de uploadtijd. Ga naar de blokwerkbalk en vervang de bestaande desktopachtergrondafbeelding door een afbeelding in de mobiele versie. Kies een positie en achtergrondkleur voor transparant png-formaat. Andere opties worden hetzelfde gebruikt als in de desktopopmaak.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/Sidebar-Inspector-Cluster-block-Gutenberg-Editor-WordPress-1024x747.png\"><img decoding=\"async\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/Sidebar-Inspector-Cluster-block-Gutenberg-Editor-WordPress-1024x747.png\" alt=\"\" class=\"wp-image-86509\"\/><\/a><\/figure>\n<\/div>\n\n\n<h5 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_change_background_image\"><\/span>Hoe achtergrondafbeelding wijzigen<span class=\"ez-toc-section-end\"><\/span><\/h5>\n\n\n\n<p>De achtergrondafbeelding kan worden gewijzigd door op het volgende pictogram te klikken:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"788\" height=\"140\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2022\/07\/cluster-background-image-change.png\" alt=\"\" class=\"wp-image-94213\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2022\/07\/cluster-background-image-change.png 788w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2022\/07\/cluster-background-image-change-300x53.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2022\/07\/cluster-background-image-change-768x136.png 768w\" sizes=\"auto, (max-width: 788px) 100vw, 788px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Single_color_background\"><\/span>Achtergrond in \u00e9\u00e9n kleur<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p>Met deze optie kun je \u00e9\u00e9n kleur defini\u00ebren voor de achtergrond van het blok.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Gradient_background\"><\/span>Verloop achtergrond<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p>Met deze optie kun je een kleurverloop defini\u00ebren op de achtergrond van het blok.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Border_settings\"><\/span>Randinstellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Met de opties kun je de rand van het blok defini\u00ebren met een aangepaste kleur, breedte en straal voor afgeronde blokranden.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Shadow_settings\"><\/span>Schaduw instellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Door de kleur te defini\u00ebren in de schaduwinstellingen kun je de schaduw onder het blok activeren. Alle benodigde parameters zijn beschikbaar om de schaduw aan te passen aan je wensen. Er zijn knoppen voor horizontale en verticale offset, vervaging en spreidingsradius in pixels.<br>Schaduw kan worden weergegeven als buiten- of inzetschaduwtype.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Height_settings\"><\/span>Hoogte-instellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Met behulp van de hoogte-instellingen kun je het blok dwingen om in de opgegeven hoogte te worden weergegeven als de inhoud binnen het blok niet groter is dan deze hoogte. Je kunt kiezen uit verschillende eenheden voor de minimale hoogte van het blok, beschikbaar zijn pixels, vh en vw.<br>Zodra de aangepaste hoogte of omslaghoogte is gedefinieerd voor het blok, kun je inhoud binnen het blok ook verticaal uitlijnen met behulp van pictogrammen die beschikbaar zijn in de werkbalk voor blokken.<\/p>\n\n\n\n<p>Voor clusterblokken die worden ingevoegd in Kolommenblokken is er een extra optie \"Kolomhoogte bedekken\" die de hoogte van het clusterblok aanpast aan de volledige hoogte van de kolom waarin het is ingevoegd. Deze optie heeft effect als het clusterblok slechts \u00e9\u00e9n blok is dat direct in de kolom wordt ingevoegd. Natuurlijk kunt u zoveel blokken als u wilt in het Clusterblok invoegen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Width_settings\"><\/span>Breedte-instellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Met de breedte-instellingen kunt u de breedte aanpassen voor inhoud in clusterblok die standaard is gedefinieerd in&nbsp;<a href=\"https:\/\/www.ait-themes.club\/nl\/plugin-instellingen-in-wordpress-customizer\/\">Algemene lay-out instellingen in WordPress Customizer<\/a>.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>De breedte kan afzonderlijk worden gewijzigd voor verschillende formaten (inhoud, breed en volledig) die zijn ingesteld in de werkbalk Clusterblok.<\/p><\/blockquote>\n\n\n\n<p>De breedte-instellingen zijn alleen beschikbaar met de actieve Citadela Pro-plugin.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Mobile_settings\"><\/span>Mobiele instellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Met mobiele instellingen kan worden gedefinieerd of Clusterblok alleen op een mobiel wordt weergegeven of verborgen. U kunt het blok verbergen met de inhoud onder-responsieve schermgrootte.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Spacing_settings\"><\/span>Afstandsinstellingen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Met de opties kunt u opvulling (tussenruimte) defini\u00ebren rond inhoud in het clusterblok. Er zijn drie soorten ruimte beschikbaar: Geen (standaard tussenruimte), 0 (nul, geen tussenruimte), kleine en grote tussenruimte.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/block_cluster_responsive_options-1.png\"><img decoding=\"async\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/block_cluster_responsive_options-1.png\" alt=\"\" class=\"wp-image-86210\"\/><\/a><\/figure>\n<\/div>\n\n\n<p><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Inhoudsopgave<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Block_settings_in_the_toolbar\" >Blokkeer instellingen in de werkbalk<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Block_settings_in_the_sidebar\" >Blokkeer instellingen in de zijbalk<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Background_settings\" >Achtergrondinstellingen<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Image_background\" >Achtergrond afbeelding<\/a><ul class='ez-toc-list-level-5' ><li class='ez-toc-heading-level-5'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Responsive_option_for_image_background\" >Responsieve optie voor afbeeldingsachtergrond<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-5'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#How_to_change_background_image\" >Hoe achtergrondafbeelding wijzigen<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Single_color_background\" >Achtergrond in \u00e9\u00e9n kleur<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Gradient_background\" >Verloop achtergrond<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Border_settings\" >Randinstellingen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Shadow_settings\" >Schaduw instellingen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Height_settings\" >Hoogte-instellingen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Width_settings\" >Breedte-instellingen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Mobile_settings\" >Mobiele instellingen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.ait-themes.club\/nl\/clusterblok\/#Spacing_settings\" >Afstandsinstellingen<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>","protected":false},"excerpt":{"rendered":"<p>Met het clusterblok kunt u andere blokken groeperen in \u00e9\u00e9n ouderblok en op die manier een interessante sectie blokken met een aangepaste achtergrond maken. Blokinstellingen in de werkbalk Met de werkbalkknoppen op het blok kun je de breedte van het blok wijzigen in Content Size, Wide Size of Fullwidth Size. Zodra de afbeelding [...]<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","_citadela_custom_class":"","footnotes":""},"categories":[50],"tags":[],"citadela-post-location":[],"class_list":["post-88903","post","type-post","status-publish","format-standard","hentry","category-citadela-pro-documentation"],"_links":{"self":[{"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/posts\/88903","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/comments?post=88903"}],"version-history":[{"count":3,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/posts\/88903\/revisions"}],"predecessor-version":[{"id":94215,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/posts\/88903\/revisions\/94215"}],"wp:attachment":[{"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/media?parent=88903"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/categories?post=88903"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/tags?post=88903"},{"taxonomy":"citadela-post-location","embeddable":true,"href":"https:\/\/www.ait-themes.club\/nl\/wp-json\/wp\/v2\/citadela-post-location?post=88903"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}