Group in vertical tabs

You can group the parts of a page in vertical tabs.

This may look as follows:

Ins_Groeperen in verticale tabbladen (10)

To group parts in vertical tabs:

  1. Log on and start Site management.
  2.  Open the page whose parts you want to group.
  3. Click on: Edit (in the Page frame).
  4. Click on: Layout in the Display frame.
  5. Click on: New.
  6. Select Grouping.

  7. If applicable, enter a title.
  8. Select the Show component frame and title check box if you want to display this data.

    If you select this check box, a line is displayed around the grouping and the title of the grouping is displayed.

  9. Select the presentation style Tabs (vertical).
  10. Select the Animation check box if you want to have a nice transition when switching between tabs.
  11. Select the style of the button in Vertical tab button style.
  12. If necessary, specify the height of the grouping.
    • Fixed height: you enter the height of the banner yourself in pixels. If an item does not fit in this fixed height, it is not displayed. If nothing is displayed, then change the fixed height. If you use less space than the specified height, the remaining space is filled with white space. This allows you to display multiple items next to each other which are not of the same height.
    • Full content: here you specify that you want to display all the items that are available from the source. The height is determined on the basis of the items so that all items will fit.
    • Justify: the height is determined by the available space in the column. You can only choose this for banners you include independently in a page. For banners in a custom layout, you cannot choose this option because it is not possible to determine the available space. A banner that has been set to Justify, uses all the available space in the column. The height of the column is determined by other parts that appear in the same line. This is useful, for example if the banner is placed on a line with other columns that have parts with a variable height. The height of the banner is then determined by the other part.
    • Wrap text: if the text of the banner is too wide, then with this option the text continues on the next line. You can only select this option for the presentation style 'List (below each other)'. With any of the other options, if a text does not fit it is simply truncated.
  13. if you do not want the grouping to be positioned close to the text, fill in the Margins.
  14. Click on: Create.

    An empty grouping has been added to the page.

  15. Double-click on the grouping.
  16. Drag the grouping to the place where you want to display it.
  17. Select a part you want to add to the grouping.
  18. Drag the part to the grouping, until you see a green dotted line in the contents of the grouping.
  19. Drop the part; it has now been added to the grouping.
  20. Repeat this for all the parts you want to add to the grouping.
  21. Click on: Publish.
  22. Click on Yes in the message.

Directly to

  1. Grouping in InSite & OutSite
  2. Group in a carousel
  3. Group in a drop-down list
  4. Group in horizontal tabs
  5. Group in vertical tabs
  6. Rearrange parts of a grouping
  7. Modify a grouping presentation style
  8. Delete a part from a grouping
  9. Adjust the alignment of the carousel grouping
  10. Delete a grouping