Stap 02: groepeer het blok<\/h3>\n\n\n\n Door het blok te groeperen, kunt u meerdere blokken \u00e9\u00e9n voor \u00e9\u00e9n toevoegen binnen de opgegeven groepssectie. Het grootste voordeel is dat je er uitgebreide aanpassingen tussen kunt doen, wat niet mogelijk is met normale niet-gegroepeerde blokken.<\/p>\n\n\n\n
Klik op het pictogram met de drie punten<\/strong> op de werkbalk. Zoeken en Druk op de optie Groep<\/strong> op de lijst.<\/p>\n\n\n\nNadat het blok is gegroepeerd, ziet u het Gutenberg plus (+) pictogram in de groepssectie. U kunt nu nieuwe blokken toevoegen.<\/p>\n\n\n\nStap 03: Voeg een korte beschrijving van het team toe<\/h3>\n\n\n\n Het toevoegen van een korte beschrijving van de teamsectie biedt SEO-voordelen en helpt gebruikers de context van de sectie te begrijpen.<\/p>\n\n\n\n
Alinea toevoegen<\/strong> binnen het groepsgedeelte.<\/p>\n\n\n\nSchrijf gewoon wat je wilt beschrijven over de sectie. Je kunt de breedte van de inhoud in het blok verkleinen door de opvuloptie te gebruiken.<\/p>\n\n\n\n
Je kunt elk blok meteen aanpassen nadat je het hebt toegevoegd. Maar dat doen we pas als de volledige lay-out klaar is.<\/p>\n\n\n\nStap 04: Teamleden toevoegen<\/h3>\n\n\n\n Nu moet je in deze sectie een aparte lay-out maken om je teamleden weer te geven. Je kunt ze op verschillende manieren weergeven. Tot nu toe hebben we gezien dat de meeste websites hun teamsecties weergeven in rij-, kolom- en boxformaten.<\/p>\n\n\n\n
Dus we zullen onze teamsectie ook presenteren in het kolom-vak formaat. Selecteer de hele groep<\/strong> door op het pictogram Groep klikken<\/strong> op de werkbalk. Klik op het pluspictogram (+)<\/strong>. <\/p>\n\n\n\nVinden en Kolom toevoegen<\/strong>.<\/p>\n\n\n\nSelecteer het aantal kolommen op basis van het aantal teamleden dat je wilt tonen. Omdat we drie leden zullen tonen, selecteren we drie kolommen.<\/p>\n\n\n\nHoewel we het over drie kolommen hadden, ben je misschien verbaasd dat er maar \u00e9\u00e9n kolom is nadat het blok is toegevoegd. Maak je geen zorgen! De kolommen verschijnen als je afwisselend met je muis over de witte ruimte aan de rechterkant gaat en erop klikt.<\/p>\n\n\n\n
Bekijk de video hieronder.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nJe kunt nieuwe blokken toevoegen binnen het bovenliggende blok. Ga naar de eerste kolom. Het blok Afbeelding toevoegen<\/strong> erin. Daarna kun je een afbeelding uploaden vanuit de mediabibliotheek of je lokale schijf.<\/p>\n\n\n\nJe kunt zien dat we al een afbeelding hebben toegevoegd. We hebben centraal uitgelijnd<\/strong>. Je kunt het formaat van de afbeelding aanpassen met de randcirkels.<\/p>\n\n\n\nEenmaal klaar met de afbeelding, druk op de Enter-toets op je toetsenbord<\/strong> om de nieuwe optie voor bloktoevoeging te krijgen. Standaard verschijnt het alinea-blok.<\/p>\n\n\n\nVoeg de naam van het teamlid, zijn aanduiding en een korte intro over hem toe. We hebben ze toegevoegd met behulp van het alinea blok.<\/p>\n\n\n\nWe zullen nu de persoonlijke sociale profielen koppelen<\/strong> van de teamleden in dezelfde kolom door sociale blokken<\/strong>. <\/p>\n\n\n\nWe zullen hier vier populaire profielen koppelen. Maak dus nog vier kolommen binnen de bovenliggende kolom met behulp van kolomblokken.<\/p>\n\n\n\n
Het blok Sociale pictogrammen toevoegen<\/strong> in de kolom parent onder de naam en intro van het teamlid.<\/p>\n\n\n\nHet Social Icon-blok integreert alle populaire sociale mediaplatforms. Zodra het Social Icon-blok is toegevoegd, heb je de flexibiliteit om de blokken te kiezen die je leuk vindt door op de knop plus (+) pictogram<\/strong>. De video hieronder legt het proces uit.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nKlik op de sociale pictogrammen <\/strong>\u00e9\u00e9n voor \u00e9\u00e9n. Je krijgt een vak waarin je de respectieve koppelingen naar sociale profielen kunt kopi\u00ebren en plakken. Vul het sociale gedeelte op deze manier aan.<\/p>\n\n\n\nSelecteer de hele bovenliggende kolom<\/strong>. Kom naar de Tabblad Stijlen<\/strong>. Verwijder onnodige spaties tussen de blokken die u horizontaal hebt toegevoegd met de optie Optie voor blokafstand<\/strong>.<\/p>\n\n\n\nEen achtergrondkleur toevoegen<\/strong> naar de kolom van het teamlid. Voor een beter uiterlijk, horizontale opvulling toevoegen<\/strong> om wat extra ruimte rond de kolom toe te voegen. <\/p>\n\n\n\nVul op dezelfde manier de andere twee kolommen aan de rechterkant aan door nieuwe teamleden toe te voegen.<\/p>\n\n\n\nJe kunt zien dat we alle drie de kolommen hebben gevuld met drie teamleden en hun informatie.<\/p>\n\n\n\nStap 05: De volledige sectie van het teamlid stylen<\/h3>\n\n\n\n Selecteer de volledige teamledensectie<\/strong> door te klikken op de Groepspictogram<\/strong> op de werkbalk. <\/p>\n\n\n\nEen achtergrondkleur toevoegen<\/strong> naar het teamonderdeel dat je geschikt lijkt. Daarna kun je je tekstkleur individueel wijzigen<\/strong>en selecteert u \u00e9\u00e9n voor \u00e9\u00e9n de betreffende alineablokken.<\/p>\n\n\n\nVolgende, wat opvulling toevoegen<\/strong> zowel verticaal als horizontaal om wat witruimte rond de hele sectie te cre\u00ebren.<\/p>\n\n\n\nVoeg tot slot een radius toe aan de teamsectie zodat de randhoek een halfronde vorm heeft. Dit geeft een ander mooi uiterlijk aan de sectie.<\/p>\n\n\n\nStap 06: Bekijk een voorbeeld van de teamsectie op de voorkant<\/h3>\n\n\n\n Ga ten slotte naar de voorkant van de pagina en kijk hoe de teamsectie eruitziet. <\/p>\n\n\n\nConclusie<\/h2>\n\n\n\n Je kunt de teamledensectie ook op verschillende manieren maken en aanpassen. We hebben hier een basisproces gepresenteerd waaruit je inspiratie kunt halen om meer prachtige ontwerpen te maken en te realiseren.<\/p>\n\n\n\n
Als je ooit ergens in de tutorial tegen een probleem aanloopt, aarzel dan niet om het ons te laten weten via het commentaarvak. Tot slot, voordat je onze site verlaat, neem een paar minuten de tijd om deze post te bekijken op hoe maak je een inhoudsvak in WordPress<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"A team member section is a dedicated space in a website where you can showcase talented people who make up your team and organization. It’s a place where you can highlight their expertise, achievements, and success stories. The primary purpose of a website is not only to capture attention but also to connect people. Honestly, […]<\/p>\n","protected":false},"author":1,"featured_media":2104,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[102],"class_list":["post-1967","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","tag-web-design"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/How-to-Create-a-Team-Member-Section-in-WordPress.webp","author_info":{"display_name":"Istiak Rayhan","author_link":"https:\/\/tableberg.com\/nl\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/posts\/1967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/comments?post=1967"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/posts\/1967\/revisions"}],"predecessor-version":[{"id":8167,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/posts\/1967\/revisions\/8167"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/media\/2104"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/media?parent=1967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/categories?post=1967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/nl\/wp-json\/wp\/v2\/tags?post=1967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
![\"\"](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg.png\")
<\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n![\"Schrijf](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Write-the-title-for-your-team-section-using-the-Paragraph-block.webp\")
<\/figure>\n\n\n\n![\"Paragraafblok](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Group-the-Paragraph-Block.webp\")
<\/figure>\n\n\n\n![\"Gutenberg](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Gutenberg-block-adding-option-within-the-group-section.webp\")
<\/figure>\n\n\n\n![\"Een](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-Brief-Description-of-the-Team-Section.webp\")
<\/figure>\n\n\n\n![\"Een](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-description-of-the-team-section.webp\")
<\/figure>\n\n\n\n![\"Voeg](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-the-Column-block-to-show-the-team-members.webp\")
<\/figure>\n\n\n\n![\"Selecteer](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Select-the-number-of-columns.webp\")
<\/figure>\n\n\n\n