The Agent Card widget displays key information about the real estate agent associated with a property. It typically includes the agent's photo, name, contact details, verification badge, and quick action buttons such as call, WhatsApp, or email. This widget is ideal for property detail pages where you want to highlight the agent responsible for the listing and provide users with an easy way to contact them.
How to Add the "Agent Card" Widget
- Open the property detail page in Elementor.
- From the widget panel, drag and drop the Agent Card widget into your desired section.
- By default, the widget will display the agent assigned to the current property.
- You can switch the source to a specific agent if you want to showcase a particular agent regardless of the property setup.
Configuration Options
Content Tab
- Layout: Choose between available card variations to control the overall design.
- Agent Source:
- Auto: Displays the agent linked to the property.
- Specific Agent: Manually select a specific agent.
- Select Agent: Pick an agent from the dropdown list if "Specific Agent" is selected.
- View Listings Text: Customize the text for the "View my listings" link.
- Verification Badge: Toggle on/off the verification badge for verified agents.
- Hide "Verified" Text: Display only the verification icon without text.
- Show Phone/Mobile Number: Show or hide the agent's phone numbers.
- Click to Reveal: Enable this option to hide phone numbers until clicked.
- Action Buttons: Choose which buttons to display (Call, WhatsApp, Telegram, Line).
Style Tab
- Card Styling: Customize background color, image, padding, border radius, and shadow.
- Agent Image: Adjust size, shape, and spacing for the agent's photo.
- Agent Name: Control typography and color for the name.
- Verification Badge: Customize badge colors and styles.
- View Listing Text: Style the "View my listings" link (typography, hover, color).
- Contact Info Text: Adjust typography and spacing for phone/email info.
- Contact Icons: Style the icons (color, size, hover effect).
- Action Buttons: Configure colors, borders, hover effects, and spacing for the action buttons.
Best Practices
- Use the Auto agent source for property detail templates to ensure the correct agent is always displayed.
- Enable Click to Reveal for phone numbers to reduce spam exposure.
- Keep the design consistent with your site's branding by customizing colors and typography.
- Only enable relevant action buttons (e.g., WhatsApp or Telegram) if your agents actively use those channels.
Comments
0 comments
Article is closed for comments.