Tabs web part (with rich text, images and more)

How-Tos & Manuals
1

Got lots of content to show on the page? Origami Tabs web part can help you neatly organize it all.

Pick from thousands of FontAwesome icons:

image
image1100×670 97.9 KB

Or no icons:

image
image1107×592 123 KB

Tabs automatically adapt to mobile and small web part sections

Setting up the web part

Edit the page where you want to see the Tabs, and pick this app from the gallery:
image

Adding a new tab

:white_check_mark: Available in Tabs – Version April 28, 2025

  1. Edit web part properties and click the Add/Remove Items button
    image

  2. Add, remove, or re-order tabs as you see fit

    AddRemove Tabs
    AddRemove Tabs962×608 43.5 KB

How to update the tabs

  • To change the image shown on the page, click the Upload button.
  • To change the color of the numbered circles (the step numbers), use the color picker right next to the Upload button.

Untitled design
Untitled design820×638 130 KB

Changing web part styles

Here are the styling options you can change to your liking:

image
image227×316 4.6 KB

  • Show Icons will show or hide icons for each tab
  • Hide Table Lines if you’re using tables in your tabs, this option lets you hide gridlines
  • Show Box Shadow will show or hide the border shadow for the entire web part making it look more like part of the page as opposed to a separate component.