[wc_tabgroup class=”” layout=”box”]

[wc_tab title=”Shortcode examples”]

This page contains examples of many of the shortcodes available to you together with variations.

The more obvious shortcodes, such as columns, are not listed except for the 1/2 + 1/2 columns.

The area below each sample displays the codes used which can be copied and pasted to your editor window…

Remember to use the ‘paste as text’ icon.

[wc_spacing size=”20px” class=””][/wc_spacing]

[/wc_tab]

[wc_tab title=”Exceptions”]

Not all shortcodes are available to tutors!

Some shortcodes may appear in the list of dropdown values but they have been deactivated for tutors. The following are not available:-

  1. Content > HTML
  2. Content > Preformatted text
  3. Posts – all options not available
  4. Actions – all options not available
  5. Wrappers – all options not available
  6. [edit-selection]

[/wc_tab]

[/wc_tabgroup]

[wc_accordion collapse=”1″ leaveopen=”0″ class=”” layout=”box”]

[wc_accordion_section title=”Columns : 1/2 + 1/2″]

[wc_row]

[wc_column size=”one-half” position=”first”]

Sample Content

[/wc_column]

[wc_column size=”one-half” position=”last”]

Sample Content

[/wc_column]

[/wc_row]

[wc_pre name=”sc-column50-50″ scrollable=”0″ color=”1″ linenums=”0″ wrap=”0″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Buttons”]

Options : Each value can be edited after using the initial shortcode generator window.

URL = where the link goes to, TITLE = the tooltip seen when hovered, TARGET = either _blank or empty where _blank opens a new window and empty opens in the same window, REL = nofollow or empty where ‘nofollow’ tells search engines to ignore the link, ICON_LEFT or RIGHT = adds an icon, POSITION = the position of the button on the page, CLASS = optional extra CSS setting (advanced).

[wc_spacing size=”40px” class=””][/wc_spacing]

[wc_button type=”primary” url=”#” title=”Primary” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Primary[/wc_button] [wc_button type=”secondary” url=”#” title=”Secondary” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Secondary[/wc_button] [wc_button type=”inverse” url=”#” title=”Inverse” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Inverse[/wc_button] [wc_button type=”success” url=”#” title=”Success” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Success[/wc_button] [wc_button type=”warning” url=”#” title=”Warning” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Warning[/wc_button] [wc_button type=”danger” url=”#” title=”Warning” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Danger[/wc_button] [wc_button type=”info” url=”#” title=”Info” target=”” url_rel=”” icon_left=”” icon_right=”” position=”” class=””]Info[/wc_button]

[wc_button type=”danger” url=”https://www.mri.bund.de/de/home/” title=”Max Rubner-Institut” target=”blank” url_rel=”nofollow” icon_left=”external-link” icon_right=”” position=”” class=””]External link to Max Rubner-Institut[/wc_button] [wc_button type=”inverse” url=”https://technology-training.courses/news/” title=”News page” target=”” url_rel=”” icon_left=”newspaper-o” icon_right=”” position=”” class=””]Internal link to News page[/wc_button]

[wc_pre name=”sc-buttons” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Heading”]

Options : Each value can be edited after using the initial shortcode generator window.

TITLE = the words seen in the title, HEADING TYPE = H1 is considered the most import and H6 the least , MARGIN Top/Bottom = add spacing above and below the heading if required, TEXT ALIGN = positions the heading to the left or right, COLOR = sets a custom colour, ICON LEFT/RIGHT = adds an icon, SPACING = adds extra spacing between the icon and title.

[wc_spacing size=”40px” class=””][/wc_spacing]

[wc_heading title=”Plain H1 – default colour” heading_type=”h1″ margin_top=”” margin_bottom=”” text_align=”left” font_size=”” color=”” icon_left=”” icon_right=”” icon_spacing=”” class=””]

[wc_heading title=”H2 with custom colour and icon” heading_type=”h2″ margin_top=”” margin_bottom=”” text_align=”left” font_size=”” color=”#dd9933″ icon_left=”pencil” icon_right=”” icon_spacing=”” class=””]

[wc_heading title=”Sample Content” heading_type=”h3″ margin_top=”25px” margin_bottom=”25px” text_align=”right” font_size=”” color=”#8224e3″ icon_left=”” icon_right=”hand-o-left” icon_spacing=”30px” class=””]

[wc_pre name=”sc-headings” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Highlight”]

This line of text has [wc_highlight color=”blue” class=””] some words [/wc_highlight] highlighted to add emphasis!

This line of text has [wc_highlight color=”gray” class=””] some words [/wc_highlight] highlighted to add emphasis!

This line of text has [wc_highlight color=”green” class=””] some words [/wc_highlight] highlighted to add emphasis!

This line of text has [wc_highlight color=”red” class=””] some words [/wc_highlight] highlighted to add emphasis!

This line of text has [wc_highlight color=”yellow” class=””] some words [/wc_highlight] highlighted to add emphasis!

[wc_pre name=”sc-highlight” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Dividers”]

Options : Each value can be edited after using the initial shortcode generator window.

STYLE = line type, LINE = single or double, MARGIN Top/Bottom = space above and below.

[wc_spacing size=”40px” class=””][/wc_spacing]

[wc_row]

[wc_column size=”one-half” position=”first”]

Solid single : [wc_divider style=”solid” line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Dashed single : [wc_divider style=”dashed” line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Dotted single : [wc_divider style=”dotted” line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Image 1 single : [wc_divider style=”image” line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Image 2 single : [wc_divider style=”image2″ line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Image 3 single : [wc_divider style=”image3″ line=”single” margin_top=”” margin_bottom=”” class=””][/wc_divider]

[/wc_column]

[wc_column size=”one-half” position=”last”]

Solid double : [wc_divider style=”solid” line=”double” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Dashed double : [wc_divider style=”dashed” line=”double” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Dotted double : [wc_divider style=”dotted” line=”double” margin_top=”” margin_bottom=”” class=””][/wc_divider]

Image doubles – n/a

[/wc_column]

[/wc_row]

[wc_pre name=”sc-dividers” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Pricing Table”]

Set within 3 columns, so the code is used three times. Each value can be edited after using the initial shortcode generator window. Note the last column – it doesn’t have to be a ‘pricing’ table, think of it as an easy table!

[wc_row]

[wc_column size=”one-third” position=”first”]

[wc_pricing type=”primary” plan=”Primary” cost=”$19.99″ per=”per month” button_url=”#” button_text=”Sign Up” button_target=”” button_rel=”nofollow” class=””]

  • 30GB Storage
  • 512MB Ram
  • 10 databases
  • 1,000 Emails
  • 25GB Bandwidth

[/wc_pricing]

[/wc_column]

[wc_column size=”one-third”]

[wc_pricing type=”inverse” plan=”Inverse” cost=”$19.99″ per=”per month” button_url=”#” button_text=”Sign Up” button_target=”” button_rel=”nofollow” class=””]

  • 30GB Storage
  • 512MB Ram
  • 10 databases
  • 1,000 Emails
  • 25GB Bandwidth

[/wc_pricing]

[/wc_column]

[wc_column size=”one-third” position=”last”]

[wc_pricing type=”secondary” plan=”Glucose” cost=”Main Attributes” per=”non GMO” button_url=”#” button_text=”Sugar Weekly Magazine” button_target=”_blank” button_rel=”nofollow” class=””]

  • Sweetness
  • Granularity
  • Easy solution
  • Transportable
  • Colour options

[/wc_pricing]

[/wc_column]

[/wc_row]

[wc_pre name=”sc-pricing-table” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Skillbars”]

These can be used as progress markers, skills identifiers or even ingredients. Set here in a 1/3rd column and a 2/3rds column.

[wc_row]

[wc_column size=”one-third” position=”first”]

[wc_skillbar title=”HTML” percentage=”92″ color=”#6adcfa” show_percent=”1″ class=””]

[wc_skillbar title=”CSS2″ percentage=”87″ color=”#f2ccbb” show_percent=”1″ class=””]

[wc_skillbar title=”PHP” percentage=”63″ color=”#7bd659″ show_percent=”1″ class=””]

[wc_skillbar title=”Powerpoint” percentage=”68″ color=”#d42892″ show_percent=”1″ class=””]

[wc_skillbar title=”Excel” percentage=”76″ color=”#00a0e3″ show_percent=”1″ class=””]

[wc_skillbar title=”MS Windows” percentage=”81″ color=”#545454″ show_percent=”1″ class=””]

[wc_skillbar title=”WordPress” percentage=”52″ color=”#eeee22″ show_percent=”1″ class=””]

[/wc_column]

[wc_column size=”two-third” position=”last”]

[wc_skillbar title=”Pregelatinized starches” percentage=”55″ color=”#70efde” show_percent=”1″ class=””]

[wc_skillbar title=”Cross-linked starches” percentage=”49″ color=”#f084ff” show_percent=”1″ class=””]

[wc_skillbar title=”Oxidized starches” percentage=”72″ color=”#2767c6″ show_percent=”1″ class=””]

[wc_skillbar title=”Anionic starches” percentage=”54″ color=”#a3e067″ show_percent=”1″ class=””]

[wc_skillbar title=”Acetylated starches” percentage=”49″ color=”#eadf04″ show_percent=”1″ class=””]

[wc_skillbar title=”Dextrins” percentage=”72″ color=”#38179b” show_percent=”1″ class=””]

[wc_skillbar title=”Grafted starches” percentage=”87″ color=”#aa4446″ show_percent=”1″ class=””]

[/wc_column]

[/wc_row]

[wc_pre name=”sc-skillbars” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Images”]

Options : Each value can be edited after using the initial shortcode generator window. Setting some values will be trial and error!

ATTACHMENT ID =click into the field and start typing your image title, TITLE = this is the text seen on hover, ALT = text used when images turned off in a browser, CAPTION = additional description, LINK_TO = do not use, URL = until this allows _blank to open in a new window do not use, ALIGN = positions the image, SIZE = select the size of image from the list, TEXT_ALIGN = positions text withing the background, FLAG = the label or words seen, LEFT/right/top/bottom = positions the flag, TEXT_COLOR = the text colour, BACKGROUND_COLOR = background colour, FLAG_WIDTH = sets the width of the flag containing your words.

[wc_spacing size=”40px” class=””][/wc_spacing]

[wc_row]

[wc_column size=”one-third” position=”first”]

[wc_image attachment_id=”3107″ title=”Wheat Grain cut-away” alt=”Wheat Grain” caption=”” link_to=”” url=”” align=”” size=”full” text_align=”center” flag=”Insert Any Text” left=”20″ right=”0″ top=”0″ bottom=”0″ text_color=”#ffffff” background_color=”#000000″ flag_width=”200″ class=””][/wc_image]

[/wc_column]

[wc_column size=”one-third”]

[wc_image attachment_id=”3107″ title=”Wheat Grain cut-away” alt=”Wheat Grain” caption=”” link_to=”” url=”” align=”” size=”full” text_align=”center” flag=”Wheat Grain cut-away” left=”160″ right=”0″ top=”0″ bottom=”60px” text_color=”#ffffff” background_color=”#dd3333″ flag_width=”195″ class=””][/wc_image]

[/wc_column]

[wc_column size=”one-third” position=”last”]

[wc_image attachment_id=”3107″ title=”Wheat Grain cut-away” alt=”Wheat Grain” caption=”Caption Added ” link_to=”” url=”” align=”right” size=”full” text_align=”center” flag=”Wholewheat” left=”0″ right=”177″ top=”0″ bottom=”199px” text_color=”#ffffff” background_color=”#235db3″ flag_width=”115″ class=””][/wc_image]

[/wc_column]

[/wc_row]

[wc_pre name=”sc-images” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[wc_accordion_section title=”Boxes”]

[wc_row]

[wc_column size=”two-third” position=”first”]

Inside a 2/3 column

[wc_box color=”primary” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Primary Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”secondary” text_align=”right” margin_top=”” margin_bottom=”” class=””]

Secondary Box with text aligned to the right and no margins top or bottom have been set

[/wc_box]

[wc_box color=”inverse” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Inverse Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”success” text_align=”center” margin_top=”50px” margin_bottom=”50px” class=””]

Success Box with text aligned to the centre and 50px margins set for both top and bottom.

The MARGIN puts a gap above (top) or below (bottom) of your box.

[/wc_box]

[wc_box color=”warning” text_align=”right” margin_top=”” margin_bottom=”90px” class=””]

Warning Box with text aligned to the right and no top margins but a 90px bottom margin

[/wc_box]

[wc_box color=”danger” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Danger Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”info” text_align=”center” margin_top=”330px” margin_bottom=”” class=””]

Info Box with text aligned to the centre and a 330px top margin have been set

[/wc_box]

[/wc_column]

[wc_column size=”one-third” position=”last”]

Inside a 1/3rd column

[wc_box color=”primary” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Primary Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”secondary” text_align=”right” margin_top=”” margin_bottom=”” class=””]

Secondary Box with text aligned to the right and no margins top or bottom have been set

[/wc_box]

[wc_box color=”inverse” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Inverse Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”success” text_align=”center” margin_top=”50px” margin_bottom=”50px” class=””]

Success Box with text aligned to the centre and 50px margins set for both top and bottom. The MARGIN puts a gap above (top) or below (bottom) of your box.

[/wc_box]

[wc_box color=”warning” text_align=”right” margin_top=”” margin_bottom=”30px” class=””]

Warning Box with text aligned to the right and no top margins but a 30px bottom margin

[/wc_box]

[wc_box color=”danger” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Danger Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[wc_box color=”info” text_align=”left” margin_top=”” margin_bottom=”” class=””]

Info Box with text aligned to the left and no margins top or bottom have been set

[/wc_box]

[/wc_column]

[/wc_row]

[wc_pre name=”sc-boxes” scrollable=”0″ color=”1″ linenums=”0″ wrap=”1″][/wc_pre]

[/wc_accordion_section]

[/wc_accordion]