\u00c9tape 02 : Regrouper le bloc<\/h3>\n\n\n\n En regroupant le bloc, vous pouvez ajouter plusieurs blocs un par un dans la section de groupe sp\u00e9cifi\u00e9e. Le plus grand avantage est que vous pouvez proc\u00e9der \u00e0 une personnalisation approfondie entre eux, ce qui n'est pas possible avec des blocs normaux non group\u00e9s.<\/p>\n\n\n\n
Cliquez sur l'ic\u00f4ne \u00e0 trois points<\/strong> dans la barre d'outils. Rechercher et cliquer sur l'option Groupe<\/strong> sur la liste.<\/p>\n\n\n\nUne fois le bloc regroup\u00e9, vous verrez l'ic\u00f4ne Gutenberg plus (+) dans la section du groupe. Vous pouvez maintenant ajouter de nouveaux blocs \u00e0 l'int\u00e9rieur de celle-ci.<\/p>\n\n\n\n\u00c9tape 03 : Ajouter une br\u00e8ve description de la section de l'\u00e9quipe<\/h3>\n\n\n\n L'ajout d'une br\u00e8ve description de la section consacr\u00e9e \u00e0 l'\u00e9quipe aura des effets b\u00e9n\u00e9fiques sur le r\u00e9f\u00e9rencement et aidera les utilisateurs \u00e0 comprendre le contexte de la section.<\/p>\n\n\n\n
Ajouter le bloc Paragraphe<\/strong> dans la section du groupe.<\/p>\n\n\n\nIl suffit d'\u00e9crire ce que vous voulez d\u00e9crire \u00e0 propos de la section. Vous pouvez r\u00e9duire la largeur du contenu du bloc en utilisant l'option de remplissage.<\/p>\n\n\n\n
Vous pouvez personnaliser chaque bloc imm\u00e9diatement apr\u00e8s l'avoir ajout\u00e9. Mais nous le ferons une fois que la mise en page compl\u00e8te sera pr\u00eate.<\/p>\n\n\n\n\u00c9tape 04 : Ajouter des membres d'\u00e9quipe<\/h3>\n\n\n\n Vous devez maintenant cr\u00e9er une mise en page distincte dans cette section pour afficher les membres de votre \u00e9quipe. Vous pouvez les pr\u00e9senter de diff\u00e9rentes mani\u00e8res. Nous avons vu jusqu'\u00e0 pr\u00e9sent que la plupart des sites web pr\u00e9sentent leurs sections d'\u00e9quipe sous forme de lignes, de colonnes et de bo\u00eetes.<\/p>\n\n\n\n
Nous pr\u00e9senterons donc \u00e9galement notre section d'\u00e9quipe sous la forme d'une bo\u00eete \u00e0 colonnes. S\u00e9lectionner l'ensemble du groupe<\/strong> par en cliquant sur l'ic\u00f4ne du groupe<\/strong> dans la barre d'outils. Appuyez sur l'ic\u00f4ne plus (+)<\/strong>. <\/p>\n\n\n\nTrouver et ajouter le bloc Colonne<\/strong>.<\/p>\n\n\n\nS\u00e9lectionnez le nombre de colonnes en fonction du nombre de membres de l'\u00e9quipe que vous souhaitez afficher. Comme nous allons afficher trois membres, nous s\u00e9lectionnons trois colonnes.<\/p>\n\n\n\nBien que nous ayons mentionn\u00e9 trois colonnes, vous serez peut-\u00eatre surpris de constater qu'il n'y a qu'une seule colonne apr\u00e8s l'ajout du bloc. Ne vous inqui\u00e9tez pas ! Les colonnes appara\u00eetront lorsque vous passerez votre souris et cliquerez alternativement sur l'espace blanc \u00e0 droite.<\/p>\n\n\n\n
Voir la vid\u00e9o ci-dessous.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nVous pouvez ajouter de nouveaux blocs \u00e0 l'int\u00e9rieur du bloc parent. Venez \u00e0 la premi\u00e8re colonne. Ajouter le bloc Image<\/strong> \u00e0 l'int\u00e9rieur de celui-ci. Vous pouvez ensuite t\u00e9l\u00e9charger une image \u00e0 partir de la m\u00e9diath\u00e8que ou de votre disque local.<\/p>\n\n\n\nVous pouvez voir que nous avons d\u00e9j\u00e0 ajout\u00e9 une image. Nous avons l'aligner sur le centre<\/strong>. Vous pouvez redimensionner l'image \u00e0 l'aide des cercles du bord.<\/p>\n\n\n\nUne fois l'image termin\u00e9e, appuyez sur la touche Entr\u00e9e de votre clavier<\/strong> pour obtenir la nouvelle option d'ajout de blocs. Par d\u00e9faut, c'est le bloc paragraphe qui appara\u00eet.<\/p>\n\n\n\nAjoutez le nom du membre de l'\u00e9quipe, sa d\u00e9signation et une br\u00e8ve introduction \u00e0 son sujet. Nous les avons ajout\u00e9s en utilisant le bloc de paragraphe.<\/p>\n\n\n\nNous allons maintenant lier les profils sociaux personnels<\/strong> des membres de l'\u00e9quipe dans la m\u00eame colonne par le biais de blocs sociaux<\/strong>. <\/p>\n\n\n\nNous lierons ici quatre profils populaires. Cr\u00e9ez donc quatre colonnes suppl\u00e9mentaires \u00e0 l'int\u00e9rieur de la colonne m\u00e8re \u00e0 l'aide de blocs de colonnes.<\/p>\n\n\n\n
Ajouter le bloc Ic\u00f4nes sociales<\/strong> dans la colonne parentale sous le nom et l'introduction du membre de l'\u00e9quipe.<\/p>\n\n\n\nLe bloc d'ic\u00f4nes sociales int\u00e8gre toutes les plateformes de m\u00e9dias sociaux les plus populaires. Une fois le bloc d'ic\u00f4nes sociales ajout\u00e9, vous pourrez choisir les blocs qui vous conviennent en cliquant sur le bouton ic\u00f4ne plus (+)<\/strong>. La vid\u00e9o jointe ci-dessous explique le processus.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nCliquez sur les ic\u00f4nes sociales <\/strong>un par un. Vous obtiendrez une bo\u00eete dans laquelle vous pourrez copier-coller les liens des profils sociaux respectifs. Compl\u00e9tez la section sociale de cette mani\u00e8re.<\/p>\n\n\n\nS\u00e9lectionner l'ensemble de la colonne parentale<\/strong>. Venez au Onglet Styles<\/strong>. Supprimez les espaces inutiles entre les blocs que vous avez ajout\u00e9s horizontalement \u00e0 l'aide de la fonction Option d'espacement des blocs<\/strong>.<\/p>\n\n\n\nAjouter une couleur de fond<\/strong> dans la colonne du membre de l'\u00e9quipe. Pour une meilleure apparence, ajouter un rembourrage horizontal<\/strong> pour ajouter de l'espace autour de la colonne. <\/p>\n\n\n\nDe m\u00eame, compl\u00e9tez les deux autres colonnes de droite en ajoutant de nouveaux membres \u00e0 l'\u00e9quipe.<\/p>\n\n\n\nVous pouvez voir que nous avons rempli les trois colonnes avec trois membres de l'\u00e9quipe et leurs informations.<\/p>\n\n\n\n\u00c9tape 05 : Styliser la section de l'ensemble des membres de l'\u00e9quipe<\/h3>\n\n\n\n S\u00e9lectionner toute la section des membres de l'\u00e9quipe<\/strong> en cliquant sur le bouton Ic\u00f4ne de groupe<\/strong> dans la barre d'outils. <\/p>\n\n\n\nAjouter une couleur de fond<\/strong> \u00e0 la section de l'\u00e9quipe qui vous semble la plus appropri\u00e9e. Ensuite, vous pouvez changer la couleur du texte individuellement<\/strong>en s\u00e9lectionnant les blocs de paragraphes respectifs un par un.<\/p>\n\n\n\nSuivant, ajouter du rembourrage<\/strong> \u00e0 la fois verticalement et horizontalement pour cr\u00e9er un espace blanc autour de la section enti\u00e8re.<\/p>\n\n\n\nEnfin, ajoutez un rayon \u00e0 la section de l'\u00e9quipe pour que le coin de la bordure ait une forme semi-ronde. Cela donnera un aspect diff\u00e9rent \u00e0 la section.<\/p>\n\n\n\n\u00c9tape 06 : Pr\u00e9visualisation de la section \u00c9quipe sur le site web<\/h3>\n\n\n\n Enfin, passez \u00e0 la partie frontale de la page et voyez \u00e0 quoi ressemble la section consacr\u00e9e \u00e0 l'\u00e9quipe. <\/p>\n\n\n\nConclusion<\/h2>\n\n\n\n Vous pouvez \u00e9galement cr\u00e9er et personnaliser la section des membres de l'\u00e9quipe de diff\u00e9rentes mani\u00e8res. Nous venons de pr\u00e9senter ici un processus de base dont vous pouvez vous inspirer pour cr\u00e9er et r\u00e9aliser d'autres designs merveilleux.<\/p>\n\n\n\n
Si vous rencontrez un probl\u00e8me dans ce tutoriel, n'h\u00e9sitez pas \u00e0 nous en faire part dans les commentaires. Enfin, avant de quitter notre site, prenez quelques minutes pour explorer cet article sur Comment cr\u00e9er une bo\u00eete de contenu dans 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\/fr\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/1967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/comments?post=1967"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/1967\/revisions"}],"predecessor-version":[{"id":8167,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/1967\/revisions\/8167"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media\/2104"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media?parent=1967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/categories?post=1967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/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![\"R\u00e9digez](\"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![\"Grouper](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Group-the-Paragraph-Block.webp\")
<\/figure>\n\n\n\n![\"Option](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Gutenberg-block-adding-option-within-the-group-section.webp\")
<\/figure>\n\n\n\n![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-Brief-Description-of-the-Team-Section.webp\")
<\/figure>\n\n\n\n![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-a-description-of-the-team-section.webp\")
<\/figure>\n\n\n\n![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Add-the-Column-block-to-show-the-team-members.webp\")
<\/figure>\n\n\n\n![\"S\u00e9lectionner](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/07\/Select-the-number-of-columns.webp\")
<\/figure>\n\n\n\n