Thank you for choosing Helora, a modern mental health and wellness Webflow template. This guide covers customization, CMS, content updates, and website setup.
To get started, duplicate Helora to your Webflow workspace, customize your content and styles, and publish your website.
Instruction
A complete guide to customizing the template, managing content, and getting your website ready for launch.
Getting Started
Editing Global Colors
Helora uses Webflow Variables for global color management.
1. Open the Variables panel.
2. Select the color variable you want to edit.
3. Update the color value.
4. All connected elements will automatically update across the website.
This makes it easy to customize the entire design without editing individual elements.
1. Open the Variables panel.
2. Select the color variable you want to edit.
3. Update the color value.
4. All connected elements will automatically update across the website.
This makes it easy to customize the entire design without editing individual elements.
Editing Typography
To change fonts:
1. Open the Style Guide page.
2. Select the text style you want to modify.
3. Update the font family, size, weight, or line height.
4. Changes will automatically apply to all elements using that class.
1. Open the Style Guide page.
2. Select the text style you want to modify.
3. Update the font family, size, weight, or line height.
4. Changes will automatically apply to all elements using that class.
Components
Helora includes reusable components such as:
1. Header
2. Footer
3. CTA Sections
4. Button
5.Pricing
6.FAQ
To edit a component:
1. Open the Components panel.
2. Select the component instance.
3. Edit the content or detach the instance if you need a unique version.
1. Header
2. Footer
3. CTA Sections
4. Button
5.Pricing
6.FAQ
To edit a component:
1. Open the Components panel.
2. Select the component instance.
3. Edit the content or detach the instance if you need a unique version.
CMS Collections
This template uses CMS collections for dynamic content.
Collections include:
1. Blogs
You can add, edit, or remove items directly from the CMS panel.
Collections include:
1. Blogs
You can add, edit, or remove items directly from the CMS panel.
GSAP Animations
Helora uses Webflow's native GSAP integration to create smooth and engaging animations throughout the template.
To edit animations:
1. Select the animated element.
2. Open the Interactions panel in Webflow Designer.
3. Locate the applied GSAP animation.
4. Adjust settings such as duration, delay, easing, or trigger options according to your needs.
If an animated element is removed or renamed, please review its associated interaction settings to ensure all animations continue to work properly.
To edit animations:
1. Select the animated element.
2. Open the Interactions panel in Webflow Designer.
3. Locate the applied GSAP animation.
4. Adjust settings such as duration, delay, easing, or trigger options according to your needs.
If an animated element is removed or renamed, please review its associated interaction settings to ensure all animations continue to work properly.
Images & Icons
All images used in this template are for preview purposes only and can be replaced with your own assets.
Icons are fully editable and can be customized according to your project requirements.
Icons are fully editable and can be customized according to your project requirements.
Support
If you need any help regarding this template, please feel free to contact us.
Email: pixcutstudiollcwebflow@gmail.com
Email: pixcutstudiollcwebflow@gmail.com
.svg)
.svg)
.svg)