Community forum for knowledge and support

Updated 7 months ago

Layout 484 Scroll Interaction and Custom Font Renaming

At a glance

The community member is using Layout 484 on their site, but there doesn't seem to be any scroll interaction. They pasted in a fresh version and got an alert about custom fonts needing to be renamed for cross-site copying, which they are unsure about. The community members provide a read-only link to the site and discuss updating the code to reflect renamed component classes, but this doesn't work. They also try copying in the component fresh again, but it still doesn't work. The community members then realize they need to check the published site, where the layout does work with a normal text color, but when they set a background gradient and clip to text, the initial state is invisible. They are unsure how to affect the initial state of the text with reduced opacity and need help with this issue.

Useful resources

I'm using Layout 484 on a site, but there doesn't seem to be any scroll interaction. I just pasted in a fresh version to try again and got an alert that custom fonts had to be renamed for copying cross-site. Unsure what that even means

M
E
10 comments

Would you mind sending a read-only link?

ah looks like the component classes were renamed, so we just need to update the code embed to reflect those names.

I tried changing the code so .layout484_text became .scroll-text and section_layout484 became section_scroll-text, but this still didn't work. I then tried copying in the component fresh again, and it isn't working. Here's the read-only link again, if you could take a look at the version I've added to the bottom of the home page, where I haven't renamed the classes.
Thanks for all your help!

would need the published staging URL in order to test as well - will take a look!

(I always forget that part with custom code, apologies!)

Okay so I didn't realise I needed to check on the published site to see if it was working. So it actually does work, if I use a normal text colour.

But when I set a background gradient and set it to clip to text, it doesn't work. The words appear but the initial state is invisible. I don't know how to affect the initial state of the text where the reduced opacity is set. My guess is that I would need to target it and also give it a background gradient + clipping. Could you help me out here?

Could I draw your attention back to this please πŸ™

yeah this could be tricky - I've added it to my list here.

Add a reply
Sign up and join the conversation on Slack