JGU Content Layout – Tabs (Target group-Navigation) Red horizontal button list

Here you find an example for structuring you content with a red horizontal button list like the Target Navigation.

You have to activate the Plugin JGU Content Layout!

Contents

  1. Live-Beispiel
  2. Source Code Example
  3. Using Tabs
    1. Shortcode jgu_content_layout
    2. Shortcode jgu_content_layout_item

Live-Beispiel

Try our demo: → JGU Content Layout -Tabs (Target group-Navigation) Red horizontal button list

Source Code Example

Copy and paste into your page:


Text Block #1
Content


Text Block #2
The content of this button is opened. Only one Block may have the status "open" 

Text Block #3
The Content

Text Block #4
Content 

Text Block #5
This Element is the most useful not too few Buttons.

Using Tabs

Shortcode jgu_content_layout

The Shortcode [jgu_content_layout] spans the whole content that should appear on the page. After the last content there has to be the Shortcode  [/jgu_content_layout] You will get  a red button row with the parameter display="zgn".

Example: [jgu_content_layout display="tab" layout="zgn"]...[/jgu_content_layout]

Replace the dots in the example above with the following Shortcode [jgu_content_layout_item].

Shortcode jgu_content_layout_item

The Shortcode [jgu_content_layout_item] spans the content behind each button and has to be ended with [/jgu_content_layout_item] You may format the text.

The Shortcode is specified via the parameters:

  1. Parameter: title
    Function: Button Text
    Example: [jgu_content_layout_item title="Test"]Example-Text[/jgu_content_layout_item]
  2. Parameter: status
    Function: define, the content of whicht button should be open on entering the web page.
    Values: open. If the parameter is not set, the content behind the button is not visible
    Attention ❗: There may be only one button with the value open
    Example: [jgu_content_layout_item status="open"]Example-Text[/jgu_content_layout_item]