Use the coupon code WORDPRESS and save 30% OFF! Buy Now

Knowledge base

Shortcodes in the Ignition Framework

What are shortcodes?

Shortcodes are a valuable way of keeping content clean and semantic while allowing end users some ability to programmatically alter the presentation of their content.

Advantages:

  • No markup is added to the post content, which means that markup and styling can easily be manipulated on the fly or at a later state.
  • Shortcodes can also accept parameters, allowing users to modify how the shortcode behaves on an instance by instance basis.

The Shortcodes

The Ignition Framework includes several shortcodes you can use in any content area field in the Customizer, inside your content using the shortcode block, or in a text widget.

Custom menu

[ignition-custom-menu name="your menu name"]

Create a Custom menu under Appearance > Menus, then use this shortcode to display it in any location you want. Primarily used to display Social icons in the top bar.

  • Create a New Menu under Appearance > Customize > Menus.
  • To add a social media link to the menu, click + Add Items.
  • Next, select the Custom Links menu item type.
  • Add the address for one of your social media profiles in the URL field. For example, if the link to your Facebook profile is https://www.facebook.com/cssigniter, you would copy that into the URL field.
  • You can also enter a name for the social media profile in the Link Text field. Once you’re ready, click Add to Menu.
  • Repeat the above steps until all the social media profiles you wish to use have been added to the menu.
  • Finally, click Publish.

We strongly suggest checking out this article on using menus in WordPress.


[ignition-site-search]

Simple site search field, you can use it under any content area in the Customizer.

[ignition-site-search post_type="product"]

Same as above but will limit the search to products. This is quite helpful if you have an online shop or if you want to search for a certain post type.


Date

[ignition-date]

Supported attributes are:

  • format (optional): The date format, by default follows the one set under Settings > General.

Use this shortcode in any Customizer content area to display today’s date.


Weather

[ignition-current-weather id="your-location-id(optional)"]

Supported attributes are:

  • id (optional): The id of the location to display the weather from, default is the one set under the Customizer Weather options.
  • units (optional): C or F units to display.

This will display the weather inside any content area in the Customizer. You will need to setup the API access first under Customize > Utilities > Weather. The location ID number can be found by visiting OpenWeatherMap.org and searching for your city. Leave this blank and the default ID from Customize > Utilities > Weather will appear.


Minicart button

[ignition-minicart-button]

This shortcode will display the minicart. Use it under Customize > Top Bar in any content field you wish. You will need to have WooCommerce installed and activated in order for this to work.


Language switcher

[ignition-language-switcher display="value"(optional) type="value"(optional) untranslated="value"(optional)]

Supported attributes are:

  • display (optional): accepted values are flags, text or both
  • type (optional): accepted values are dropdown or menu
  • untranslated (optional): accepted values are hide or home

We support WPML and Polylang. You can either use their default language switcher or our shortcode one.

Use it in any content area in the theme’s Top Bar or Header to display a language switcher.


[ignition-icon-link link="target-link" icon="icon-slug" text="your-text"]

Supported attributes are:

  • icon (optional if text exists): one of the available icon slugs. For a list of the available icon slugs see here.
  • text (optional if icon exists): wording for your link.
  • link: the URL you want your link to point to.

Easily create and display an icon which points to a certain link.


Instagram feed

[ignition-instagram-feed]

Supported attributes are:

  • username: The username you wish to display on the feed.
  • limit (optional): The maximum number of images to display. Default 12
  • videos (optional): Whether to display video thumbnails. Accepts 1 (true – show video thumbnails) or 0 (false – don’t show video thumbnails). Default 0.
  • resolution (optional): The default image resolution. Accepts ‘default‘ (automatic selection), ‘thumbnail‘ (150x150px), ‘low‘ (320x320px), ‘standard‘ (640x640px). Default ‘default’.
  • width (optional): The desired width of each image, when $resolution is ‘default’. Accepts any positive integer. Default 250.
  • carousel (optional): Whether to enable the slick slider carousel. Accepts 1 (true – carousel is enabled) or 0 (false – carousel disabled). Default 1.
  • autoplay (optional): Whether the carousel will auto slide. Requires carousel to be enabled. Accepts 1 (true – the carousel will autoslide) or 0 (false – the carousel won’t autoslide). Default 0.
  • slides (optional): The number of visible images. Requires carousel to be enabled. Accepts any positive integer, must be smaller than limit. Default 8.
  • arrows (optional): Whether to show the navigation arrows. Requires carousel to be enabled. Accepts 1 (true – navigation arrows will appear) or 0 (false – no navigation arrows). Default 0.
  • speed (optional): The auto slide timeout in milliseconds. Requires carousel and autoplay to be enabled. Accepts any positive integer. Default 3000.

Requires the WPZOOM Social Feed Widget plugin to work.


WooCommerce login

[ignition-wc-login]

This shortcode will display a “My account” link (in case the user is already logged in) or a “Login” link. Use it under Customize > Top Bar in any content field you wish. You will need to have WooCommerce installed and activated in order for this to work.


[ignition-wc-search]

Displays a WooCommerce products AJAX search box.
Supported attributes are:

  • categories (optional): Whether to show the categories dropdown. Accepts 1 or 0. Default 1
  • ajax (optional): Whether to enable AJAX. Accepts 1 or 0. Default 1
  • image (optional): Whether to show the images of products. Accepts 1 or 0. Default 1
  • excerpt (optional): Whether to show the excerpts of products. Accepts 1 or 0. Default 1
  • price (optional): Whether to show the prices of products. Accepts 1 or 0. Default 1

Booking bar

[ignition-booking-form]

Displays a booking request bar with from/to dates, number of persons and selected room.
Supported attributes are:

  • url: The URL to the booking form page.
  • layout: The layout of the booking form. Accepts ‘vertical’, ‘horizontal’, ‘button-below’. Default ‘vertical’.
  • arrive_name: The name attribute of the arrival date field in the target form. Default ‘arrive’.
  • depart_name: The name attribute of the departure date field in the target form. Default ‘depart’.
  • persons_name: The name attribute of the number of persons field in the target form. Default ‘persons’.
  • accommodation_name: The name attribute of the accommodation field in the target form. Default ‘accommodation’.
  • values: The accommodation’s field that will be used as the dropdown’s value. Accepts ‘title’, ‘slug’, ‘id’. Default ‘title’.

To utilize the booking bar with Contact Form 7 you need to configure the fields to get their data from HTTP GET variables as described here, also make sure each field’s name attribute is the same on both the booking bar and the field. To create dynamic drop downs for accommodation items on the Contact Form 7 form you can use a plugin like Contact Form 7 – Post Fields

Get access to all WordPress themes & plugins

24/7 Support Included. Join 115,000+ satisfied customers.

Pricing & Sign Up

30-day money-back guarantee. Not satisfied? Your money back, no questions asked.

Back to top