Passo 02: raggruppare il blocco<\/h3>\n\n\n\n Raggruppando il blocco, \u00e8 possibile aggiungere pi\u00f9 blocchi uno alla volta all'interno della sezione di gruppo specificata. Il vantaggio pi\u00f9 grande \u00e8 che si possono effettuare ampie personalizzazioni tra di essi, cosa che non \u00e8 possibile con i normali blocchi non raggruppati.<\/p>\n\n\n\n
Fare clic sull'icona a tre punti<\/strong> sulla barra degli strumenti. Trova e premere l'opzione Gruppo<\/strong> nell'elenco.<\/p>\n\n\n\nDopo che il blocco \u00e8 stato raggruppato, si vedr\u00e0 l'icona pi\u00f9 (+) di Gutenberg all'interno della sezione del gruppo. Ora \u00e8 possibile aggiungere nuovi blocchi al suo interno.<\/p>\n\n\n\nPasso 03: Aggiungere una breve descrizione della sezione del team<\/h3>\n\n\n\n L'aggiunta di una breve descrizione della sezione del team apporter\u00e0 benefici SEO e aiuter\u00e0 gli utenti a comprendere il contesto della sezione.<\/p>\n\n\n\n
Aggiungere il blocco Paragrafo<\/strong> all'interno della sezione del gruppo.<\/p>\n\n\n\n\u00c8 sufficiente scrivere ci\u00f2 che si vuole descrivere della sezione. \u00c8 possibile ridurre la larghezza del contenuto del blocco utilizzando l'opzione padding.<\/p>\n\n\n\n
\u00c8 possibile personalizzare ogni blocco subito dopo averlo aggiunto. Ma lo faremo dopo che il layout completo sar\u00e0 pronto.<\/p>\n\n\n\nPasso 04: Aggiungere i membri del team<\/h3>\n\n\n\n Ora \u00e8 necessario creare un layout separato all'interno di questa sezione per visualizzare i membri del team. \u00c8 possibile visualizzarli in modi diversi. Finora abbiamo visto che la maggior parte dei siti web presenta le sezioni dei team nei formati riga, colonna e riquadro.<\/p>\n\n\n\n
Quindi presenteremo anche la nostra sezione di squadra nel formato a colonne. Selezionare l'intero gruppo<\/strong> da facendo clic sull'icona del Gruppo<\/strong> sulla barra degli strumenti. Premete l'icona pi\u00f9 (+)<\/strong>. <\/p>\n\n\n\nTrova e aggiungere il blocco Colonna<\/strong>.<\/p>\n\n\n\nSelezionare il numero di colonne in base al numero di membri del team che si desidera mostrare. Poich\u00e9 mostreremo tre membri, selezioneremo tre colonne.<\/p>\n\n\n\nAnche se abbiamo parlato di tre colonne, potreste essere sorpresi dal fatto che ci sia solo una colonna dopo l'aggiunta del blocco. Non preoccupatevi! Le colonne appariranno quando si passa alternativamente il mouse e si fa clic sullo spazio bianco a destra.<\/p>\n\n\n\n
Vedere il video qui sotto.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\n\u00c8 possibile aggiungere nuovi blocchi all'interno del blocco padre. Veniamo alla prima colonna. Aggiungere il blocco immagine<\/strong> all'interno di esso. Successivamente, \u00e8 possibile caricare un'immagine dalla libreria multimediale o dall'unit\u00e0 locale.<\/p>\n\n\n\nSi pu\u00f2 notare che abbiamo gi\u00e0 aggiunto un'immagine. Abbiamo allineato centralmente<\/strong>. \u00c8 possibile ridimensionare l'immagine utilizzando i cerchi del bordo.<\/p>\n\n\n\nUna volta terminata l'immagine, premere il tasto Invio sulla tastiera<\/strong> per ottenere la nuova opzione di aggiunta di blocchi. Per impostazione predefinita, apparir\u00e0 il blocco paragrafo.<\/p>\n\n\n\nAggiungete il nome del membro del team, la sua designazione e una breve introduzione su di lui. Li abbiamo aggiunti utilizzando il blocco paragrafo.<\/p>\n\n\n\nOra collegare i profili sociali personali<\/strong> dei membri del team nella stessa colonna attraverso i blocchi sociali<\/strong>. <\/p>\n\n\n\nQui collegheremo quattro profili popolari. Quindi, creare altre quattro colonne all'interno della colonna madre, utilizzando i blocchi di colonne.<\/p>\n\n\n\n
Aggiungere il blocco Icone sociali<\/strong> nella colonna dei genitori sotto il nome e la presentazione del membro del team.<\/p>\n\n\n\nIl blocco Icona sociale integra tutte le piattaforme di social media pi\u00f9 diffuse. Una volta aggiunto il blocco Icona sociale, avrete la possibilit\u00e0 di scegliere i blocchi che preferite facendo clic sul tasto icona pi\u00f9 (+)<\/strong>. Il video allegato di seguito spiega il processo.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nFare clic sulle icone sociali <\/strong>uno per uno. Si aprir\u00e0 un riquadro in cui \u00e8 possibile copiare-incollare i link dei rispettivi profili sociali. Completate la sezione social in questo modo.<\/p>\n\n\n\nSelezionare l'intera colonna madre<\/strong>. Vieni al Scheda Stili<\/strong>. Rimuovere gli spazi non necessari tra i blocchi aggiunti orizzontalmente utilizzando il tasto Opzione Spaziatura blocchi<\/strong>.<\/p>\n\n\n\nAggiungere un colore di sfondo<\/strong> alla colonna del membro del team. Per un aspetto migliore, aggiungere un padding orizzontale<\/strong> per aggiungere un po' di spazio intorno alla colonna. <\/p>\n\n\n\nAllo stesso modo, completate le altre due colonne sul lato destro aggiungendo nuovi membri del team.<\/p>\n\n\n\nSi pu\u00f2 notare che abbiamo riempito tutte e tre le colonne con tre membri del team e le loro informazioni.<\/p>\n\n\n\nPasso 05: stilizzare l'intera sezione dei membri del team<\/h3>\n\n\n\n Selezionare l'intera sezione dei membri del team<\/strong> facendo clic sul pulsante Icona del gruppo<\/strong> sulla barra degli strumenti. <\/p>\n\n\n\nAggiungere un colore di sfondo<\/strong> alla sezione della squadra che vi sembra pi\u00f9 adatta. Dopodich\u00e9, potete cambiare il colore del testo individualmente<\/strong>, selezionando i rispettivi blocchi di paragrafo uno per uno.<\/p>\n\n\n\nIl prossimo, aggiungere un'imbottitura<\/strong> sia in verticale che in orizzontale per creare uno spazio bianco intorno all'intera sezione.<\/p>\n\n\n\nInfine, aggiungete un raggio alla sezione della squadra in modo che l'angolo del bordo abbia una forma semicircolare. Questo dar\u00e0 un aspetto diverso e bello alla sezione.<\/p>\n\n\n\nPasso 06: Anteprima della sezione Team nel frontend<\/h3>\n\n\n\n Infine, si pu\u00f2 accedere al frontend della pagina e vedere come appare la sezione del team. <\/p>\n\n\n\nConclusione<\/h2>\n\n\n\n \u00c8 possibile creare e personalizzare la sezione dei membri del team in vari modi. Abbiamo presentato qui un processo di base da cui potete prendere ispirazione per creare e realizzare altri meravigliosi design.<\/p>\n\n\n\n
Se doveste incontrare qualche problema in qualche punto dell'intero tutorial, non esitate a farcelo sapere attraverso il box dei commenti. Infine, prima di lasciare il nostro sito, dedicate qualche minuto a esplorare questo post su come creare un riquadro di contenuto 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\/it\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/posts\/1967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/comments?post=1967"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/posts\/1967\/revisions"}],"predecessor-version":[{"id":8167,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/posts\/1967\/revisions\/8167"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/media\/2104"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/media?parent=1967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/categories?post=1967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/it\/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![\"Scrivete](\"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![\"Raggruppare](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Group-the-Paragraph-Block.webp\")
<\/figure>\n\n\n\n![\"Opzione](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Gutenberg-block-adding-option-within-the-group-section.webp\")
<\/figure>\n\n\n\n![\"Aggiungere](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-Brief-Description-of-the-Team-Section.webp\")
<\/figure>\n\n\n\n![\"Aggiungere](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-description-of-the-team-section.webp\")
<\/figure>\n\n\n\n![\"Aggiungere](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-the-Column-block-to-show-the-team-members.webp\")
<\/figure>\n\n\n\n![\"Selezionare](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Select-the-number-of-columns.webp\")
<\/figure>\n\n\n\n