Adding static element to a page

Site URL: https://www.starbucks.co.uk/

Hi, I'd like to know how to add a static element to a page, I mean, an element that does not move when you scroll the page up or down. One example of that is the Starbucks website (you can see when you access it in a desktop).

I've contacted squarespace support but they told me it would only be possible through a custom code.

https://www.starbucks.co.uk

Thanks!

What you want is a fixed element, not a static one. It is done by using position:fixed attribute. Here is an example:

<div id="element">

</div>


<style>
#element {
height:100px;
width:100px;
background:red;
position:fixed;
}
</style>

Try pasting the above code in a code block and the element will be fixed at the top-left corner even when you scroll. You can use top, left, right, and bottom properties to fix the permanent position of the element.

 

If you want make an image static, you can add an image block on footer, then we will give the code to achieve this.

or if you want text only, use @aravasanj code

Bumping this concept back up! I'm interested in this as well. I'd love to have an image stay fixed as the rest of the content scrolls. Huge benefit here to be able to keep a common Call To Action in view at all times. 

https://www.eqlz.com/products/1100-panther

Is there a way of doing this?