4.0 Theme Shortcodes

Screen Shot 2017-01-18 at 23.04.35

This thee provides a series of shortcodes to display sliders, carousels or other elements.

You can use the shortcodes in the classic way, or you can use Visual Composer where every shortcode has its own Drag ‘n Drop item.

All the shortcodes are meant to be used on their own rows (not in columns) as per modern design trends.

This is a list of shortcodes and parameters:

Caption Medium

Centered huge caption for a section.

[qt-caption-med title=”Section Title” class=”YourExtraClassCss”]


Caption Small

Left aligned caption, smaller.

[qt-caption-small title=”Section Title” class=”YourExtraClassCss”]


Spacer

Adds a vertical spacing (responsive) to avoid using Visual Composer spaging and maintain the original theme’s vertical rhythm.

[qt-spacer size=”m”]

size: it can be s, m or l, which stands for small, medium or large.


Chart

This shortcode will output the tracks of a specific chart or the latest one. You can limit the number of tracks, which will automatically add a button to the full chart page below the tracks (like in the homepage example).

[qt-chart id=”false” number=”100″]

id: you can specify the post ID of a chart, otherwise the latest will appear.

number: how many tracks to display


Featured event

This shortcode allows to display a specific event or the first event occurring by event date. Allows to display also a countdown.

[qt-event-featured id=”” label=”” countdown=””]

id: specify the ID of an event or leave blank for the first upcoming

label: text of the header for the featured event

countdown: set to 1 to display a countdown


 

On Air show

Displays a huge banner of the show actually going on air, according with your schedule settings.

[qt-onair schedulefilter=””]

schedulefilter: you can specify the slug of a specific Schedule Filter, which is the taxonomy associated with schedules, and allows you to separate schedules of different radio channels.

To enable 120 seconds auto reload, go in Appearance->Customize->Radio Settings and enable the auto refresh:

Screen Shot 2017-04-20 at 20.30.06


Post grid

Displays a grid of posts in 4 columns with title below the picture.

[qt-post-grid category=”” quantity=””]

category: specify a category slug to filter posts (Not the ID, the SLUG!)

quantity: number, use multiples of 4


Post hero

Displays a huge post banner with background image and excerpt.

[qt-post-hero category=”” quantity=””]

id: display a single post with this numeric ID

category: specify a category slug to filter posts (Not the ID, the SLUG!)

quantity: number


Schedule

Display a full schedule of shows

[qt-schedule schedulefilter=””]

schedulefilter: you can specify the slug of a specific Schedule Filter, which is the taxonomy associated with schedules, and allows you to separate schedules of different radio channels.


Show slider

Displays a slideshow of the upcoming shows of the day (till midnight)

[qt-showslider schedulefilter=””]

schedulefilter: you can specify the slug of a specific Schedule Filter, which is the taxonomy associated with schedules, and allows you to separate schedules of different radio channels.


Post Carousel

Display a carousel of posts

[qt-slideshow-carousel category=”” quantity=””]

category: specify a category slug to filter posts (Not the ID, the SLUG!)

quantity: number, use multiples of 4


Post Slideshow

Display a slideshow of posts. Can be used in a page with Visual Composer template to display a full-width slideshow, or also in a boxed layout.

[qt-slideshow category=”” quantity=””]

category: specify a category slug to filter posts (Not the ID, the SLUG!)

quantity: number, use multiples of 4


 

Upcoming shows carousel

Displays the upcoming shows for the current day. It can display the shows  until midnight for performance reasons.

[qt-upcoming schedulefilter=””]

schedulefilter: you can specify the slug of a specific Schedule Filter, which is the taxonomy associated with schedules, and allows you to separate schedules of different radio channels.

Real life example:

The homepage of the demo is created only using the shortcodes within Visual Composer, in this way:

Screen Shot 2017-01-19 at 01.41.53