Studio Editor: Pinning Elements and Sections

2 min read
Want to make sure visitors aren't missing important information? Using the Pinned Position setting, you can lock your elements and sections into place. This means they're always accessible to visitors as they scroll up and down. 
In this article, learn more about:

Pinning elements and sections

Pin elements to a container, section or page so they're always within reach for site visitors. This is a great tool to increase the visibility of important content as well as navigation elements like your menu. 

To pin an element or a section:

  1. Select the relevant section or element.
  2. Click the Open Inspector arrow  at the top right of the Editor.
  3. Scroll down to Position.
  4. Select Pinned from the Position type drop-down.
  5. (Elements only) Choose where to pin the element under Pin to:
    • Container / Cell: The element stays fixed in place, relative to its parent container or cell. 
    • Section: The element stays fixed in place as visitors scroll up and down the section. 
      Note: It's only possible to pin one section per page.
    • Page: The element stays visible and fixed in place as visitors scroll up and down the entire page.
A global header that is pinned to the screen
By default, a pinned section overlaps the section below it.

Removing the pinned position

You can always revert elements and sections back to the default position. This means they are no longer pinned to the screen, they simply stay in their position.

To remove the pinned position:

  1. Select the relevant section or element.
  2. Click the Open Inspector arrow  at the top right of the Editor.
  3. Scroll down to Position.
  4. Select Default from the Position type drop-down.
Selecting the default position type for an element or section in the Inspector

Did this help?

|