Video

If you're a musician, you'll definitely have videos on your website! With our video shortcodes, you can embed them anywhere. Oh, and did we mention they are responsive? They'll work on any mobile device that supports video!

What sites can I embed from? →

Parameters

align - left, center (default), right
aspect_ratio - 4:3, 16:9 (default), 21:9
width - every full number between 1 and 100 (the width of the video in percent)

[video]https://www.youtube.com/watch?v=s9_6bEsMmJc[/video]

Photo Galleries

Showcase your photos, anywhere on your site. Just finish a concert? Upload your photos for all your fans to see or share your latest photoshoot with prospective agents.

Learn how to create a gallery →

[gallery] - Learn more from the Wordpress Codex

Testimionials

You already know you're pretty awesome - but what about sharing what others think? Share testimonies from your fans!

Parameters

by - name of person who said the testimonial
class - give your shortcode a unique classname for custom styling

Taylor was the most engaging musician we've had on stage for a long time. She kept our guests entertained, even when she wasn't singing! That's a talent you can't find in just anyone.

John Appleseed

[symple_testimonial by="John Appleseed"]<img src="photo.jpg" class="alignleft" /> Taylor was the most engaging musician we've had on stage for a long time. She kept our guests entertained, even when she wasn't singing! That's a talent you can't find in just anyone.[/symple_testimonial]

Google Maps

Where's the venue you're playing? How about detailing it with a Google Map?

Parameters

title - your desired text title
location - address
height - desired height (required)
zoom - map zoom value, default is 8
class - give your shortcode a unique classname for custom styling

[symple_googlemap title="Envato Office" location="2 Elizabeth St, Melbourne Victoria 3000 Australia" zoom="10" height=250]

Highlights

Highlight text with a vengence!

Make important points stand out! Etiam rhoncus accumsan elit sed. Lorem ipsum t, consectetur adipiscing elit. Etiam rhoncus accumsan elit sedLorem ipsum t, consectetur adipiscing elit. Etiam rhoncus accumsan elit sed.Etiam rhoncus accumsan elit sed.

<p>[symple_highlight color="yellow"]Make important points stand out![/symple_highlight] Etiam rhoncus accumsan elit sed. [symple_highlight color="blue"]Lorem ipsum t, consectetur adipiscing elit.[/symple_highlight] [symple_highlight color="red"]Etiam rhoncus accumsan elit sedLorem ipsum t,[/symple_highlight] consectetur adipiscing elit. [symple_highlight color="green"]Etiam rhoncus accumsan elit sed.[/symple_highlight]Etiam rhoncus accumsan elit sed.</p>

Buttons

Make your visitors press your buttons... in a good way!

Button

Apply the CSS class "btn" to <a> and <button> elements to create a standard button.

Example: <a href="#" class="btn">Button</a>

Custom Buttons

If you're looking to do something a little different than the "norm", here are some stylized buttons you can use.

Parameters

color - black, red, orange, blue, pink, rosy, green, brown, purple, gold, teal
url - http://www.example.com
title - this is the link title value
target - blank, self
border_radius - any pixel value - use 99px for pill-shaped buttons
class - give your shortcode a unique classname for custom styling
icon_left - enter the name of an icon from FontAwesome
icon_right - enter the name of an icon from FontAwesome

Button Button Button Button Button Button Button Button Button Button Button

[symple_button color="black" url="#"]Button[/symple_button]
[symple_button color="red" url="#"]Button[/symple_button]
[symple_button color="orange" url="#"]Button[/symple_button]
[symple_button color="blue" url="#"]Button[/symple_button]
[symple_button color="pink" url="#"]Button[/symple_button]
[symple_button color="rosy" url="#"]Button[/symple_button]
[symple_button color="green" url="#"]Button[/symple_button]
[symple_button color="brown" url="#"]Button[/symple_button]
[symple_button color="purple" url="#"]Button[/symple_button]
[symple_button color="gold" url="#"]Button[/symple_button]
[symple_button color="teal" url="#"]Button[/symple_button]

Boxes

Every once and awhile you need a good box to display important messages, right?

Parameters

color - gray, green, yellow, blue, red
class - give your shortcode a unique classname for custom styling

Sample Content

[symple_box color="gray"]<p>Sample Content</p>[/symple_box]
[symple_box color="green"]<p>Sample Content</p>[/symple_box]
[symple_box color="yellow"]<p>Sample Content</p>[/symple_box]
[symple_box color="blue"]<p>Sample Content</p>[/symple_box]
[symple_box color="red"]<p>Sample Content</p>[/symple_box]

Dividers

Divide things, with style.

Parameters

style - solid, dashed, dotted, double
margin_top - margin top, measured in pixels
margin_bottom - margin bottom, measured in pixels

[symple_divider style="solid"]
[symple_divider style="dashed"]
[symple_divider style="dotted"]
[symple_divider style="double"]

Toggles

This Is Your Toggle Title

Sample Content

Multiple Toggles Are Nice

Sample Content

[symple_toggle title="This Is Your Toggle Title"]Sample Content[/symple_toggle]
[symple_toggle title="Multiple Toggles Are Nice"]Sample Content[/symple_toggle]

Accordions

Section 1

Sample Content

Section 2

Sample Content

[symple_accordion]
	[symple_accordion_section title="Section 1"]
		Sample Content
	[/symple_accordion_section]
	[symple_accordion_section title="Section 2"]
		Sample Content
	[/symple_accordion_section]
[/symple_accordion]

First tab content

Third Tab Content.

[symple_tabgroup]
	[symple_tab title="First Tab"]
	First tab content
	[/symple_tab]
	
	[symple_tab title="Second Tab"]
	Third Tab Content.
	[/symple_tab]
[/symple_tabgroup]