How can we help you today?

ShortPoint Page Builder Live Mode Feature: Hot Actions

ShortPoint Page Builder Live Mode lets you adjust the spacing between Design Elements to perfectly complement your page design. This feature, called Hot Actions, will be explained in detail throughout this article.


Hot Actions


TABLE OF CONTENTS


Prerequisites


What is Hot Actions?


Hot Actions is a Live Mode feature that allows you to resize [1] margins (spaces outside the border of the Design Element):


margins


And [2] paddings (spaces within the border of the Design Element) through a simple click-and-drag action:


paddings


Hot Actions eliminates the need to guess spacing values or switch between settings and preview windows. You can see the changes you make right on your page!


Interactive Tutorial

Start the interactive tutorial below to learn how to use Hot Actions:



NOTEOption B of the interactive tutorial is still in development and will be released soon.


TIPIf you choose the Standard, Full Height, or Full-Width spacing style for your Section/Row, you’ll also be able to directly customize your spacing selection using Hot Actions. Simply select the rectangle icon inside the highlighted area and select the spacing style you want to use:


section spacing


Step-by-step Tutorial

There are two ways to use Hot Actions: Follow the option that best suits your needs:


OPTION 1: Drag and Drop

This option demonstrates how to use Hot Actions using drag-and-drop:


Step 1: Enter EasyPass Active Mode

  • Hover over the Design Element you want to modify.

Step 2: Resize

  • Move your cursor to the end of the margins or paddings you want to resize until you see a color highlight and drag until it reaches your desired size or value:


Drag and Drop

  • (Optional) To have equal value or size on both sides, click the link icon:

link icon


Step 3: Exit Active Mode

  • When you are satisfied with your adjustments, click anywhere outside the Design Element you are working on to exit Active Mode.


That's it! You now know how to use Hot Actions using the drag-and-drop method.


OPTION 2: Typing the Value


NOTEOption B is still in development and will be released soon.


This option demonstrates how to use Hot Actions by typing the value:


Step 1: Enter EasyPass Active Mode

  • Hover over the Design Element you want to modify.

Step 2: Resize

  • Click the number inside the color highlight and type your desired value:

type value


  • (Optional) To have equal value or size on both sides, click the link icon:


link icon


Step 3: Exit Active Mode

  • When you are satisfied with your adjustments, click anywhere outside the Design Element you are working on to exit Active Mode.


That's it! You now know how to use Hot Actions by typing your desired value.


Related Articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 22 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more