Tabs

Examples of Tab Layouts

• Dates and deadlines for academic years on International Programs/Current Students/Dates & Deadlines page

Accessing Tab Layout Snippets

• Login to OU Campus and check out page
• Click green edit button to enter editable region
• click 'Show Gadgets' icon at top right of page
• Click 'Snippets' dropdown to display available snippets. Sort by 'all', or by 'Table Transforms'.
• Select desired Tab snippet ( Tabs Horizontal, or Tabs Vertical). Scroll down this page for descriptin of each type.

 

Inserting Tab Layout Snippets

• In edit mode, place your cursor on your page where you want to insert a tab layout
• Click 'show Gadgets' icon at top right of page
• Click 'Snippets' dropdown to display available snippets. Sort by 'all', or by 'Table Transforms'.
• Select desired Tab snippet ( Tabs Horizontal, or Tabs Vertical). Scroll down this page for descriptin of each type.
• Dialog box showing layout for selected tab snippet will appear. Click 'Insert'.
• Tab layout will be placed on your page.
• Replace placeholder content with your own content.
• Save and submit for publish.

How to Modify Existing Tab Layouts

As part of routine website maintenance you will need to add or delete tab rows.

Add Row

• Right click in row you wish to add, and select 'Row/Insert Row Before', or Row/Insert Row After'
• Selected row will be added.

Delete Row

1. Right click in row you wish to delete, and select 'Row/Delete Row'.
2. Selected row will be deleted.

Examples of Unmodified Tab Layouts

Tabs Horizontal

This tab layout places 3 initial tabs across your page. More may be added, as needed.

Tabs Vertical

This tab layout places 3 initial tabs down your page. More may be added, as needed.