Try ShortPoint nowShortPoint Page Builder Live Mode brings you the capability to adjust spacing values of Design Elements in the view mode, making it easy to achieve the best size that complements your page design. We call this the Hot Actions feature, and we are introducing it in detail in this article.
Note: ShortPoint Page Builder Live Mode was formerly known as Visual Builder.
TABLE OF CONTENTS
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 Hot Actions?
Hot Actions is a Live Mode feature that allows you to resize margins and paddings through a simple click and drag action, modifying your content in real-time on your SharePoint page. You no longer need to guess spacing values to fit your design. You also do not need to toggle between your settings window and page preview to see the result. The action happens right where you can see it.
How does Hot Actions work?
When in the Live Mode interface, the Hot Actions feature becomes available when you are on Easy Pass Active Mode.
Step 1: Enter EasyPass Active Mode
Hover over the Design Element you want to modify and click its EasyPass label. In our example, we decided to adjust the size of the content of the Image Design Element.
Step 2: Click and drag to resize
Move your cursor to the end of the margins or paddings you want to resize until it changes into a double-headed arrow and a shaded area appears. Click and drag until it reaches your desired size or value. This can be applied to all sides of your Design Element.
Hot Actions also allows you to pin both sides of the margin or padding so that it will have the same value. This makes applying symmetry to your content very easy. Just press the pin icon beside the pixel value on one side, and it will automatically apply to the other side.
In our example, we have chosen to increase the left margin of the image, which reduced its size to fit better into the column. Notice that we pressed the pin icon to add a similar-sized right margin.
Step 3: Exit Active Mode
When you are satisfied with your adjustments, you can click outside the Design Element you are working on and exit Active Mode.
Hot Actions provides you more control over the placement, size, and alignment of your content. It is now easy to deal with content sizes with ShortPoint Page Builder Live Mode.
Related Articles: