Noo Team Member – Addon for Elementor Page Builder

Introduction

The Noo Team Member Addon for Elementor Page Builder is a powerful tool that enables you to create customizable and responsive team member sections for your website. This tutorial will guide you through the process of installing, configuring, and using the Noo Team Member Addon to create stunning team member sections for your Elementor-powered website.

Installation

Before we dive into the tutorial, you'll need to install the Noo Team Member Addon. Here's how to do it:

1. Log in to your Elementor account and go to the Elementor library (https://elementor.com/library/).
2. Search for "Noo Team Member" in the search bar and select the addon from the search results.
3. Click on the "Install" button to install the addon.
4. Once the addon is installed, go to your WordPress dashboard and click on the "Appearance" tab.
5. Hover over the "Elementor" tab and click on "Widget Areas" in the dropdown menu.
6. Click on the "Add New" button and select "Noo Team Member" from the dropdown menu.
7. Name your widget area (e.g., "Team Members") and click on the "Add" button to save it.

Basic Configuration

Now that we have the Noo Team Member Addon installed and configured, let's learn how to use it.

1. Go to the Elementor page builder and create a new section (or edit an existing one).
2. In the Elementor panel, scroll down to the "Layout" tab and select "Noo Team Member" from the dropdown menu.
3. This will bring up the Noo Team Member settings panel, where you can configure various settings for your team member section.

Configuring the Team Member Section

Here are the basic settings you can configure for the team member section:

1. Team Member Information: Enter the team member's name, job title, and bio.
2. Avatar: Upload the team member's avatar or select one from the Elementor library.
3. Background Image: Upload a background image for the team member section or select one from the Elementor library.
4. Image Ratio: Choose the aspect ratio for the background image.
5. Padding: Adjust the padding for the team member section.
6. Alignment: Align the team member section horizontally.
7. Visibility: Choose which devices you want the team member section to be visible on.
8. Animation: Select an animation effect for the team member section.
9. Button Text: Enter the text for the button that will be displayed below the team member's bio.
10. Button Link: Enter the URL for the button link.

Adding Multiple Team Members

To add multiple team members to your section, you can use the "Duplicate" button to duplicate an existing team member layout, or you can add multiple team member widgets and customize each one individually.

1. To duplicate an existing team member layout, go to the "Settings" tab and click on the "Duplicate" button.
2. To add a new team member, go to the "Widgets" tab and click on the "Add New" button.
3. In the "Add New" popup, select "Noo Team Member" from the dropdown menu and configure the team member settings as needed.
4. Repeat step 3 to add additional team members.

Final Step

Once you have configured your team member section(s), you can drag and drop them into the page builder to create a cohesive and visually appealing design for your website.

In the next section, we will explore more advanced configuration options and customization techniques for the Noo Team Member Addon.