Blocs Master

Share this post

Church Template for Blocs

blocsmaster.substack.com

Discover more from Blocs Master

Detailed learning materials, design resources, and real human support to help you master your web design skills with Blocs 5.
Over 4,000 subscribers
Continue reading
Sign in

Church Template for Blocs

Today, I am happy to share with you another new template for Blocs app. Church template is the perfect starting point for websites of churches and other religious organizations.

Eldar Gezalov
Feb 15, 2020
Share this post

Church Template for Blocs

blocsmaster.substack.com
Share

Church has been one of the most popular template requests from Blocs Templates members for a while. I will be honest, I didn’t know what pages and sections a typical church website should have, so I have done a lot of research before building this template.

Church is available to Blocs Templates members for free

If you have purchased the All Blocs 3 Templates package before, you can re-download the updated template library, which now includes the new Church template.

CHECK OUT THE CHURCH TEMPLATE

Church-Specific Pages

Although there are a lot of different types of pages on church websites, I have come to a conclusion that my template should include the following church-specific pages in addition to regular about, home, and contact pages:

- Events
- Ministries
- Sermons
- Donations

As you can see form the demo of Church template, I have decided to build a donation section into the navigation bar. This way, it is accessible from any part of the website with just one click. At the same time, if you don’t want to have a Donation function on your Church website, you can simply remove the row in the header and change the button to something else.

Template Release Notes

- All Necessary Pages for Church Websites (sermons, ministries, events, etc)
- Ministry page with modals applied to each ministry
- Sermons page with video modals for each sermon, as well as download buttons set
- Great looking events page with unique event design
- Animated About page with all necessary sections like (pastors, beliefs, story, etc)
- Contact Page with custom form and embedded Google Map widget
- Donate button with Donation Form in the header toggled with Visibility feature
- Fully Responsive navigation menu
- Responsive (breakpoint-specific) margins between links and other elements
- Cleaner typography, font sizes (H1, H2, H3, H4, p, a, etc) optimized for all breakpoints
- Adjusted (darken) color of the toggle icon (via code in Code Editor)
- Special navigation (sidebar) background menu applied and styled accordingly
- Footer with a responsive navigation menu (edit manually if needed)
- Fully customized contact form fields, typography, and effects
- Responsive page header blocs (font sizes and side padding)
- Customized Scroll to Target button
- Fully Responsive Column Width for Page Headers
- Fully Responsive Bloc Padding (per breakpoint, add padding class to new Blocs)
- Customized default button styles for glossy, clean, wire buttons
- Sticky navigation bar shadow removed
- Custom padding for navigation bar applied (varies per breakpoint)
- Disabled focus state blue shadow for form fields
- Default Project Settings adjusted
- Project Export settings adjusted
- Default Global Color Swatches Adjusted (just change the brand colors)
- Cleaner Alert message style applied

Church Template User Instructions

Sermons Page

Make sure to add mp3 files with audio recordings to asset manager, and then link each file to the audio player button for the sermon. Also, don’t forget to change the embed code for the video. If you don’t have a video for a sermon, just delete the button with video icon. Also, make sure to change the URL for download icon, so it matches the filename of the mp3 recording located in audio folder. Alternatively, you can replace the audio file with a PDF document.

I originally designed the audio play button to toggle the visibility of a separate audio player bric, which was hidden by default, and was shown on a click, but after consulting with a couple of Blocs Templates users, I have decided to replace it with a regular button, which you can set to any interaction yourself. Depending on where your sermon recording will be stored, you can just link the URL for audio playback.

Modals

Church Template heavily relies on Modals. Make sure that you check the IDs of modals before linking them to different links and buttons. Also, if you create a new sermon or ministry, make sure to add an ID to a new Modal, and link it to the new links, buttons or images.

By the way, I have disabled the close button for all modals by default. To close the modal, the visitor needs to click anywhere on the screen. If you would like to have a close button instead, you can select the modal, and enable the close button in the sidebar.

Donations

Make sure to change the form submission success URL to your payment platform of choice to receive the donations. Alternatively, you can place a payment from in place of contact form.

Support

If you have any questions or need help with anything, get in touch with me using the Contact page, and I will get back to you as soon as I can.

LEARN MORE ABOUT BLOCS TEMLPATES

New to Blocs? Visit Blocs website
Share this post

Church Template for Blocs

blocsmaster.substack.com
Share
Previous
Next
Comments
Top
New
Community

No posts

Ready for more?

© 2023 Eldar Gezalov
Privacy ∙ Terms ∙ Collection notice
Start WritingGet the app
Substack is the home for great writing