Home 6. Theme Shortcodes

INTRODUCTIONTheme Shortcodes

In the following section you will find a list of all theme shortcodes.

Before you start creating a page, make sure to check how our editor Bold Builder works – 4. Creating Pages and Posts. First you need to add a section, then a row, columns and finally elements (shortcodes) listed in the following chapter.

Especially for Stellarium theme is created a new tab in Section – Posts.

Section

Stellarium theme includes section filtering.

Here is the list of available filters:

  • Category filter – type Post Category slugs separated by comma (eg astro, stories),
  • Taxonomy filter – type Taxonomy slugs (tags etc.) separated by comma (eg. tag:highlight, moon),
  • Show sticky posts  – Hide, Show in list, Show on top,
  • Show posts already displayed on this page – Show/Hide,
  • Show posts in next post containers – Default (use other container’s settings) or Force Show,
  • Order by  – Default – date, Comment count descending,  Post views and Review rate descending.

For example: The post categories that will display in the section should be defined in Category filter field. It should contain the slug of the categories, separated by comma. If you want posts from all categories to be listed in the section, leave this field empty.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/Screenshot_8.jpg

Please note that if the section contains another element that lists posts with defined post categories or other, such as Masonry Post Grid, it will overrun the ones from the Section panel.

For example: On the following screenshot, section will inherit Astro category defined in Masonry Post Grid. The settings in Section (filter by post categories: highlight) will be overridden.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/Screenshot_9.jpg

CHAPTER 01Accordion

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/accordion.jpg

Once you add Accordion element, make sure to add Accordion Item:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/accordion-item.jpg

Below is the list of elements that can be added to Accordion Item:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/BB-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/accordion-f.jpg

CHAPTER 02Article Teaser Template

In order to display posts from specific category in the Article Teaser Template element, the category’s slug should be added to the Posts tab of the section.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/article-teaser-posts.jpg

All other settings can be managed in Article Teaser Template element itself.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/article-teaser-template-1.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/article-teaser-template-f.jpg

CHAPTER 04Button

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/button.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/button-f.jpg

CHAPTER 05Cost Calculator

Documentation on Cost Calculator plugin can be found on the following link.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/CC.jpg

Cost Calculator can include:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/CC-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/07/cc-f.jpg

CHAPTER 06Countdown

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/12/countdown.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/countdown-f.jpg

CHAPTER 07Counter

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/counter.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/counter-f.jpg

CHAPTER 08Custom Menu

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/custom-menu.jpg

CHAPTER 09Google Maps

Google maps require an API key for site domains. Follow the next steps:

  • First step is to get location’s longitude and latitude. This article explains how – Find or enter latitude & longitude.
  • When the location is added, please Get your API key.
  • Then locate the Google Map element in Bold Builder and enter your API key.

On Snazzy Maps are available all kinds of Google Map styles. The required map code is possible to add to the Custom map style array field.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/google-maps.jpg

Once you add Google Maps element, make sure to add Google Maps Location (multiple locations available):

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/google-maps-location.jpg

Below is the list of elements that can be added to Google Maps element:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/google-maps-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/google-map-f.jpg

CHAPTER 10Headline

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/headline.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/headline-f.jpg

CHAPTER 11Icon

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/icon.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/icon-f.jpg

CHAPTER 12Image

Recommended image sizes:

  • Logo – 310px x 100px;
  • Slider image – 1920px x 1200px;
  • Hero (background) image – 1920px x 1200px;
  • Post’s featured image – 1920px x 1200px;
  • Product image – 1200px x 1200px.

*Note that these are the sizes used on our demo.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/image.jpg

Image element can include:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/image-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/image-f.jpg

Stellarium theme allows you to add Inner image to the Image. This element will display over the Image.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/inner-image.jpg

Whether the Inner image will be visible always, on hover, or it will be hidden on hover, can be set in Edit Image panel.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/inner-image-display.jpg

How it looks on the frontend:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/inner-image-f.jpg

CHAPTER 13Image Slider

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/image-slider.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/image-slider-f.jpg

CHAPTER 14Inner Row

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/inner-row.jpg

Once you add Inner Row element, make sure to define layout and add Inner Column:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/inner-row-layout.jpg

CHAPTER 15Instagram

In order to get Client ID, Access Token, and User ID, please follow the steps from our article: How to set up your Instagram widget?

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/12/instagram.jpg

CHAPTER 16Masonry Image Grid

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/masonry-image-grid.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/masonry-image-grid-f.jpg

CHAPTER 17Masonry Post Grid

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/masonry-post-grid.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/masonry-post-grid-f.jpg

Please note that the page set as the main Blog page in Reading Settings lists posts by default. Masonry Post Grid element should not be added to that page.

In order to have blog posts listed as Grid, proceed to create new page and add Masonry Post Grid element to it. Set the main Blog page as its Parent page.

CHAPTER 18Price List

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/price-list.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/price-list-f.jpg

CHAPTER 19Progress bar

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/progress-bar.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/progress-bar-f.jpg

CHAPTER 20Raw Content

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/raw-content.jpg

CHAPTER 21Separator

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/separator.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/separator-f.jpg

CHAPTER 22Service

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/service.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/service-f.jpg

CHAPTER 23Share

When share options are enabled, the whole page where the element is added can be shared on social media.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/share.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/share-f.jpg

CHAPTER 24Simple Cost Calculator

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/simple-cost-calculator.jpg

Once you add Simple Cost Calculator, make sure to add Simple Cost Calculator Item:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/simple-cost-calculator-item.jpg

CHAPTER 25Single Product

Single Product element includes a dropdown with a list of products.

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/07/single-product.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/sigle-product-f.jpg

CHAPTER 26Slider

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/slider.jpg

Once you add Slider element, make sure to add single Slider Item:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/slider-item.jpg

Slider Item can include:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/BB-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/slider-f.jpg

CHAPTER 27Tabs

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/tabs.jpg

Once you add Tabs element, make sure to add single Tab Title:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/tab-item.jpg

Tabs Item can include:

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/BB-elements.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2018/06/tabs-f.jpg

CHAPTER 28Text

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/12/text.jpg
http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/12/text-f.jpg

CHAPTER 29Twitter

As with Instagram element, you’ll need to register an application here to be able to use the element. Please follow the steps from our article: How to set up your Twitter widget?

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/twitter.jpg

CHAPTER 30Video

http://documentation.bold-themes.com/stellarium/wp-content/uploads/sites/34/2017/11/video.jpg