ShortPoint Page Builder Live Mode Feature: EasyPass

With ShortPoint Page Builder Live Mode, you are able to make customizations to your design layout and elements visually on the page. The EasyPass feature allows you to identify the Design Elements present on your page, take you to an active mode where you can select to make changes to just one Design Element, and provide you direct access to the Design Element settings and other actions.

Note: ShortPoint Page Builder Live Mode was formerly known as Visual Builder.

Let us explore the EasyPass feature in this article and learn how to navigate it.

TABLE OF CONTENTS

• Prerequisites
• What is EasyPass?
• EasyPass Structure
• EasyPass Active Mode
  • Entering Active Mode
  • Exiting Active Mode

Prerequisites

• You upgraded to the ShortPoint SPFx version 8.0.x.xx or later on Office 365 (SharePoint Online) or SharePoint 2019 environment;
• You are a ShortPoint user with an active license.

What is EasyPass?

When you are using the Live Mode interface, you will find that each Design Element on the page is highlighted with a label indicating the Design Element name. These are activated upon hovering over the spaces occupied by a Design Element. This is the EasyPass feature, which allows you to visually select and modify Design Elements as you work to build a beautiful intranet page.

EasyPass Structure

We have Design Elements that act as containers on a page. The most common is a Section that contains a Row with one or more Design Elements. This nested structure is displayed in EasyPass as a stack of labels beginning with the Design Element you are hovering over.

In this example, we hovered over the Slideshows content. As you can see, you will be able to view the main label - Slideshows - contained within the first Column of a Row found within a Section. 

EasyPass Active Mode

When you need to modify a Design Element in Live Mode, all you have to do is go into the EasyPass Active Mode. It allows you to select a specific Design Element on the page and work on it without being distracted by the other Design Elements on the page.

• Entering Active Mode

Selecting an EasyPass label brings you to Active Mode. In Active Mode, the Design Element you selected is highlighted, so you clearly see what you are working on.

Also, you will see that new icons have appeared beside the label:

1. A cogwheel to open the Design Element settings window;
2. A trash bin icon to delete the highlighted Design Element; and,
3. An Other actions ellipsis to open the dropdown menu with duplicate, lock, copy, and cut actions.

• Exiting Active Mode

When you are done with your changes, simply place your cursor and click outside the Design Element to deactivate Active Mode. Your changes will be saved, and you can proceed with designing the rest of the page.

While in Active Mode, you can perform adjustments with the Live Mode Hot Actions feature, edit Design Elements settings, and other actions.

Related Articles:

• Introducing ShortPoint Page Builder Live Mode
• ShortPoint Page Builder Live Mode Feature: Hot Actions