🟦Overlays
Last updated
Last updated
Overlays are in-sphere pages. They can be used to give you a closer look at a product and product information, or to take you to an external link, without leaving the sphere (a pop-up that Lays Over the sphere😉) . Overlays are applied in actions on the canvas.
Product overlay
Info overlay
Overlay Content
Links and Social Content
Single Image
Content Carousel
Video
To customise overlay styles for ALL sphere's in your space, go to Space Settings and then Overlays
To customise overlays in a specific sphere, go to 'Work In Progress' sphere settings, and click on 'Overlays'
Here you can customise the colour style for the overlays within the sphere
To get to Product Overlay settings, you must go to settings within a ‘Work In Progress’ sphere and click on 'General'.
Customise the information icon in the corner of your overlay by uploading an image. Here, you can upload it directly from your computer
Change the colour and icon, and get a preview of what it would look like
Info overlays are used for crucial information, such as privacy policies and legal disclaimers
Upload an image, change the title name and add in your content
Then click the preview button to see what the overlay will look like!
To upload content for your overlays, go to Assests and then Overlay Content
Files Accepted for Overlays: SVG, PDF, PNG, JPG, GIF, HTML, JS
HTML absolute links are complete web addresses that start with http:// or https://, ensuring the link works no matter where the file is used.
To apply this action go to Curator -> Actions -> Links. There are two sub-types in this overlay type (external links will just redirect user, not create an overlay):
With Iframe link you can simply add a link and we will show it's content in an overlay!
For social content you'd need to go to Space Settings -> Social Media Integrations and then connect social content you want to use in overlays. You can also style each overlay for different social media integrations in the same settings.
Go to Curator -> Actions -> Image Overlays -> Single image. This action will open your image as an overlay.
Go to Curator -> Actions -> Image Overlays -> Content carousel. Showcase multiple images and videos within a single overlay, creating an interactive slideshow experience. Simply create a tag, add your desired images and videos to it, then apply the content carousel action. You can select specific media from the tag and reorder them by dragging, giving your audience a seamless way to explore your content in one place!
Go to Curator -> Actions -> Video Overlay. By applying this action you can either select a video from your assets and set is as an overlay or insert video link:
The difference between inserting video link and using Socail Media integrations to add Social Content overlay is mainly visual and in styling: video overlay takes its styling from Overlays Settings and Social Content overlay from Social Media integrations.
Click on the object you want to have an overlay. Apply an action and choose the content you want to be displayed in the overlay
All overlay content must be uploaded in your Space before you can use them on the Canvas
If you have your Shopify shop connected to your Cozmos Space, then you can set up specific E-commerce overlays such as Products, Sign In and Shopping Cart overlays!
You must have your Shopify connected to your Cozmos space to be able to access E-commerce overlay settings
To customise Ecommerce overlays for all of your spheres, go to Space Settings, Ecommerce UI and Overlays
Customise the style of the overlay, such as the typography, buttons and colours. You can do this for the different languages you have set up too!
To customise Ecommerce overlays at Sphere level, then go to 'Work in Progress' sphere settings
If your Shopify is connected, then the Ecommerce settings tab will show
