Dernières nouvelles de SeedProd

Tutoriels, astuces et ressources WordPress pour développer votre activité

Comment ajouter une page "Rencontrer l'équipe" à WordPress

How to Create a Meet The Team Page in WordPress 

Écrit par : avatar de l'auteur Stacey Corrin
avatar de l'auteur Stacey Corrin
Stacey écrit sur WordPress et le marketing numérique depuis plus de 10 ans et sur d'autres sujets depuis bien plus longtemps. Parallèlement, elle est fascinée par la conception de sites web, l'expérience utilisateur et le référencement.
     Reviewed By : reviewer avatar Turner John
reviewer avatar Turner John
John Turner est le cofondateur de SeedProd. Il a plus de 20 ans d'expérience dans le domaine des affaires et du développement et ses plugins ont été téléchargés plus de 25 millions de fois.

I’ve written for many websites, and I’ve noticed something: the meet the team page is often an afterthought.

Maybe you feel it’s just a box to tick, or you struggle to make it engaging. It’s often a basic list, or sometimes it’s missing entirely.

But websites are about people, not just products. That’s why a good meet the team page matters. It’s a chance to truly connect with your audience.

My experience tells me showing the human side is key, especially here. So, let’s look at how to create a stunning team page in WordPress, and a missed opportunity into an asset.

Steps to Create a Meet The Team Page in WordPress:

Pourquoi une page "Rencontrez l'équipe" sur votre site web ?

Having a high-quality team showcase or staff list page on your WordPress website can offer several benefits:

  • Personnalisation : Une page "Rencontrez l'équipe" vous permet de présenter les personnes qui se cachent derrière votre entreprise ou votre agence de création, ce qui la rend plus personnelle et plus accessible à votre public.
  • Transparence : En montrant les visages et les antécédents des membres de votre équipe, vous faites preuve d'ouverture et de confiance dans vos pratiques commerciales.
  • Instaurer la confiance: La présentation des membres de votre équipe peut contribuer à renforcer la confiance et la crédibilité de votre public, en particulier si vous fournissez des informations biographiques et des références professionnelles.
  • Moral des employés : la mise en valeur des membres de votre équipe peut améliorer le moral des employés, car ils se sentent reconnus et appréciés par votre organisation ou votre agence numérique.
  • Improved Search Engine Optimization (SEO): Including a team member page design with unique content can also improve your website’s search engine optimization, as it provides additional pages for search engines to index.

En conclusion, une page de présentation de l'équipe peut améliorer la personnalisation, la transparence, la confiance, le moral des employés et le référencement de votre site web.

Exemples de pages de présentation de l'équipe

If you need examples of how an effective team page design looks, you’re in the right place. Below you’ll find some excellent meet the team page examples to inspire your website design.

1. Un motif génial

Exemple de page de présentation de l'équipe Motive Awesome

Awesome Motive includes team sections on its homepage and about page to help website visitors understand the company’s culture and ethos. The team grid has individual team members’ profile pictures and a label highlighting that member’s location worldwide.

L'avantage de cette approche est qu'elle démontre l'un des aspects fondamentaux de l'entreprise, à savoir qu'il s'agit d'une équipe répartie dans le monde entier.

2. Marmelade numérique

Exemple de page de présentation de l'équipe de Digital Marmalade

L'agence de marketing numérique primée Digital Marmalade dispose d'une page d'équipe créative au design amusant et dynamique. Les photos de l'équipe sont présentées dans une grille uniforme qui s'harmonise avec la conception du site web.

Toutefois, cette page se distingue par son effet d'animation. Au lieu d'envoyer les visiteurs vers une page différente, chaque image se retourne pour révéler un onglet contenant des informations sur le secteur d'activité des membres, leurs données personnelles et leur super-héros.

3. Etsy

Exemple de page Etsy Meet the team

La page de l'équipe d'Etsy présente des images de haute qualité de son équipe dirigeante. Chaque photo comporte le nom et le titre de la personne, et lorsque vous cliquez dessus, vous accédez à une page dédiée qui vous permet d'en savoir plus.

Plus bas dans la page se trouve une vaste section de photos d'équipe individuelles du reste des employés de l'entreprise. Lorsque vous passez votre curseur sur chaque photo, il y a un effet de projecteur qui fait ressortir l'image.

4. Atlassian

Exemple de page Atlassian meet the team

La page "Meet our team" d'Atlassian comporte également deux sections consacrées à la direction et au conseil d'administration. La section consacrée aux dirigeants comporte des effets de survol pour chaque photo, et lorsque vous cliquez sur chaque photo, une fenêtre contextuelle s'affiche avec des informations complémentaires et des liens vers les réseaux sociaux.

La section du conseil d'administration présente les photos des membres de l'équipe restreinte, leurs noms, leurs fonctions et des liens vers leurs profils Twitter et LinkedIn.

Section du conseil d'administration d'Atlassian

5. Humaan

Exemple de page de présentation de l'équipe Humaan

I love this meet the team page example from Humaan, a creative graphic design agency. It has a fun and quirky design that perfectly reflects the company’s personality. 

La photo de chaque membre de l'équipe est un GIF animé accompagné d'un bref nom et d'une description. La page d'accueil comprend également d'autres photos de l'équipe et des informations de contact.

Section des membres de l'équipe Humaan

Maintenant que vous avez une bonne idée de l'aspect d'une page de présentation de l'équipe, nous allons apprendre à en créer une pour votre site WordPress.

How to Create a Meet the Team Page in WordPress

One of the easiest ways to create a team page in WordPress is with a drag-and-drop page builder. Sure, you can use the default WordPress block editor or another WordPress plugin to build your team page, but you’ll find it lacks the customization options to design the best possible page.

SeedProd Constructeur de site web WordPress Drag and Drop

WordPress page builders, like SeedProd, include customization features that make tailoring every part of your page a breeze without CSS or HTML. Plus, they have a visual user interface that lets you see changes to your design in real-time.

SeedProd, en particulier, offre les fonctionnalités puissantes suivantes :

  • Constructeur visuel de pages par glisser-déposer
  • Constructeur de thèmes WordPress
  • Modèles de pages adaptés aux mobiles
  • Options de personnalisation par pointer-cliquer
  • Prévisualisation mobile en direct
  • Coming soon & maintenance mode
  • Intégration du marketing par courriel
  • Gestion intégrée des abonnés
  • Et bien d'autres choses encore.

Because of these beginner-friendly features, I’ll use SeedProd to create a team member page in WordPress. So, follow the steps below to dive in.

Étape 1. Installer et activer SeedProd

Tout d'abord, rendez-vous sur la page des prix de SeedProd pour commencer et téléchargez le plugin sur votre ordinateur. Ensuite, vous devrez installer le plugin sur votre site WordPress.

Si vous avez besoin d'aide, vous pouvez consulter nos instructions sur l'installation du plugin SeedProd. Ce guide vous montrera également comment activer votre licence SeedProd pour débloquer vos fonctionnalités premium.

Étape 2. Créer une nouvelle page WordPress

After installing SeedProd, navigate to Pages » All Pages from your WordPress dashboard and click “Add New Page”.

In the WordPress editor, you’ll see an “Edit with SeedProd” button, so go ahead and click this.

Editer une page WordPress avec SeedProd

Now you’ll have the option to choose from one of SeedProd’s pre-made landing page templates. They come with designs for various industries and goals, such as coming soon, sales, squeeze, and more.

But you can also easily customize them to fit your needs.

SeedProd Landing Page templates

My suggestion is to find a template that closely matches the design you want. You can always adapt it with the drag-and-drop builder next.

To select the template, hover over it and click the checkmark icon. I’ve chosen the wealth sales page template for this guide:

SeedProd wealth sales page template

The template will open in SeedProd’s drag-and-drop builder, with a live preview on the right and blocks, sections, and settings on the left.

This is where you can edit your team page and customize its design. You can see these tutorials to understand how the page builder works:

For this guide, I’ve changed the text to make the page look more like a team member page. I also deleted some blocks to make room for the team profiles.

Meet the team page in SeedProd preview

Step 3. Add the Team Members Block

To add the team section, select the ‘Column’ block from the left sidebar. This allows you to show multiple team members in one place. Simply drag and drop the block to wherever it looks best on the page.

Choose the SeedProd column block

Now, you can select a column layout. This will depend on how many team members you want to show on the page.

Choose a SeedProd column layout

Next, you’ll need to choose a block from the left-hand sidebar to add to your column. Since we’re making a team page, look for the “Team Member” block, then drag and drop it into each column.

Drag the team member block into a column

If one column isn’t enough to show all your team members, you can copy and paste it.

Just hover over the column block until it has a blue outline. Then, click the ‘Duplicate Row’ button.

Duplicating a row in SeedProd

You’ll automatically see the duplicated row below the original one, where you can add information for each team member.

Let’s add an image to begin. Click a Team Member block and select ‘Use Your Own Image’ in the block settings sidebar.

Adding an image to the SeedProd team member block

This opens the WordPress media library where you can pick an image or upload one from your computer.

Adding an image from the media library to your meet the team page

After adding the image, you can customize more image settings. For example, you can add image alt text, customize the width, or change the image position.

adding image alt text to team member block

When you scroll down in the block settings, you can change the default name, heading tag and name alignment. It’s also possible to change how the name appears depending on whether the meet the team page is viewed on mobile, desktop, or tablet.

Adding the team member name

Now let’s look at the designation and description, which is your team member’s job title and important information.

Similar to the name settings, you can change the layout based on where the page is being viewed from.

Team member designation and description

Further down, you’ll see settings to customize the Team Member block’s design.

For instance, you can set the rounded borders of the image and add a separator between the image and description.

Adding separators and rounded borders to team member block

Additionally, you can add team members social media information. By default, SeedProd includes social icons for Facebook and Twitter, but you can also insert add more that are relevant to your business, like LinkedIn.

Just click ‘+ Add New Item.’

Adding more social icons to the team member block

Here, you’ll see a list of settings to customize the social icon. Simply click the image symbol to change it.

Change the social icon image

This opens the Icon Library. Here, you can search for the social media platform you want and click the ‘+’ button to use it.

Choosing the linkedin logo for social icons

Once you’ve done that, you can add the social media title and the person’s social link. It’s also just as easy to change the icon’s colors.

Setting social icon color and link

At this stage, you can change the social icon’s sizing, alignment, colors, and shape.

Customize the social icon design

If you want to make further customizations, switch to the ‘Advanced’ tab.

Here you’ll find more settings to change the block’s design, such as customizing the padding and margins, adding a shadow effect, enabling CSS animations, and more.

advanced team member settings

Now all you need to do is repeat these steps for the rest of your team members.

Step 4. Publish Your WordPress Team Members Page

When you are satisfied with the final look and feel of your meet the team page, simply click the ‘Save’ button to save your progress.

Finally, to make your team member page live on your business website, click on the ‘Publish’ button.

Save and publish your team member page

Votre nouveau thème WordPress est en ligne sur votre site web. Vous pouvez maintenant visiter la page des membres de votre équipe pour voir à quoi il ressemble.

Here is the team member showcase I made on my test website:

Exemple de page WordPress finale de rencontre avec l'équipe

Félicitations !

In this tutorial, you’ve learned how to create a WordPress team member page without code. Now, you can improve your company’s trust, credibility, and conversions.

Avec SeedProd, la création de n'importe quelle page WordPress se fait sans effort. Son interface conviviale pour les débutants et ses nombreuses options de personnalisation permettent à toute entreprise de créer un site WordPress parfait sans code.

Avant de partir, vous pourriez également aimer cette liste utile des meilleurs systèmes téléphoniques professionnels pour WordPress.

Merci de votre lecture ! Nous aimerions connaître votre avis, alors n'hésitez pas à laisser un commentaire pour nous faire part de vos questions et de vos réactions.

Vous pouvez également nous suivre sur YouTube, X (anciennement Twitter) et Facebook pour obtenir d'autres contenus utiles au développement de votre entreprise.

avatar de l'auteur
Stacey Corrin Rédacteur
Stacey écrit sur WordPress et le marketing numérique depuis plus de 10 ans et sur d'autres sujets depuis bien plus longtemps. Parallèlement, elle est fascinée par la conception de sites web, l'expérience utilisateur et le référencement.

Divulgation : Notre contenu est soutenu par les lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, il se peut que nous recevions une commission. Nous ne recommandons que des produits dont nous pensons qu'ils apporteront une valeur ajoutée à nos lecteurs.