Agent List and Grid View Widget

This widget allows you to show agents anywhere on the page. Simply drag and drop the widget and configure the settings on the left side.

Default View- Here you can choose whether you want to have grid or list view by default.

Show Agents With Images- Turn this on if you want to hide agents without image.

Show Agents Phone- Turn this on if you want to show agents phone.

Show Secondary Email- Turn this on if you want to show secondary email of agent.

Show Socials- Turn this on if you want to show social media links of agent.

Number Of Items- Here you can specify how many agents you want to be shown exactly.

Color- Here, you can select the color of your text by moving your mouse through the color chart, as well as adjusting the tone/opacity sliders to the right. You can also enter a specific color code. You can customize the color of:

-Agent Name

-Agent Role

-Agent Label

-Agent Contents

Typography- Here, you will be able to adjust everything regarding the font of your text. You can choose:

-Font Family

-Font Size

-Weight (the level of thickness of the letters)

-Transform (letter cases)

-Style

-Decoration

-Line Height (the line spacing)

-Letter Spacing

You can customize the typography of:

-Agent Name

-Agent Role

-Agent Phone Label

-Agent Property Listed Text

Background Type- Here you can choose whether you want background to be classic or gradient. After picking the type you will see settings for your chosen type:

-Classic: Here you can pick background color or add a background image. You can use different images for different screen sizes (Desktop, Tablet and Mobile). When you add image you’ll see additional settings for it:

  • Position- Here you can select the position of the background. You can also set different positions for different screen sizes by navigating through the icons. You are also able to choose custom position and input your own X Position and Y Position values. You can move the slider or simply input the number you wish. You can set different values for different screen sizes by navigating through the icons here as well. This setting also allows you to choose unit between PX, EM, % and VW for X position and between PX, EM, % and VH for Y position.
  • Attachment- Here you can set attachment to scroll or to be fixed. You can also leave it to default.
  • Repeat- You can choose different options for different screen sizes by navigating through the icons. You can choose between these repeat options:
    • Set it to no repeat if you don’t want background to repeat.
    • Set it to repeat if you want your background to be repeated horizontally and vertically.
    • Set it to repeat-x if you want your background to be repeated only horizontally.
    • Set it to repeat-y if you want your background to be repeated only vertically.
  • Size- You can select background size between auto, cover, contain and custom. You can set different sizes for different screen sizes by navigating through the icons. If you select custom, you’ll see additional settings where you can specify width in PX, EM, % or VW. You can set the width by moving the slider or simply writing the number. You can use icons here as well and set different width for different screens.

Gradient- Here you can pick colors to mix and make a gradient background, We have these options here:

  • Color- You can pick your first color here.
  • Location- You can set the location of your first color by moving the slider or simply inputting number.
  • Second Color- You can pick your second color here.
  • Location- You can set the location of your second color by moving the slider or simply inputting number.
  • Type- Here you can choose gradient type between Linear and Radial.
    • If you set it to Linear you’ll be able to set your desired angle by moving the slider or simply writing the number you want.
    • If you set it to Radial you’ll be able to select position from multiple options.

You may also like