Pods can be used to help promote important information and direct site visitors to additional information.
This page demonstrates the different types of "Standard Page Components" you can add to a page as well as the different types of "Sitewide Pods" available.
The "Standard Page Components" below allow you to add different stylised elements to a page without having to worry about the HTML behind the scenes.
The "Sitewide pods" on the right which are defined at a global level within your "Global Settings" have been overridden on this page in order to demonstrate all of the different types of pods that are available.
Tabbed section example
Great for grouping related content and reducing the amount of screen space used.
1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
3 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
Here is a text section
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
- Aliquam tincidunt mauris eu risus.
- Vestibulum auctor dapibus neque.
- Aliquam tincidunt mauris eu risus.
- Vestibulum auctor dapibus neque.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Blockquote example
Code section example
The weather widget demonstrates a possible usage of the "Code Section" page component. You can use this component to add third party widgets as demonstarted below.
The below widget is provided by forecast.io
Accordion section example
Useful for adding an FAQ section of questions and answers to your page.
1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
3 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
Resources section example
Useful for grouping a list of resources that are related to your content together. Can be used to link to downloadable files or link to internal or external references.
Here are some alert boxes
This is an information alert.
This is a success alert.
This is a warning alert.
This is a danger alert with the close option hidden.
Grid Layout Section
Heading
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est
Heading
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Lorem ipsum dolor sit amet, consectetur adipiscing elit et malesuada fames ac turpis egestas.
Gallery example
Light window image
Danny Macaskill
Umbraco: The Friendly CMS
Demo Image
Slideshow example
Light window image
Danny Macaskill
Umbraco: The Friendly CMS
Demo Image
Carousel example
Light window image
Danny Macaskill
Umbraco: The Friendly CMS
Demo Image
Links section example
This is a great tool for increasing your internal link structure and giving your site additional SEO benefits.
Pod Section
This is an example of a Pod Section containing multiple pods.
This is a promo pod
Mauris ante augue, fringilla non accumsan at, imperdiet vel ipsum. Nunc hendrerit, felis nec hendrerit varius, lacus leo euismod mi, a pulvinar sapien libero.
Another promo pod
Mauris ante augue, fringilla non accumsan at, imperdiet vel ipsum. Nunc hendrerit, felis nec hendrerit varius, lacus leo euismod mi, a pulvina
And another pod
Mauris ante augue, fringilla non accumsan at, imperdiet vel ipsum. Nunc hendrerit, felis nec hendrerit varius, lacus leo euismod mi, a pulvinar sapien libero.
And the last pod
Mauris ante augue, fringilla non accumsan at, imperdiet vel ipsum. Nunc hendrerit, felis nec hendrerit varius, lacus leo euismod mi, a pulvinar sapien libero.
Outro section
The outro section of this component can be used to provide further information and links to continue the user journey through your website.
Reusable Pods
Umbraco, the most powerful and flexible CMS I have ever used.
Marc Love, Web Developer
Video caption
Econopolis
Image caption
Umbraco, the most powerful and flexible CMS I have ever used.
Marc Love, Web Developer
Secondary heading
Listing