Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Snippet Glossary
Welcome to the Snippet Glossary. This resource is intended to be a visual reference that displays how Snippets will look and operate on the page.
- 50/50 Two Column Text Snippet
- 50/50 Two Column Text Snippet (Reverse Layout on Mobile)
- Three Column Text Snippet
- Three Column List Snippet
- Accordion Snippet
- Image with Overlay Snippet
- Contact Info Two Column Snippet
- Contact Info One Column Snippet
- Button Snippet
- Single Event Snippet
- Multiple Events Snippet
50/50 Two Column Snippet
Insert Column One Content.
This is the first (or left-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down and be placed above the second(or right-hand) column.
Insert Column Two Content.
This is the second (or right-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down and be placed under the
first (or left-hand) column.
50/50 Two Column Snippet (Reverse Layout on Mobile)
This is the first (or left-side) column of a two-column snippet where content can be placed.
In the page's responsive design, this column will scale down and be placed under the second (or right-hand) column.
This is the second (or right-side) column of a two-column snippet where content can be placed.
In the page's responsive design, this column will scale down and be placed above the first (or left-hand) column.
Three Column Snippet
Insert Column One Content.
This is the first (or left-side) column of a three-column snippet where content can
be placed.
In the page's responsive design, this column will scale down and be placed above the second (or middle) column.
Insert Column Two Content.
This is the second (or middle) column of a three-column snippet where content can
be placed.
In the page's responsive design, this column will scale and be placed under the first
(or left-hand) column
Insert Column Three Content.
This is the third (or right-side) column of a three-column snippet where content can be placed.
In the page's responsive design, this column will shrink down and be placed under the middle column.
Three Column List Snippet
- Replace content when a bulleted list is needed.
- This is the first (or left-side) column of a three-column snippet where content can be placed.
- To add a bullet, simply hit the "Return" key.
- This is the second (or middle) column of a three-column snippet.
- In the page's responsive design, this column will scale down and be placed under the first (or left-hand) column
- To add a bullet, simply hit the "Return" key.
- This is the third (or right-side) column of a three-column snippet.
- In the page's responsive design, this column will scale down and be placed under the middle column.
- To add a bullet, simply hit the "Return" key.
Accordion Snippet
Right click a table cell to select deletion of a row or column in order to size the table according to your needs.
| Per Quarter 2016-2017 | Residents | Non-resident Online Only |
Non-resident On Campus |
Non-resident Non-Citizen |
|---|---|---|---|---|
| 1 credit | $999.99 | $999.99 | $999.99 | $999.99 |
| 5 credits | $999.99 | $999.99 | $999.99 | $999.99 |
| 12 credits (full-time) | $999.99 | $999.99 | $999.99 | $999.99 |
| 15 credit | $999.99 | $999.99 | $999.99 | $999.99 |
| These estimated quarterly costs include college mandatory fees such as computer lab & facility fee | ||||
- Anim pariatur cliche reprehenderit,
- enim eiusmod high life accusamus terry
- richardson ad squid. 3 wolf moon officia aute, non cupidatat
skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
Use this snippet to provide additional content to pages without creating exceedingly long Web pages.
Image with Overlay Snippet
Button Snippet (left and right justified)
Contact Info Two Column Snippet
Example usage. Place the contact snippet within a 2-col or 3-col snippet as needed.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Del sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
Contact Us
Advising Services
1111 Greenwood Ave. (Blg 2000)
Shoreline, Wa. 98111
- contact@shoreline.edu
- Phone
- (206) 546-4559
- Fax
- (206) 533-5101
Contact Info One Column
Contact Us
Advising Services
1111 Greenwood Ave. (Blg 2000)
Shoreline, Wa. 98111
- contact@shoreline.edu
- Phone
- (206) 546-4559
- Fax
- (206) 533-5101
Single Event Snippet
May
8
Spindrift 2018 Release Celebration
Tuesday, May 8, 2018
11am - 6pm
Visual Arts Center, 2000 Building
Multiple Events Snippet
May
8
Spindrift 2018 Release Celebration
Tuesday, May 8, 2018
11am - 6pm
Visual Arts Center, 2000 Building
Dec
25
Spindrift 2018 Release Celebration
Tuesday, May 8, 2018
11am - 6pm
Visual Arts Center, 2000 Building
May
8
Public Health Degree Info Session
Tuesday, May 8, 2018
11am - 6pm
Visual Arts Center, 2000 Building
News Feed Snippet
Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Seven back-to-school tips for college students. Vivamus at nisi massa.
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Under Construction - Consulting with OmniUpdate
Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Green Line on Left Snippet
This creates two columns. In the right column is an area with a green border on the left. This acts as a way to "call out" an image or information.
Place your content here
Place your content here
Two Column Snippet with 1/3 to 2/3 Width Ratio
Insert Column One Content. This column is 1/3 the width of the page.
This is the first (or left-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down
and be placed above the second(or right-hand) column.
Insert Column Two Content. This column is 2/3 the width of the page.
This is the
second (or right-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down and be placed under
the
first (or left-hand) column.
Two Column Snippet with 2/3 to 1/3 Width Ratio
Insert Column One Content. This column is 2/3 the width of the page.
This is the first (or left-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down
and be placed above the second(or right-hand) column.
Insert Column Two Content. This column is 1/3 the width of the page.
This is the
second (or right-side) column of a two-column snippet where content can
be placed.
In the page's responsive design, this column will scale down and be placed under
the
first (or left-hand) column.
Two Columns with Quote on Right Side
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Begin by typing a quote. Once the quote is done, you can rejoice.
Quote Author Name
Job Title
One Column Quote
Begin by typing a quote. Once the quote is done, you can rejoice.
Quote Author
Rectangular News/Announcement with Button
Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Square News/Announcement
Seven back-to-school tips for college students
Duis nec consequat dui. Praesent gravida diam at ex pharetra porta. Vivamus at nisi massa. Nam porta…
Table (Simple)
| Head | Head | Head |
|---|---|---|
| Subject 1 | Subject 2 | Subject 3 |
| Subject 1 | Subject 2 | Subject 3 |
| Subject 1 | Subject 2 | Subject 3 |
| Subject 1 | Subject 2 | Subject 3 |
| Subject 1 | Subject 2 | Subject 3 |
Table (Pinned)
First column is locked. Right click a table cell to select deletion of a row or column.
| Film Title | Released | Studio | Budget |
|---|---|---|---|
| Frozen | 2013 | Disney | $150,000,000 |
| Toy Story 3 | 2010 | Disney Pixar | $200,000,000 |
| Minions | 2015 | Universal | $74,000,000 |
Table (Responsive Stacked)
Right click a table cell to select deletion of a row or column in order to size the table according to your needs.
Right click a table cell to select deletion of a row or column in order to size the table according to your needs.
| Per Quarter 2016-2017 | Residents | Non-resident Online Only |
Non-resident On Campus |
Non-resident Non-Citizen |
|---|---|---|---|---|
| 1 credit | $999.99 | $999.99 | $999.99 | $999.99 |
| 5 credits | $999.99 | $999.99 | $999.99 | $999.99 |
| 12 credits (full-time) | $999.99 | $999.99 | $999.99 | $999.99 |
| 15 credit | $999.99 | $999.99 | $999.99 | $999.99 |
| These estimated quarterly costs include college mandatory fees such as computer lab & facility fee | ||||
Tabs Snippet
Tab 1 -- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum nisi arcu, vitae tempus nisl mattis ut.
Tab 1 -- Quisque sollicitudin ex quis sapien imperdiet, a ultricies elit laoreet. Duis nec consequat dui lorem.
Tab 2 -- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum nisi arcu, vitae tempus nisl mattis ut.
Tab 2 -- Quisque sollicitudin ex quis sapien imperdiet, a ultricies elit laoreet. Duis nec consequat dui lorem.
Tab 3 -- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dictum nisi arcu, vitae tempus nisl mattis ut.
Tab 3 -- Quisque sollicitudin ex quis sapien imperdiet, a ultricies elit laoreet. Duis nec consequat dui lorem.
Twitter Feed Snippet
Simply insert the proper Handle before the "@" symbol.
Image With Caption
Lorems to the ipsums to the lopsems…Milla Vanilla
Transfer Program in Visual Communications Technology
Two Images With Captions
Image dimensions: Left Image should be no wider than 644 pixels by any height.
Right Image (one-column image) should by no wider than 313 pixels by any height.
Two Column Video Overlay Image with Caption Snippet
Video Title
Video description Earum omnis reiciendis aut quasi id ea exercitationem dolorum. Asperiores aut dicta odit.
Video with Caption Below
Video Title
Video description Earum omnis reiciendis aut quasi id ea exercitationem dolorum. Asperiores aut dicta odit.
YouTube Embed (4x3)