Use Sticky & Pinned position with Wix Studio

[@daviddenton4234]

I'm getting 'who's on first' vibes w this one

[@carloscodling5084]

Thank you!

[@mrskeeferoo]

Hi. My pinned header overlaps the next adjacent section, but I dont want that as it hides information that is on that next adjacent section. How do I get my pinned header not to overlap with a fade away as I always want my header to be visible?

[@WixStudio]

Hey there. If you are looking for a fade effect without overlap then we would recommend using an offset as seen in the following article. Please review step 3 under the "Fade Out" drop down for different options: support.wix.com/en/article/studio-editor-adding-header-scroll-effects#adding-and-setting-up-a-header-scroll-effect

[@mrskeeferoo]

@@WixStudio thanks, but i dont want the fade effect. I want to pin my header, without overlapping the next section

[@mrskeeferoo]

dont worry... sorted

[@AndrheaLouiseAnday]

How did you create the horizontal scroll?

[@WixStudio]

Hey there - We have included a tutorial that walks through applying the horizontal scroll effect - www.wix.com/studio/academy/tutorials/build-along-to-create-a-horizontal-scroll-effect

[@NolanKoop]

I have 3 sections that i want to scroll over top of each other as we scroll down the site. It all works smooth when i use the sticky effect but when I try and scroll past the last one it doesnt keep scrolling to the next section below it. What am I doing wrong? Its like the last one won't coninue scrolling up. Everything after it just goes underneath it.

[@WixStudio]

Hi Nolan, sounds like you've made great progress so far. We'd like someone to take a look at the site you are working on. We'd first recommend sharing a a description of the issue along with a link to this video and a screencast of the issue on the Studio community so fellow community members can assist >> www.wix.com/studio/community. If you still need guidance then reach out to our Studio experts and they can assist.

[@ramseyclips]

@@WixStudio Dealing with the same exact thing - the final section does not leave the screen.

[@ramseyclips]

I'm wondering if you were ever able to solve this, and if so, how. I'm dealing with the same exact issue. Thanks -

[@NolanKoop]

@@ramseyclips move the entire last section to the back. So click and go to arrange or move the next page under it to the front so it can scroll in front of it

[@ramseyclips]

@@NolanKoop Thanks man, I appreciate it.

[@KeithHepburn]

So you have a link to this site please i want to see the scroll effect how its done.

[@WixStudio]

Hey Keith, we're glad to hear that our guide inspired you to request more inspiration. The site showcased in the tutorial was made by our team to demonstrate some of the capabilities available and is not published. We encourage you to explore our Wix Studio inspiration page here > www.wix.com/studio/inspiration for sites created by our talented users and apply it to your own.

[@ranitahaldar]

Hi, I have done this for the website and it works fine for the desktop version, but in the mobile view, it keeps sticking to the header (right beside the logo) automatically, making my site look entirely messed up. Please help.

[@WixStudio]

Hey Ranita, thank you for bringing this to our attention. In order for us to assist you in this specific design, we'd need to take a closer look at your site. If you could please reach out to our expert team and provide them with the vision you'd like to achieve, we'd be happy to guide you. Reach out to them via the link here > wix.to/iZTuzNF

[@veronicadennis8305]

I have five sections set to be sticky, but the fourth one stays on top of the other and the bottom part of the page no matter what I do. How can I fix this?

[@WixStudio]

Hey Veronica, thank you for bringing this to our attention. It appears that the order of the section layer is incorrect. When using Sticky the sections must be arranged one after the other. You can do so by opening the 'Layers Panel' and selecting 'Bring To Front' in each section, starting from the first section and ending with the last.

[@SurajSinghTomarArya]

I dont want the my pinned header to overlap to next section as that crops out section below header. how can I remove that overlapping?

[@WixStudio]

Hi Suraj, thanks for bringing this to our attention. While the pinned header is designed to always stay at the top of the page, we can implement a transition effect that will either move or fade the header as you scroll down to lower sections.

[@NowThatIAM]

How would someone create a back to top button that is pinned to bottom right?

[@WixStudio]

You can add a button that is linked to the top of the page, and change the position of the button to pinned to the page (the settings can be found in the right panel - inspector). To place it at the bottom of the page, the margin and docking must be set in the correct way, you can set docking to top with 90vh margin to maintain a distance of 90% screen height, for example. More explanations about pinned element and position can be found in the course or in additional videos at the academy

[@Grays_Reviews]

Im using this on portion of my site menu and the area expands every time I try to to this, not sure what to do, Header is very skinny and is broken into two layers one with menu that supposed to move, puts its only 40 px tall

[@WixStudio]

Hey there, thank you for bringing this matter to our attention. It appears that you're encountering a particular issue on your site and we'd like to investigate further. We recommend reaching out to our customer care team here > wix.to/iZTuzNF and we'd be happy to assist.

[@Grays_Reviews]

@@WixStudio Ok Thanks

[@gzdc]

I have sticky buttons on bottom of the page and repeater in middle. Buttons and repeater appear transparent when they're passing trough repeater. What am i doing wrong. Help please!

[@WixStudio]

Hi there. This seems like an issue that our technical team should look into further. Please submit a support request to our team by visiting here >> wix.to/iZTuzNF Our team will be happy to assist you further from there.

[@Aquamarine3663]

It's great!

[@WixStudio]

We're glad to hear that you found this tutorial useful, Hung. We're positive you'll stick(y) it to your design!

[@BoatPass]

Hi, how can I make a Sticky section in Mobile

[@WixStudio]

Hi, just to clarify, are you asking how to ensure the sticky position carries over to mobile or looking for it to only function on mobile?

[@KeithHepburn]

This gradually makes sense but it requires a lot of fiddling and playing to see what actually works, its not just a case of changing the values and for some reason published version looks so different to the Studio version. I'd like to know how to create an offset at the button, but its proving very difficult to get the balance of where to stick it and how much to offset and which margins to use.

[@KeithHepburn]

I'm thinking the work around would just be to put a separate cell between one cell and another that way I create a buffer.

[@WixStudio]

Hi again Keith, we see you commented a few times here with follow up questions. For these types of questions we recommend speaking with one of our Wix Studio experts so they can take a look at your specific site and questions. You can consider posting on one of our dedicated communities here > wix.to/SiperLT or by submitting a ticket to our customer care team at wix.to/iZTuzNF.

[@KeithHepburn]

@@WixStudio Thanks I'm in comms with the help centre regularly and the support from Wix has been great. Oddly I went back to the editor and this problem was not happening the second time I used it.

[@adileneaguilar5979]

THIS PART.