Getting started

Styleguide

Ready to get to know the template? The Style Guide page is you starting point, displaying all the core elements. Additionally, there's a dedicated section illustrating the use of utility classes. Dive deeper to grasp its nuances

‍

Editing Colours/Fonts

All fonts and colours are set up as Webflow Variables. Head over to Variables page (V) and tweak your away!

‍

Editing Brand Mark

1.  Head over to Styleguide, scroll to graphics and double click Brand Mark component to enter edit mode.
2. Click on the HTML Embed element and paste your svg code there.

‍

Cleaning up your theme / Removing promotional content

To ensure your site looks polished and free from unnecessary content, follow these straightforward steps:

1. Delete Theme Overview / Licenses / Changelog pages then head over to Style Selectors and click on the Brush Icon to remove all the styles associated with demo pages.
2. Double click on Footer Component your page and remove the “Webflow Buy” Link

Editing Site Navigation

Overlay Menu

1. Double click on your Site Nav component on the page to enter the edit mode
2. Select Overlay Menu element and set Display to Flex in the Styles panel
3. Add/Remove/Edit your links
4. Once you’re done Overlay Menu element and set its Display to None

As it’s a Component the changes will reflect across all pages the element is used on

Overlay Menu

1. Double click on your Site Nav - Classic component on the page to enter the edit mode.
2.  Add/Remove/Edit your links
3. To Edit Dropdowns, select Top Nav Dropdown item, head over to Settings, Click Show under the Dropdown Settings and Edit your links.

As it’s a Component the changes will reflect across all pages the element is used on

‍

Swapping Overlay Menu for Classic Menu

If you prefer to use Classic Menu instead of the Fullscreen overlay menu delete the Site Nav component in the Navigator, head over to the symbols panel and drag Site Nav - Classic as the first element in the Page wrapper.

Homepage v2 Interactive Scroll section

1. Click on Track Frame, head over to Overflow Settings in the Styles panel and set it to Scroll
2. Use your trackpad or mouse to Scroll to the right and edit all “Scrolling items” elements.

Alternatively you can set the width and min-width of a scrolling item to 33% so you can see them all and edit that way. Set both values back to 50% once you’re done editing. If you need any help with this, please reach out!

Hero Section Media (Image/Video)

You have an option to use either background video or an Image in your hero section.

Image: To use image Simply add an image in your Hero Media element

Video: To use video remove the “Image” element and add a background video with a class of Background 

You can also directly copy video hero section from Our Church page and image hero from Donate page