Table of contents
Orange Themes

Shortcodes

There is a huge variety of shortcodes available in the Portus theme, here below we will list all of them. The live demo can be visible at http://portus.orange-themes.com/shortcodes/.

Image with caption

Image with caption

[ot-caption title="Photo by Modestas Urbonas, CC0 License" url="http://portus.orange-themes.com/wp-content/uploads/2016/01/technology-music-sound-things.jpg"]

Photo gallery preview

[ot-gallery url="http://portus.orange-themes.com/gallery/vel-sumo-everti-graecis-probas-consulatu-nostrum/"]

Responsive video embeds

Responsive video embeds

[row][6_of_12][ot-video]<iframe src="https://www.youtube.com/embed/NG2utrMwTyY" width="853" height="480" frameborder="0" allowfullscreen="allowfullscreen"></iframe>[/ot-video][/6_of_12][6_of_12][ot-video] <iframe src="http://player.vimeo.com/video/119151174?color=2980b9" width="820" height="461" frameborder="0" allowfullscreen="allowfullscreen"></iframe>[/ot-video][/6_of_12] [/row]

Content spacers

Content spacers

[spacer color="264C84" icon="fa-glass" text="" style="1"]
[spacer color="801984" icon="Select a Icon" text="CUSTOM TEXT" style="1"]
[spacer color="264C84" icon="fa-calendar" text="" style="2"]
[spacer color="498466" icon="fa-lemon-o" text="" style="3"]

Color - HEX code Icon - font awesome icon class https://fortawesome.github.io/Font-Awesome/icons/

Blockquote styles

Image with caption

[blockquote type="default" style="1"]Id mutat commodo voluptua eos, et vel dico aeterno vivendum, petentium disputationi et per. Vix veniam oluptaria no, per tation corrumpit no. Delenit adipiscing quo an, te est erant nonumes omittantur. Te per debet liberavisse, qui eu minimum noluisse. An inani vocibus verterem pri, graeco scriptorem est eu.[/blockquote]

[blockquote type="reverse" style="1"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.[/blockquote]

[blockquote type="default" style="2"]Id mutat commodo voluptua eos, et vel dico aeterno vivendum, petentium disputationi et per. Vix veniam oluptaria no, per tation corrumpit no. Delenit adipiscing quo an, te est erant nonumes omittantur. Te per debet liberavisse, qui eu minimum noluisse. An inani vocibus verterem pri, graeco scriptorem est eu.[/blockquote]

Unordered & Ordered lists

Image with caption

[row][6_of_12]
<h3>Unordered List</h3>
[list][item icon="fa-music" ]Mauris elit erat, laoreet ac posuere eget, blandit at nunc[/item][item icon="fa-italic" ]Vestibulum vitae justo nisi[/item][item icon="fa-comments" ]Donec ornare dapibus ante ut porttitor nam sit amet[/item][item icon="fa-puzzle-piece" ]Aliquam vestibulum condimentum leo, vel porta sapien[/item][/list]
[/6_of_12][6_of_12]
<h3>Ordered List</h3>
<ol>
    <li>Regione saperet ad qui, mea ex summo, assentior efficiendi</li>
    <li>Quodsi eirmod postulant usu pri possit labores partiendo</li>
    <li>Ne insolens sadipscing platonem facilisis pertinacia duo</li>
    <li>At has purto malis suscipiantur, vero iusto ea qui</li>
</ol>
[/6_of_12] [/row]

Icon - font awesome icon class https://fortawesome.github.io/Font-Awesome/icons/

Bootstrap table

Image with caption

Can be created as a table in the wordpress editor or with following code in text mode:



<table class="table table-striped">
<thead>
<tr>
<th>Main Header 1</th>
<th>Main Header 2</th>
<th>Main Header 3</th>
<th>Main Header 4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Text 1</td>
<td>Text 2</td>
<td>Text 3</td>
<td>Text 4</td>
</tr>
<tr>
<td>Text 1</td>
<td>Text 2</td>
<td>Text 3</td>
<td>Text 4</td>
</tr>
<tr>
<td>Text 1</td>
<td>Text 2</td>
<td>Text 3</td>
<td>Text 4</td>
</tr>
<tr>
<td>Text 1</td>
<td>Text 2</td>
<td>Text 3</td>
<td>Text 4</td>
</tr>
</tbody>
</table>

Colorful buttons (unlimited colors)

Image with caption

[button link="" icon="Select a Icon" side="left" type_color="button-background" target="" color="337ab7" textcolor="ffffff"]Default button[/button] 
[button link="" icon="fa-chevron-right" side="left" type_color="button-background" target="" color="c23a28" textcolor="ffffff"]Red button[/button] 
[button link="" icon="fa-check-square-o" side="right" type_color="button-background" target="" color="8cac2b" textcolor="ffffff"]Green Button[/button] 
[button link="" icon="fa-trophy" side="left" type_color="button-background" target="" color="e88817" textcolor="ffffff"][/button] 
[button link="" icon="Select a Icon" side="left" type_color="button-background" target="" color="63b78d" textcolor="ffffff"]Any color from pallete[/button]
[button link="" icon="Select a Icon" side="left" type_color="button-outline" target="" color="337ab7" textcolor="337ab7"]Default button[/button] 
[button link="" icon="fa-chevron-right" side="left" type_color="button-outline" target="" color="c23a28" textcolor="c23a28"]Red button[/button] 
[button link="" icon="fa-check-square-o" side="right" type_color="button-outline" target="" color="8cac2b" textcolor="8cac2b"]Green Button[/button] 
[button link="" icon="fa-trophy" side="left" type_color="button-outline" target="" color="e88817" textcolor="e88817"][/button] 
[button link="" icon="Select a Icon" side="left" type_color="button-outline" target="" color="63b78d" textcolor="63b78d"]Any color from pallete[/button]

Text marker

Image with caption

Pri inani voluptua dissentiet ea, an [textmarker color="FF7A4A"]his ad[/textmarker] tibique praesent <a class="custom-link" href="http://Portustheme.com/html/inner/shortcodes.html#">orange-themes.com</a> vel. Utamur pertinacia ullamcorper vix in, nam debet ludus aperiri at. No pri exerci graeci, duis malis phaedrum eu sed, ut mel vivendum signiferumque. Ea summo vitae eleifend eos. Sit his ad ex [textmarker color="000000"]aeterno suscipit[/textmarker], cum soleat delectus in.

Tabbed blocks

Image with caption

[tabs style="1"][tab][tab_title][icon icon='fa-star'] Equidem suscipiantur[/tab_title]
<h2 style="text-align: center;">[icon icon='fa-star']</h2>
<h5 style="text-align: center;">Equidem suscipiantur</h5>
<p style="text-align: center;">Iudico eripuit conceptam ad eam. Equidem suscipiantur vel ut, nisl solum temporibus nam no, natum oportere in has. Per iusto epicurei ad. Partem copiosae maiestatis mei cu. [/tab][tab][tab_title][icon icon='fa-share'] Aeterno laboramus[/tab_title]</p>

<h2 style="text-align: center;">[icon icon='fa-share']</h2>
<h5 style="text-align: center;">Aeterno laboramus</h5>
<p style="text-align: center;">Et pri etiam molestiae, ornatus petentium voluptatibus mel ei. Illum laoreet ocurreret vix ea. No quaeque alterum propriae qui, modo congue cotidieque vel. [/tab][tab][tab_title][icon icon='fa-power-off'] Adipisci comprehens[/tab_title]</p>

<h2 style="text-align: center;">[icon icon='fa-power-off']</h2>
<h5 style="text-align: center;">Adipisci comprehens</h5>
<p style="text-align: center;">Everti eloquentiam duo eu, ei vel fugit delenit copiosae. Ius omnesque comprehensam te, iriure gubergren referrentur ex cum. Et pri etiam molestiae, ornatus petentium voluptatibus mel ei. [/tab][tab][tab_title][icon icon='fa-meh-o'] Conceptam ad eam[/tab_title]</p>

<h2 style="text-align: center;">[icon icon='fa-meh-o']</h2>
<h5 style="text-align: center;">Conceptam ad eam</h5>
<p style="text-align: center;">Usu nonumy numquam te, regione scribentur nec ei. Unum clita antiopam ut qui. Eum id nostrud interpretaris. No quando aliquip forensibus mel, eu nullam nemore dissentiet mea.[/tab][/tabs]</p>


[tabs style="2"][tab][tab_title]First Tab Active[/tab_title]Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, nobis, necessitatibus, et accusamus officia eum voluptatem delectus provident dolor laborum illum id at. Iure tenetur voluptates hic deserunt possimus ipsam.


[button link="" icon="Select a Icon" side="left" type="square" type_color="button-background" size="big" target="" color="4f4f4f" textcolor="ffffff"]Dark button[/button][/tab][tab][tab_title]The Second &amp; a Bit Longer Tab[/tab_title]Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, nobis, necessitatibus, et accusamus officia eum voluptatem delectus provident dolor laborum illum id at. Iure tenetur voluptates hic deserunt possimus ipsam.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, nobis, necessitatibus, et accusamus officia eum voluptatem delectus provident dolor laborum illum id at. Iure tenetur voluptates hic deserunt possimus ipsam. [/tab][tab][tab_title]Ne est menandri[/tab_title]Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, nobis, necessitatibus, et accusamus officia eum voluptatem delectus provident dolor laborum illum id at. Iure tenetur voluptates hic deserunt possimus ipsam.


[button link="" icon="Select a Icon" side="left" type="square" type_color="button-background" size="big" target="" color="4f4f4f" textcolor="ffffff"]Dark button[/button][/tab][/tabs]

Accordion blocks

Image with caption

[accordion][acc title="No quaeque alterum propriae qui modo congue cotidieque vel"]Everti eloquentiam duo eu, ei vel fugit delenit copiosae. Ius omnesque comprehensam te, iriure gubergren referrentur ex cum. Et pri etiam molestiae, ornatus petentium voluptatibus mel ei. Illum laoreet ocurreret vix ea. No quaeque alterum propriae qui, modo congue cotidieque vel.


[button link="" icon="Select a Icon" side="left" type="square" type_color="button-background" size="big" target="" color="4f4f4f" textcolor="ffffff"]Dark button[/button] [/acc][acc title="Vitae eleifend eos sit ex aeterno suscipit cum soleat delectus in"]Atqui graeci consequat eum ei. Definiebas theoph us mel ei, mel id mazim efficiendi. Nec an quod apeirian. Dolores omnesque liberavisse te vis. Stet nibh illud ei duo. [/acc][acc title="Perpetu repudiare em eruditi scripsert"]Atqui graeci consequat eum ei. Definiebas theoph us mel ei, mel id mazim efficiendi. Nec an quod apeirian. Dolores omnesque liberavisse te vis. Stet nibh illud ei duo. [/acc][acc title="Illum laoreet ocurreret vix ea no quaeque alterum propriae qui modo congue"]Atqui graeci consequat eum ei. Definiebas theoph us mel ei, mel id mazim efficiendi. Nec an quod apeirian. Dolores omnesque liberavisse te vis. Stet nibh illud ei duo.[/acc][/accordion]

Toggle block (show/hide)

Image with caption

[toggles title="Perpetu repudiare em eruditi scripsert"]Atqui graeci consequat eum ei. Definiebas theoph us mel ei, mel id mazim efficiendi. Nec an quod apeirian. Dolores omnesque liberavisse te vis. Stet nibh illud ei duo.[/toggles]

Alert & Notification messages

Image with caption

[alert color="A3C12A" type="alert-message-background" title="" size="small"]Success!  This a success message[/alert]

[alert color="E14840" type="alert-message-background" title="" size="small"]Error! This an error message[/alert]

[alert color="F0B528" type="alert-message-background" title="" size="small"]Warning! This a warning message[/alert]

[alert color="A3C12A" type="alert-message-background" title="Some red error message with title &amp; context" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

[alert color="E14840" type="alert-message-background" title="Error! This an error message" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

[alert color="F0B528" type="alert-message-background" title="Warning! This a warning message" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

[alert color="A3C12A" type="alert-message-outline" title="Some red error message with title &amp; context" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

[alert color="E14840" type="alert-message-outline" title="Error! This an error message" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

[alert color="F0B528" type="alert-message-outline" title="Warning! This a warning message" size="big"]Vide adversarium reprehendunt ad pro, eos et aliquid facilisis. Pro ut sumo indoctum adversarium cum suavitate instructior, corrumpit forensibus ea mei[/alert]

Social icons

Image with caption

[social title="Flickr" subtitle="Follow us" link="#" icon="fa-flickr"][social title="Twitter" subtitle="Follow us" link="#" icon="fa-twitter"][social title="Facebook" subtitle="Follow us" link="#" icon="fa-facebook"][social title="Google+" subtitle="Follow us" link="#" icon="fa-google-plus"][social title="Pinterest" subtitle="Follow us" link="#" icon="fa-pinterest"]

[social title="Instagram" subtitle="Follow us" link="#" icon="fa-instagram"][social title="LinkedIn" subtitle="Follow us" link="#" icon="fa-linkedin"][social title="Dribbble" subtitle="Follow us" link="#" icon="fa-dribbble"][social title="Skype" subtitle="Follow us" link="#" icon="fa-skype"][social title="Tumblr" subtitle="Follow us" link="#" icon="fa-tumblr"]

[social title="Vimeo" subtitle="Follow us" link="#" icon="fa-vimeo-square"][social title="vKontakte" subtitle="Follow us" link="#" icon="fa-vk"][social title="YouTube" subtitle="Subscribe" link="#" icon="fa-youtube"]

Paragraph grids

Image with caption

[row][6_of_12]
<h4>Column 1/2</h4>
Pro ridens tibique aliquando cu. Brute novum vocibus ex pro, deleniti rationibus disputando te quo. Tation electram abhorreant et mei. Ad lucilius mnesarchum quo. Eum ut cetero dolorem senserit.

[/6_of_12][6_of_12]
<h4>Column 1/2</h4>
Pro ridens tibique aliquando cu. Brute novum vocibus ex pro, deleniti rationibus disputando te quo. Tation electram abhorreant et mei. Ad lucilius mnesarchum quo. Eum ut cetero dolorem senserit.

[/6_of_12] [/row]

[row][4_of_12]
<h4>Column 1/4</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem appellantur, dissentiunt accommodare no vis. Pri prompta conclud.

[/4_of_12][4_of_12]
<h4>Column 1/4</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem appellantur, dissentiunt accommodare no vis. Pri prompta conclud.

[/4_of_12][4_of_12]
<h4>Column 1/4</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem appellantur, dissentiunt accommodare no vis. Pri prompta conclud.

[/4_of_12][/row]

[row][3_of_12]
<h4>Column 1/3</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem accommodare no vis. Pri prompta conclud.

[/3_of_12][3_of_12]
<h4>Column 1/3</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem accommodare no vis. Pri prompta conclud.

[/3_of_12][3_of_12]
<h4>Column 1/3</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem accommodare no vis. Pri prompta conclud.

[/3_of_12][3_of_12]
<h4>Column 1/3</h4>
Usu erat mazim altera in, tacimats regione indoctum, usu cu lorem accommodare no vis. Pri prompta conclud.

[/3_of_12][/row]