This page will show you how to insert components on a full-width page template properly.
It will also show you what snippets these components must be contained within in order
to display properly on this type of template. Pay close attention to the descriptions
below and always follow the red helper text in each snippet!
This is an Interior Container Snippet used on full-width pages. It's a simple container that allows you to change the color of your section background to white, gold or gray and also allows for WYSIWYG editing, inserting images, inserting videos, etc.
This is an (Any Page) Video - YouTube Embed component.
Select it from the components icon in your toolbar!
This is an Info Card snippet that is inside an Interior Container snippet. These two must be used together in order to properly display within our standard
website margines. Be sure to look for the red helper text inside snippets for reminders
how to use snippets correctly! You can add more cards to this snippet. To do this,
go to the snippet options menu, select the fourth icon in the snippet menu that has
the + sign at the bottom of the icon.
Lorem ipsum
Lorem ipsum
Lorem ipsum
Similar to the Info Card snippet, the FAQ Accordian snippet is designed to be used within an Interior Container snippet. You can add as many rows as you'd like to your accordian. To do this, find the snippet option menu, select the fourth icon in the snippet menu that has the + sign at the bottom of the icon.
This is a callout snippet that is designed to be used within an Interior Container snippet in order to display correctly.
Business Accreditation
You simply upload a photo at 2210 px wide. If you have a large amount of text, you will likely need to upload a taller photo. For reference, the photo behind this text is 500px tall. This container is designed to be used independently so that it extends the full screen without white space on the site. Therefore, you do not need to use this snippet within another snippet container.
A Note About Parallax Images
To avoid accessibility contrast errors, try using a photo for your paralax that has a dark color overlay overtop. This one as a dark blue overlay that was created inside of Canva. If you do not have a licence for Canva and wish to be added, please contact creativeservices@uwyo.edu and they will send you pricing and information on joining UW's enterprise license.
You can also choose to have a solid brown bacgkround for your paralax without an image. Simply leave the photo selection blank and select Brown in the background color option above.
PLEASE NOTE: Avoid using the blue background as this can create a contrast issue.
This container is designed to be used independently so that it extends the full screen without white space on the site. Therefore, you do not need to use this snippet within another interior container snippet.
Insert an image, like this one below, by using the insert/edit image button from the main toolbar.
This is a 2-Column Row snippet. This is great for displaying side-by-side information including images and text.
Snippets using more than one (1) column must be placed inside an Interior Container snippet if it is in a section below the intro content of a full-width template.
You can add buttons by using the (Any Page) Button with Two Color Options component.
Note: Each button must be on its own line.
This is a 3-Column Row snippet which can be used on this page template, however it is not recommended on two-column
page templates. This is great for displaying three sets of related information as
needed. Snippets using more than one (1) column, like this one, must be placed inside an Interior Container snippet if it is in a section below the intro content of a full-width template.
Insert text or images to the recomended size by followng the helper text in the snippet. To link photos or text, use the insert/edit link button from the main toolbar.
This is a 4-Column Row snippet which can be used on this page template, however it is not recommended on two-column
page templates. This is great for displaying related information in a concise format.
Snippets using more than one (1) column, like this one, must be placed inside an Interior Container snippet if it is in any section below the intro content of a full-width template.
Insert text and/or images to the recomended size by followng the helper text in the snippet. To link photos or text, use the insert/edit link button from the main toolbar.
INFORMATION ICON #1
This is some info about this icon.
INFORMATION ICON #2
This is some info about this icon.
INFORMATION ICON #3
This is some info about this icon.
INFORMATION ICON #4
This is some info about this icon.
This component must be used inside an Interior Container snippet when inserted in a section below the intro section. You can add as many rows of two (2) in this component, as you'd like. Within the component editor, you can add links and captions as needed to each image.
This component must be used inside an Interior Container snippet when inserted in a section below the intro section. You can add multiple graphics to the infographic for a "sliding" effect. Graphic icons must be provided by site editor. Within the component editor, you can add links and captions as needed to each image.
Optional Title Here
This is an optional subtitle.
This is a Title
This is another subtitle.
Title Here
This is a subtitle.
Optional Title Here
This is another subtitle.
This component must be used inside an Interior Container snippet when inserted in a section below the intro section. You can only add a total of three images in this individual snippet. If you wish to add multiple lines of a row of three (3), simply add another component of the same type below the exising one. Within the component editor you can add links and captions to each image as needed.
This component must be placed inside a snippet. It is typically used in once of the columns of a 2-Column Row snippet so that accompanying WYSIWYG text can be added in the other column. You can add multiple images in the Image Slider component for a scrolling effect. This component does not display captions text within the photos.
This is a some text you can put here in the second column of the 2-column row snippet. An example is this bulleted list.
This component must be used inside an Interior Container snippet when inserted in a section below the intro section. You can add up to 10 slider images in this component, but you must have a minimum of four (4). Within the component editor you can link each image as needed. Recomended sizing for images is also provided in each component editor.
This component must be used inside an Interior Container snippet when inserted in a section below the intro section. You may insert up to nine (9) photos and caption them by following the prompts in the component editor. To view Photo Gallery captions you may hover over the image or click on it to expand into a slider view.
Department Name
Address
Department #
(XXX) XXX-XXXX
Email: email@uwyo.edu