Widget styles

Learn more about ‘Widget Styles‘ on the ‘Intranet‘

App style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘App‘ option
4. Choose the numbers of ‘Items to display‘
5. Add the ‘Display date‘
6. If you would like, select the checkbox for ‘Custom date format‘
7. If you would like, select the ‘Show more‘ link

Example

Carousel style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Carousel‘ option
4. Add the ‘Style‘ of ‘Single image‘ or ‘Multi image‘
5. If you would like, select the checkbox for ‘Link image to content‘
6. Input the number of ‘Items to display‘
7. Select the ‘Image style‘ and choose the aspect ratio
8. If you would like, select the checkbox for ‘Use Manual Crop‘
9. Add the ‘Display date‘
10. If you would like, select the checkbox for ‘Custom date format‘
11. If you would like, select the checkbox for ‘Show More link‘

Single image example

Multi image example

Gallery style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Ensure that you have the ‘Gallery‘ widget
3. Select the ‘Design‘ dropdown tab
4. Under ‘Style‘ select between ‘Slideshow‘ and ‘Grid‘
5. When ‘Slideshow‘ is selected input the ‘Aspect ratio‘
6. When ‘Grid‘ is selected, input the number of ‘Columns‘
7. Select ‘Save‘ 

Example

Grid style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Grid‘ option
4. Select the number of ‘Items to display‘
5. Select the number of ‘Items per row‘
6. Select the number of ‘Items per row‘ for mobile
7. If you would like, select the checkbox for ‘Link image to content‘
8. If you would like, select the checkbox for ‘Show more link‘

 Hero style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Hero‘ option
4. Input the number of ‘Items to display‘
5. If you would like, select the checkbox for ‘Link image to content‘
6. If you would like, select the checkbox for ‘Display thumbnail images‘
7. Input the ‘Display date‘
8. If you would like, select the checkbox for ‘Custom date format‘
9. If you would like, select the checkbox for ‘Show more link‘

Example

List style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘List‘ option
4. Under the second ‘Style‘ option Select one of the following options:
   1. ‘Ordered‘
   2. ‘Unordered‘
   3. ‘Useful links‘
5. Select the number of ‘Items to display‘
6. If you would like, select the checkbox for ‘Show more link‘ 

Example

Multi row card style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Multi-row card‘ option
4. Input the number of ‘Items to display‘
5. If you would like, select the checkbox for ‘Display image‘
6. If this has been selected, input the ‘Image style‘
7. If you would like, select the checkbox for ‘Use manual crop‘
8. If you would like, select the checkbox for ‘Link image to content‘
9. Input the ‘Display date‘
10. If you would like, select the checkbox for ‘Custom date format‘
11. If you would like, select the checkbox for ‘Show more link‘
12. Select the relevant ‘Label‘ from the dropdown
13. Select ‘Save‘

Example

Poll style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Poll‘ option
4. Input the number of ‘Items to display‘

Example

Simple style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Simple‘ option
4. Input the number of ‘Items to display‘
5. If you would like, select the checkbox for ‘Display image‘
6. If this has been selected, input the ‘Image style‘ and ‘Image direction‘
7. If you would like, select the checkbox for ‘Use manual crop‘
8. If you would like, select the checkbox for ‘Link image to content‘
9. Input the ‘Display date‘
10. If you would like, select the checkbox for ‘Custom date format‘
11. If you would like, select the checkbox for ‘Show more link‘
12. Select ‘Save‘

Example

Tabbed style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. Select the ‘Design‘ dropdown tab
3. Under ‘Style‘ select the ‘Tabbed‘ option
4. Input the number of ‘Items to display‘
5. Input the ‘Display date‘
6. If you would like, select the checkbox for ‘Custom date format‘
7. If you would like, select the checkbox for ‘Show more link‘
8. Select ‘Save‘

Webform style

Steps

1. Navigate to a section on the intranet where you would like to add or have already added a ‘Widget‘
2. In the ‘Display‘ dropdown ensure that ‘Single option‘ is selected
3. Select ‘Webform‘
4. Input the title of the specific ‘Webform‘ you want to display
5. Select the ‘Design‘ dropdown tab
6. Under ‘Style‘ ensure ‘Webform‘ is selected
7. Select ‘Save‘
   

   Widget Styles – Webforms

Demo video

Video timestamps:

• Multi row: 19.6s
• App Card: 1m 52s
• Carousel single image: 2m 30s
• Carousel multi image: 3m 10s
• Grid style: 4m 14s
• Webform style: 4m 50s
• List style: 5m 12s
• Simple style: 6m 26s
• Tabbed style: 7m 8s
• Hero style:  7m 28s
• Poll style: 8m 13s