Community forum for knowledge and support

Updated last month

Starting A New Webflow Project Correctly

At a glance

The community member is starting a new Relume/Webflow project and wants to ensure they begin correctly. They plan to clone the style guide into Webflow and bring in only the necessary components from the Relume app, rather than copying the full wireframes. They are unsure whether they should rename the sections in the Navigator and if they should keep the original Relume component numbers.

The community members discuss the use of the Finsweet Chrome extension, which has a folders feature that can help with renaming sections. One community member provides a video tutorial on how to use the extension for renaming classes. They also suggest a workaround for renaming sections that have the same component by wrapping them in a div, renaming, and then pasting them back into the project.

The community member confirms they have followed the steps correctly and expresses gratitude for the video tutorial, which helped them understand the folders and renaming process.

Useful resources

I’m about to start my second Relume/Webflow project, and I want to make sure I begin this one correctly. I don’t think I started my first project in the best way, unfortunately.
For this new site, each page will follow the same basic structure—nothing fancy—just different copy and images in each section. When I clone the style guide into Webflow, I plan to open the Relume app and bring in only the components I know I need, rather than copying from the full Relume wireframes.
Here’s where I get a bit confused: when I bring components into Webflow, I can see them listed as sections in the Navigator. Do I need to rename each section in the Navigator to something more descriptive (e.g., section_about-us)? Should I keep the original Relume component number for reference, or is it safe to delete it? I want to avoid doing anything that could mess up the classes or styling from Relume. I will add the Chrome extension and turn on class-sync so I am aware of that.
I’ve read a bit about the Client-First folder and naming structure, but honestly, that left me more confused.
Thanks in advance for any help or clarification!

M
J
C
11 comments

@JK unfortunately you won't be able to cherrypick sections using the Relume webflow app anymore - its basically an entire page only. You could still copy/paste from site builder into Webflow though.

As for naming - I would say its best to rename the sections to match the site. I know you said you read about Client-First and folders and that made it more confusing. If you have specific questions around that, I can try to help get you across the finish line with the understanding there.

Basically you'll also want to install the Finsweet chrome extension which has the folders feature in it that will make renaming sections a lot easier and quicker to do.

Thank you, Matt. I will give that folders feature another read over. If I have any questions I’ll reach back out. Thanks again.

@Matt Any safe/simple way to just rename the sections of the site without using this chrome extension?

Attachment
sections.png

Hey @JK - I did this quick loom (6 mins) - to show you how I use the finsweet folders extension to rename classes. Let me know if this was helpful or if you have any specific questions.

https://www.loom.com/share/ad229931ba7542168f74230f44a43142?sid=25da1979-3603-49cc-a600-4ebf0bacd1d7

So I see that you have 4 sections that are identical but I'm assuming they'll be unique classes. The only path forward there would be to wrap 3 of those sections into a div and cut it out and paste them into a new project. Then follow the renaming, and then paste one of those sections back into this project and repeat that process until all of the sections are renamed. Hope that makes sense - if not, I can do a real quick loom on that as well.

Thank you! I’ll take a look at this when I’m back at my office. I appreciate it.

Hey @Matt that was really helpful. Thank you,

Okay cool - glad I could help!

@Matt Did I do this correctly with the two sections that share the same component? I brought in the component, renamed it, and then brought it in again and renamed that one as well. On the banner at the top I renamed it and I have it outside of the wrapper…just checing to make sure that is also correct. I need it to go above nav.

Attachment
relumeshot.png

@JK yep - nailed it!

@Matt Whew! Thanks for that video it really helped me understand the folders/renaming.

Add a reply
Sign up and join the conversation on Slack