One of the most used features of Ceros is the ability to pin specific objects or groups of objects to a specific point in the viewport. This allows you to keep these objects visible on the canvas, regardless of where the user scrolls.
Note: Pinned objects do not currently work on full-height embedded experiences; only standalone experiences and scrolling embedded experiences.
Known behavior: Pinned Objects that are large in size will be difficult to scroll past on mobile devices. This limitation is most prevalent on Android devices and the mobile version of Safari. Our recommended workarounds are making the pinned object smaller or avoiding using multiple pinned background images. Thank you for your patience as we investigate and improve this behavior.
Pin Object on Canvas
To create a pinned object:
- Select one or more objects in the layers panel
- Ensure these objects exist above the fold
- In the Design tab of the Inspector Panel, toggle on the pin icon next to the X and Y position
To create a Pinned Group:
- Select multiple objects in the Layers Panel
- Ensure these objects exist above the fold (if you pin an object below the fold it will always remain below the fold
- Click the Group icon (cmd + g) at the bottom of your Layers Panel
- Select the Group you just created, and navigate to the Design Tab on the Inspector Panel
- Toggle on the pin icon to make your group stick in place
Now you can scroll up and down, and your Group stays where you pinned it.
Can I pin it to the bottom?
Pinned groups remain at a fixed distance from the top of your experience. Placing an element at the bottom of the viewport on a long scrolling page will stick it to that location. However, it will appear in the middle of the experience if your visitor looks at it in portrait mode on a mobile device.
Note: Ensure your pinned object is above the fold.
Pinning in place works with standalone Experiences or scrolling embedded content. This feature does not currently work with full-height embeds of long-form content.