Listing Pro
Display a customizable list of items with images, titles, descriptions, and links. Ideal for showcasing services, features, team members, or posts.
This widget is available in the Astroid Pro version only. If you are using the free version, consider upgrading to access this feature.
π How to Useβ
π Step 1: Open the Layout Builderβ
- Go to your Joomla Administrator Panel
- Navigate to:
System
βSite Template Styles
β Click on your Astroid template - Click the βTemplate Optionsβ button
- Open the Layout tab
- Launch the Layout Builder
π§± Step 2: Add the Widgetβ
- Open the Astroid Layout Builder.
- Add a new Widget to your desired section.
- Select Listing Pro Widget from the widget list.
π§ General Settingsβ
1. Title Optionsβ
- Title HTML Element: Choose the HTML tag for the title:
h1
,h2
,h3
, ...,div
. Default ish3
. - Title Font Style: Customize typography for the title (font size, weight, alignment, etc.).
2. Meta Optionsβ
- Meta Font Style: Customize the meta text style (typically used for extra info such as date, author, etc.).
- Meta Position:
Before
: Display meta before the titleAfter
: Display meta after the title
3. Content Optionsβ
- Content Font Style: Typography settings for the description text.
4. Read More Optionsβ
- Button Style: Choose the style of the read more button:
Primary
,Secondary
,Success
,Danger
,Warning
,Info
,Light
,Dark
,Link
,Text
- Button Outline: Enable or disable outlined button styling.
- Button Size: Choose the size of the button:
Default
,Large (btn-lg)
,Small (btn-sm)
- Border Radius: Set button shape:
Rounded
(default),Square (rounded-0)
,Circle (rounded-pill)
π Item Configurationβ
You can add multiple items to the listing. Each item supports the following fields:
- Image: Upload or select an image for the item.
- Title: The main heading for the item.
- Meta: Optional meta information for context.
- Description: A short paragraph describing the item.
- Link: URL for βread moreβ or external destination.
- Link Title: Text for the clickable button (e.g., βView Moreβ).
- Link Target: Where the link opens:
Default
,_blank
(new tab),_parent
,_top
π Dynamic Content Supportβ
If you want to automatically populate the widget with dynamic content:
- Enable the Dynamic Group Settings section.
- Choose the Dynamic Content Source to pull data from.
β οΈ Requires setup of a dynamic source like Joomla articles, JSON feed, etc.
π§± Item Paddingβ
- Item Padding: Adjust the spacing inside each list item using the
astroidspacing
field.
π― Assignment Settingsβ
Control where the widget appears on your site:
- Assignment Type:
On All Pages
: Show the widget everywhere.No Pages
: Hide the widget completely.Selected Pages
: Show only on specific menu items.
- Assign to Menu Item: Select specific menu items (visible only when
Selected Pages
is chosen).
β Summaryβ
Listing Pro Widget is a versatile tool for creating attractive and customizable content listings. It's perfect for:
- Displaying services or features
- Team member introductions
- Portfolio items
- Blog post summaries
- Any structured, repeatable content
With full support for styling, layout, dynamic content, and assignments, this widget gives you powerful control over your content presentation.