Working examples

This is not a Government of Canada website

The purpose of this website is to provide a working example of the WET-BOEW-Moodle theme created by TNG Consulting Inc. together with the Government of Canada. Demo courses are only available in English however multi-language courses are supported.

Tabbed interface

Style guide information

Example 1

With session storage to remember last tab viewed. (Default behaviour)

Panel 1

Curabitur eleifend condimentum dui, vel dictum ante cursus ac. Proin facilisis purus neque, et egestas metus hendrerit non. Phasellus mollis arcu ut metus placerat, in blandit ligula tincidunt. Etiam vitae metus risus. Mauris lacinia mauris cursus sollicitudin placerat. Mauris malesuada vel justo a laoreet. Nulla facilisi. Nullam ac finibus nibh. Ut et nulla vel dolor imperdiet dapibus. Duis semper risus non nibh porta, id vulputate justo tempor.

Panel 2

Curabitur id risus dui. Ut fringilla libero in sem placerat aliquam. Ut justo magna, malesuada vitae posuere in, sodales nec lorem. In fringilla augue quis nunc tristique, quis placerat diam pellentesque. Suspendisse et vulputate diam, vel molestie massa. Etiam mollis blandit metus ut cursus. Fusce sodales, orci non tempus maximus, lorem quam condimentum leo, quis tincidunt nulla massa vitae elit. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus ligula lorem, pulvinar eu ex sit amet, luctus volutpat justo. In posuere, nibh sed posuere rutrum, felis lorem lobortis sem, ac cursus lectus ex id libero. Sed laoreet, tortor sit amet pellentesque convallis, lectus felis imperdiet neque, in placerat purus nisi nec massa. Aliquam semper risus ac ante finibus, feugiat sagittis nisi feugiat. Proin ac venenatis felis. Duis ante velit, cursus sit amet lacus eu, facilisis viverra massa. Vestibulum arcu elit, lacinia nec malesuada sit amet, luctus tincidunt velit.

Panel 3

Integer molestie turpis imperdiet, imperdiet tortor ut, condimentum ante. Mauris ac suscipit neque. Fusce mollis, turpis sit amet volutpat semper, massa felis vestibulum metus, at pretium diam risus ac lectus. Suspendisse elementum sapien finibus, aliquam enim ut, sagittis eros. Interdum et malesuada fames ac ante ipsum primis in faucibus. Mauris pharetra velit vel pharetra malesuada. Pellentesque id dapibus ex. Curabitur nunc massa, sagittis eu leo quis, maximus consequat arcu.

Show the third panel

Example 2

With ignore-session class. This will prevent the last selected tab from being remembered at a subsequent page load. (With class or data-wb-tabs attribute.)

Panel 1

Curabitur eleifend condimentum dui, vel dictum ante cursus ac. Proin facilisis purus neque, et egestas metus hendrerit non. Phasellus mollis arcu ut metus placerat, in blandit ligula tincidunt. Etiam vitae metus risus. Mauris lacinia mauris cursus sollicitudin placerat. Mauris malesuada vel justo a laoreet. Nulla facilisi. Nullam ac finibus nibh. Ut et nulla vel dolor imperdiet dapibus. Duis semper risus non nibh porta, id vulputate justo tempor.

Panel 2

Curabitur id risus dui. Ut fringilla libero in sem placerat aliquam. Ut justo magna, malesuada vitae posuere in, sodales nec lorem. In fringilla augue quis nunc tristique, quis placerat diam pellentesque. Suspendisse et vulputate diam, vel molestie massa. Etiam mollis blandit metus ut cursus. Fusce sodales, orci non tempus maximus, lorem quam condimentum leo, quis tincidunt nulla massa vitae elit. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus ligula lorem, pulvinar eu ex sit amet, luctus volutpat justo. In posuere, nibh sed posuere rutrum, felis lorem lobortis sem, ac cursus lectus ex id libero. Sed laoreet, tortor sit amet pellentesque convallis, lectus felis imperdiet neque, in placerat purus nisi nec massa. Aliquam semper risus ac ante finibus, feugiat sagittis nisi feugiat. Proin ac venenatis felis. Duis ante velit, cursus sit amet lacus eu, facilisis viverra massa. Vestibulum arcu elit, lacinia nec malesuada sit amet, luctus tincidunt velit.

Panel 3

Integer molestie turpis imperdiet, imperdiet tortor ut, condimentum ante. Mauris ac suscipit neque. Fusce mollis, turpis sit amet volutpat semper, massa felis vestibulum metus, at pretium diam risus ac lectus. Suspendisse elementum sapien finibus, aliquam enim ut, sagittis eros. Interdum et malesuada fames ac ante ipsum primis in faucibus. Mauris pharetra velit vel pharetra malesuada. Pellentesque id dapibus ex. Curabitur nunc massa, sagittis eu leo quis, maximus consequat arcu.

Last modified: Wednesday, 11 December 2019, 12:18 PM
Date modified: