Shortcodes

Shortcodes and UI Elements

Using combination of different shortcodes to generated various user interface elements e.g. tabs, lists etc. you can create totally differently layouts for the text pages. All what is needed is a little bit creativity.

[tabs tabs=”Education,Jobs,Skills”][tabscontent][tabcontent id=”education” class=”active”]Tab-1 content goes here[/tabcontent][tabcontent id=”jobs”]Tab-2 content goes here[/tabcontent][tabcontent id=”skills”]Tab-3 content goes here[/tabcontent][/tabscontent]

Sed sed leo sit amet elit sagittis fermentum. Nulla posuere commodo erat. Nam ac nunc ipsum, id espara tincidunt orci. Quisque adipiscing molestie dolor, ut congue sem porta et.

[accordion id=”optional-id”]
[accordiontab title=”Tab 1″]Tab 1 content goes here[/accordiontab]
[accordiontab title=”Tab 2″]Tab 2 content goes here[/accordiontab]
[accordiontab title=”Tab 3″]Tab 3 content goes here[/accordiontab]
[accordiontab title=”Tab 4″]Mauris a tempor tellus. Sed feugiat sem ac tellus mollis rhoncus. Nunc ante diam, tincidunt in bibendum id, porttitor ac justo. Sed felis urna, imperdiet ac molestie eu, interdum eget elit. Aenean dui diam, adipiscing nec tincidunt eget, cursus et tortor. Sed sollicitudin gravida dui.[/accordiontab]
[accordiontab title=”Tab 5″]Mauris a tempor tellus. Sed feugiat sem ac tellus mollis rhoncus. Nunc ante diam, tincidunt in bibendum id, porttitor ac justo. Sed felis urna, imperdiet ac molestie eu, interdum eget elit. Aenean dui diam, adipiscing nec tincidunt eget, cursus et tortor. Sed sollicitudin gravida dui.[/accordiontab]
[/accordion]

 

[toggle title=”Toggle Title”]Toggle content goes here[/toggle]
[toggle title=”Toggle Title”]Toggle content goes here[/toggle]
[toggle title=”Toggle Title”]Toggle content goes here[/toggle]

 

[list type=”arrow”]

  • List Item 1
  • List Item 2
  • List Item 3

[/list]

 

[alert]standard alert content goes here[/alert]
[alert type=”warning”]warning alert content goes here[/alert]
[alert type=”success”]success alert content goes here[/alert]
[alert type=”error”]error alert content goes here[/alert]

 

[button label=”Small Round Button” link=”https://google.com”]
[button label=”Large Round Button” link=”https://google.com” size=”large”]
[button label=”Small Square Button” link=”https://google.com” shape=”square”]
[button label=”Large Square Button” link=”https://google.com” shape=”square” size=”large”]

Leave a Reply

Your email address will not be published.