Shortcodes - How to build your Hub Pages using shortcodes inside Gutenberg or other popular pagebuilders
By leveraging WordPress shortcodes within Gutenberg or other popular page builders, you can easily build your Hub Pages. This guide will walk you through the use of the following key shortcodes:
Dollie Blueprints Shortcode [dollie-blueprints] - Display a list of blueprint templates on your WordPress site.
Dollie Customers Shortcode [dollie-customers] - Showcase your customers on the front-end of your Hub.
Dollie Launch Site Shortcode [dollie-launch-site] - Present a form to launch a new site on your platform.
Dollie Site Content Shortcodes [dollie-site-content], [dollie-site-screenshot], and [dollie-site-navigation] - Enable your customers to manage their own sites with a dedicated Site Dashboard.
Dollie Latest News Shortcode [dollie-latest-news] - Display the latest news on your WordPress site.
Dollie Site Navigation Shortcode [dollie-site-navigation] - Display site navigation on your WordPress site.
Each shortcode comes with optional parameters to customize its functionality. Follow along as we explore the usage and benefits of each of these powerful tools.
You can add additional widgets from your pagebuilder to further build out your pages easily.
The Dollie Blueprints Shortcode allows you to display a list of blueprints (template) on your WordPress site. This shortcode can then be inserted for example on your homepage to show all the available templates you are selling for your WaaS/SaaS platform.
The Dollie Blueprints Shortcode accepts the following parameters:
- amount (optional): The number of blueprints to display. Default: -1 (display all blueprints).
- columns (optional): The number of columns to display the blueprints in. Default: 3.
- orderby (optional): The attribute to use for sorting the blueprints. Default: 'post_date'.
- order (optional): The order in which to sort the blueprints. Default: 'DESC'.
- category (optional): The category slug of the blueprints to display.
- id (optional): A comma-separated list of blueprint IDs to display.
- checkout-url (optional): The URL for the checkout page.
- launch-button-text (optional): The text to display on the launch button.
- view-demo-text (optional): The text to display for viewing the demo.
- custom-class (optional): Additional custom CSS class for the blueprint items.
To insert the Dollie Blueprints Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the blueprints.
In the content editor, add the following shortcode: [dollie-blueprints].
Customize the shortcode parameters as needed. For example:
[dollie-blueprints amount="6" columns="4" orderby="title" order="ASC" category="featured" checkout-url="/checkout" launch-button-text="Launch" view-demo-text="View Demo"]
This shortcode will display 6 blueprints in 4 columns, sorted by title in ascending order, belonging to the "featured" category. It will use the provided checkout URL, launch button text, and view demo text.
Update or publish the page or post.
View the page or post on the front-end to see the blueprints displayed according to the shortcode parameters.
The Dollie Customers Shortcode allows you to display your customers on the front-end of your Hub. This shortcode is mostly useful if you have a support team that might not have access to your WordPress Admin or as a handy tool for you to quickly see your customers and their sites via your front-end.
The Dollie Customers Shortcode accepts the following parameters:
- customers_per_page (optional): The number of customers to display per page. Default: 10.
To insert the Dollie Customers Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the customers.
2\. In the content editor, add the following shortcode:
3\. Customize the shortcode parameters as needed. For example:
This shortcode will display 20 customers per page.
4\. Update or publish the page or post.
5\. View the page or post on the front-end to see the customers displayed according to the shortcode parameters.
Note: The Dollie Customers Shortcode is only accessible to logged-in users with the "manage_options" capability. Customers will not be displayed if the user is not logged in and has the right permissions.
The Dollie Launch Site Shortcode allows you to display the form to launch for a new site on your platform.
The Dollie Launch Site Shortcode accepts the following parameters:
- type (optional): The type of launch site. Default: 'site'. (You can also choose 'blueprint' but this functionality will be retired from the Hub soon)
- advanced_settings (optional): Whether to display advanced settings. Default: '0'.
- button_text (optional): The text to display on the launch button.
To insert the Dollie Launch Site Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the launch site button.
In the content editor, add the following shortcode:
3\. Customize the shortcode parameters as needed. For example:
Update or publish the page or post.
View the page or post on the front-end to see the launch site button displayed according to the shortcode parameters.
The Dollie Site Content shortcodes are related to the Site Dashboard you can offer to your customers to manage their own sites. You can build you own layout with several shortcodes you can insert. See the screenshow below for an example how this could look like in Gutenberg:
The following shortcodes are available
Shows the Site Dashboard content/widgets with the details of the site. This widget is required and should always be inserted in the Hub Page dedicated to your "Site Management" area.
Show a screenshot of the site & buttons to quickly login to the site.
Shows the Site Navigation links that point to other areas of the site dashboard. This widget is required and should always be inserted in the Hub Page dedicated to your "Site Management" area. Note: The Dollie Site Content Shortcode will only show content when you view the Site Dashboard of a site on your platform inside your Hub. If you are not viewing a site the shortcode will not show the correct content.
The Dollie Latest News Shortcode allows you to display the latest news on your WordPress site. This shortcode is implemented by the Dollie plugin.
The Dollie Latest News Shortcode accepts the following parameters:
- amount (optional): The number of latest news posts to display. Default: 15.
To insert the Dollie Latest News Shortcode into your WordPress site, follow these steps:
1\. Edit the page or post where you want to display the latest news.
2\. In the content editor, add the following shortcode:
3\. Customize the shortcode parameters as needed. For example:
This shortcode will display the 10 latest news posts.
4\. Update or publish the page or post.
5\. View the page or post on the front-end to see the latest news displayed according to the shortcode parameters.
Dollie Blueprints Shortcode [dollie-blueprints] - Display a list of blueprint templates on your WordPress site.
Dollie Customers Shortcode [dollie-customers] - Showcase your customers on the front-end of your Hub.
Dollie Launch Site Shortcode [dollie-launch-site] - Present a form to launch a new site on your platform.
Dollie Site Content Shortcodes [dollie-site-content], [dollie-site-screenshot], and [dollie-site-navigation] - Enable your customers to manage their own sites with a dedicated Site Dashboard.
Dollie Latest News Shortcode [dollie-latest-news] - Display the latest news on your WordPress site.
Dollie Site Navigation Shortcode [dollie-site-navigation] - Display site navigation on your WordPress site.
Each shortcode comes with optional parameters to customize its functionality. Follow along as we explore the usage and benefits of each of these powerful tools.
You can add additional widgets from your pagebuilder to further build out your pages easily.
Dollie Blueprints Shortcode
The Dollie Blueprints Shortcode allows you to display a list of blueprints (template) on your WordPress site. This shortcode can then be inserted for example on your homepage to show all the available templates you are selling for your WaaS/SaaS platform.
Parameters
The Dollie Blueprints Shortcode accepts the following parameters:
- amount (optional): The number of blueprints to display. Default: -1 (display all blueprints).
- columns (optional): The number of columns to display the blueprints in. Default: 3.
- orderby (optional): The attribute to use for sorting the blueprints. Default: 'post_date'.
- order (optional): The order in which to sort the blueprints. Default: 'DESC'.
- category (optional): The category slug of the blueprints to display.
- id (optional): A comma-separated list of blueprint IDs to display.
- checkout-url (optional): The URL for the checkout page.
- launch-button-text (optional): The text to display on the launch button.
- view-demo-text (optional): The text to display for viewing the demo.
- custom-class (optional): Additional custom CSS class for the blueprint items.
Usage
To insert the Dollie Blueprints Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the blueprints.
In the content editor, add the following shortcode: [dollie-blueprints].
Customize the shortcode parameters as needed. For example:
[dollie-blueprints amount="6" columns="4" orderby="title" order="ASC" category="featured" checkout-url="/checkout" launch-button-text="Launch" view-demo-text="View Demo"]
This shortcode will display 6 blueprints in 4 columns, sorted by title in ascending order, belonging to the "featured" category. It will use the provided checkout URL, launch button text, and view demo text.
Update or publish the page or post.
View the page or post on the front-end to see the blueprints displayed according to the shortcode parameters.
Dollie Customers Shortcode
The Dollie Customers Shortcode allows you to display your customers on the front-end of your Hub. This shortcode is mostly useful if you have a support team that might not have access to your WordPress Admin or as a handy tool for you to quickly see your customers and their sites via your front-end.
Parameters
The Dollie Customers Shortcode accepts the following parameters:
[dollie-customers customers_per_page="10"]- customers_per_page (optional): The number of customers to display per page. Default: 10.
Usage
To insert the Dollie Customers Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the customers.
2\. In the content editor, add the following shortcode:
[dollie-customers]3\. Customize the shortcode parameters as needed. For example:
[dollie-customers customers_per_page="20"]This shortcode will display 20 customers per page.
4\. Update or publish the page or post.
5\. View the page or post on the front-end to see the customers displayed according to the shortcode parameters.
Note: The Dollie Customers Shortcode is only accessible to logged-in users with the "manage_options" capability. Customers will not be displayed if the user is not logged in and has the right permissions.
Dollie Launch Site Shortcode
The Dollie Launch Site Shortcode allows you to display the form to launch for a new site on your platform.
Parameters
The Dollie Launch Site Shortcode accepts the following parameters:
[dollie-launch-site type="site" advanced_settings="0" button_text="" ]- type (optional): The type of launch site. Default: 'site'. (You can also choose 'blueprint' but this functionality will be retired from the Hub soon)
- advanced_settings (optional): Whether to display advanced settings. Default: '0'.
- button_text (optional): The text to display on the launch button.
Usage
To insert the Dollie Launch Site Shortcode into your WordPress site, follow these steps:
Edit the page or post where you want to display the launch site button.
In the content editor, add the following shortcode:
[dollie-launch-site]3\. Customize the shortcode parameters as needed. For example:
[dollie-launch-site type="site" advanced_settings="1" button_text="Launch My Site"]Update or publish the page or post.
View the page or post on the front-end to see the launch site button displayed according to the shortcode parameters.
Dollie Site Content Shortcodes
The Dollie Site Content shortcodes are related to the Site Dashboard you can offer to your customers to manage their own sites. You can build you own layout with several shortcodes you can insert. See the screenshow below for an example how this could look like in Gutenberg:
The following shortcodes are available
[dollie-site-content]Shows the Site Dashboard content/widgets with the details of the site. This widget is required and should always be inserted in the Hub Page dedicated to your "Site Management" area.
[dollie-site-screenshot]Show a screenshot of the site & buttons to quickly login to the site.
[dollie-site-navigation]Shows the Site Navigation links that point to other areas of the site dashboard. This widget is required and should always be inserted in the Hub Page dedicated to your "Site Management" area. Note: The Dollie Site Content Shortcode will only show content when you view the Site Dashboard of a site on your platform inside your Hub. If you are not viewing a site the shortcode will not show the correct content.
Dollie Latest News Shortcode
The Dollie Latest News Shortcode allows you to display the latest news on your WordPress site. This shortcode is implemented by the Dollie plugin.
Parameters
The Dollie Latest News Shortcode accepts the following parameters:
[dollie-latest-news amount="15"]- amount (optional): The number of latest news posts to display. Default: 15.
Usage
To insert the Dollie Latest News Shortcode into your WordPress site, follow these steps:
1\. Edit the page or post where you want to display the latest news.
2\. In the content editor, add the following shortcode:
[dollie-latest-news]3\. Customize the shortcode parameters as needed. For example:
[dollie-latest-news amount="10"]This shortcode will display the 10 latest news posts.
4\. Update or publish the page or post.
5\. View the page or post on the front-end to see the latest news displayed according to the shortcode parameters.
Updated on: 27/02/2024
Thank you!