Table of contents

This article outlines what widgets are and how to add and manage them in pages.

What are widgets?

In Happeo, a widget is an interactive component that brings content to life by displaying specific information, such as calendars, files, or other interactive features, directly on a page. By adding and arranging widgets, you can create dynamic and informative pages tailored to your specific needs.

How to add widgets

There are multiple ways to add widgets to sections, whether you start from a blank section or start with a section that already has widgets.

  1. When viewing the page editor, to navigate to the widget menu, you can either:
    • Click the Add widget button (if adding widgets within a blank section)
    • OR click Widgets from the navigation on the left
  2. From the Widgets menu, you can browse through and search for widgets using the search bar. Once you’ve chosen the widget you want to add, drag and drop the widget anywhere on the blank section. As you move the widget across the section, you can simultaneously adjust the size of the widget using the gridlines
  3. You can repeat this process by dragging and dropping more widgets anywhere on the section
  4. If you run out of space, you can either delete widgets or create a new section above or below

How to resize a widget

To resize a widget:

  1. Hover your mouse over the widget until it is highlighted in blue, and click on it
  2. Drag from the left, right, bottom, or bottom corners of the widget to resize it as you see fit. Use the gridlines as a guide for how small or large you want the widget to be

How to crop an image in a widget

To crop an image within a widget:

  1. Hover your mouse over the widget until it highlights blue, then click on it
  2. Click the crop icon
  3. Drag the crop frame using the scale at the bottom
  4. (Optional): Use the other icons to rotate, mirror, or undo/redo changes
  5. Click Done to apply the changes

Note: You can find more advanced image editing tools by navigating to the widget settings and clicking the pencil icon on the image preview. For more information, please refer to this article.

How to edit a widget

To edit a widget: 

  1. Hover your mouse over the widget until it is highlighted in blue, and click on it
  2. Select the settings icon from the top right of the widget

A menu will appear, displaying the customization options for that specific widget. Adjust the settings as needed.

How to add a widget header

A widget header is a title or label that you can add to a widget to identify its purpose or content. It helps to organize and clarify the information displayed within the widget and distinguish between other widgets.

You can add a widget header in two ways:

  1. By clicking the widget
    1. Hover your mouse over the widget until it is highlighted in blue, and click on it
    2. Click Add widget header at the top of the widget
    3. Type a name for your widget header in the text box above the widget
  2. By going to the widget settings
    1. Hover your mouse over the widget until it is highlighted in blue, and click on it
    2. Select the settings icon at the top-right of the widget
    3. Toggle Widget header
    4. Type a name for your widget header in the text box above the widget

How to duplicate a widget

To duplicate a widget: 

  1. Hover your mouse over the widget until it is highlighted in blue, and click on it
  2. Select the duplication icon (paper stack) at the top right of the widget

The widget will be duplicated and placed wherever there is space for it.

How to delete a widget

To delete a widget:

  1. Hover your mouse over the widget until it is highlighted in blue, and click on it
    1. Select the trash bin icon at the top right of the widget
    2. Or, hit the backspace button on your keyboard

The widget will be removed from the section.

FAQs

What happens if widgets are used in Pages 1.0 that won’t be available in Pages 2.0?

If Pages 1.0 content includes widgets that won’t be available in Pages 2.0, those areas will display as blank to users once migrated – but within the editor, the space will be populated with a placeholder card that says the widget is not supported – encouraging them to adjust or choose a different widget. See the list of widgets and their changes here.

List of widgets

Here’s a list of available widgets:

Previous
Next
31976051466513