Covenant is a modern, minimal, clean, and bold, church website design that helps your ministry stand out from the crowd.
Covenant features content options that will serve the needs of any size church. From church plants to multi-campus ministry, it provides info on the homepage to engage your visitors and your members. Featuring the largest image rotator we offer, with bold colors and modern typography, this design will give your church an eye-catching and engaging web presence right out of the gate.
This article will describe special features of the Covenant design, and help you manage the content on your website. If you still have questions after reading this Guide, please review all of the videos and articles in the Help Center.
To see our preview of this design: covenant.churchplantmedia.com.
Covenant Pixel Sizes
Homepage Rotator: 3200 wide by 1625 tall
Quicklink Background: 3200 wide by 626 tall
Subpage Headers: 3200 wide by 644 tall
Sermon Series: 1000 wide by 672 tall
Featured Blogposts: 618 wide by 398 tall
Featured Events: 310 wide by 200 tall
To crop and resize your images we recommend using either Adobe Photoshop Elements (under $100) or a free alternative like Pixlr (https://www.pixlr.com/web) or Canva (https://photo-editor.canva.com). There is also a free version of Photoshop that you can use here: http://www.photoshop.com/tools.
A Word About Saving Images
Larger pixel sizes look better on Retina Displays but they can also be large file sizes if they are not optimized. To reduce file sizes and help speed up load times, be sure to use “Save for Web & Devices” in Photoshop or a similar setting in other tools. Always save photos at 50%–70% quality (or lower).
Adding Your Logo
To add your logo to the site follow these steps:
- Make sure the logo file is a transparent png.
- Name it logo.png and save to your computer.
- Login to the CMS and go to Publish > Files.
- Search for "logo" and you'll see "logo.png" listed.
- Click the filename and then: Upload a New File.
- Select your logo file and click: Start Uploading.
- Click: Save to publish the logo to the website.
- Your logo will now appear in the header.
If any adjustments are needed, please let us know by creating a case in the Help Center (FYI: you may need to clear your cache to see the new logo appear on your site).
A Word About Fonts
We normally limit the number of font options that are available, because we have found that the more font options we give, the more disjointed the site becomes (different font styles, effects, sizes, colors, etc.). Consistency is key, so limiting the font selection to a predetermined “matching” fonts list is usually best.
To see a list of the 7 font styles you have available, go to:
You can utilize these styles by using the “Format” drop-down box while editing a page.
Main Navigation + Pages
The navigation allows for about 5-7 top level links to pages and an unlimited number of 2nd and 3rd level links. You can fit more top level links if you limit each top level link to a single word. When we install the site there is a “Home” link to the homepage for usability reasons, however, this link can be removed to create room for another link as needed. To create pages or manage the navigation go to Publish > Pages and Publish > Navigation. It will be easier to organize your navigation by first creating most of your pages.
To learn how to build your pages and navigation, visit these links:
A Word About Links + Page Content:
For usability reasons, please do not link top level navigation items to external websites. Think of your navigation as an elevator to floors in your building and not as a map out to the world. And when creating pages or a blog, please avoid using the words “Coming Soon” or “Under Construction” as the only content on the page. A good rule of thumb is: always under-promise and over-deliver.
A Word About SEO (Search Engine Optimization):
Be sure to add 150-160 character descriptions to all of your pages, including your “Home” page. These will be displayed on Google when people search for your website. Make sure that these are different for every page, but be sure to use keywords that people will be using on Google as they search for your church or ministry. And when you add your page content, make sure you use those same keywords in your text. A great resource for learning about SEO is the Beginners Guide to SEO by Moz.
Character Count Online is another helpful tool that will come in handy when creating page descriptions and other content: http://www.charactercountonline.com.
This image rotator is one of the most noticeable parts of the Covenant design. You can add, remove, replace or link the images by going to Publish > Rotator.*
*NOTE: Recommended pixel size for Rotator is 3200 wide by 1625 tall.
To edit this area, go to Publish > Widgets > Homepage Welcome. Within this widget you can add a title and a paragraph. We recommend that you put text here that will welcome visitors and tell them what to expect when they visit. Please make sure the “Title” (first line) section stays in the Heading 2 font, and the "Paragraph" text stays in the Paragraph font.*
*NOTE: Limit the “Title” to 3–8 word (14 characters max) and “Paragraph” to about 65–70 words total (400–430 characters max).
Worship Times + Google Map
This area is designed to share the days and times of your 5 most important weekly events, along with a map to your building or meeting location. If you do not have 5 weekly events that you can highlight and if you do not have a meeting location, feel free to use these widgets for whatever will serve your ministry.
To edit the days and times, go to Publish > Widgets > Worship Times. In the widget you will see a table with 10 cells. In the left column you can add your days of the week, and in the right column you can add the times. Please just replace the text that is there and do not change the font style. Each cell is intended to have very brief text with only a few words or numbers in each cell.
To edit the Google Map, go to Publish > Widgets > Homepage Map. This widget requires embedding a Google Map by going to https://www.google.com/maps. Type in your church or ministry name or your address. Once the map is displaying what you want, click SHARE > Embed Map > Custom Size. Type in 500 x 235, then select and copy the Google code. Go to the Homepage Maps widget and click the “Edit HTML” tab. Paste in the Google code and look for: width=“500” and change it to width=“100%”.
The 3 Quicklink buttons below the “Welcome” and “Worship Times” are essential to this design. To edit any of these button titles and subtitles, go to Publish > Widgets > HP Quicklink 1, HP Quicklink 2, and HP Quicklink 3. The first line title must be in the Heading 2 font and the second line subtitle must be in the paragraph font. The first line title is designed to be a 2—3 word phrase (15 characters max) and the second line subtitle is designed to be a 3–5 word phrase (30 characters max). To link the button to other pages, select all of the text and click the link tool (linking to external websites from quicklinks is not recommended).
You can also change the background image* in this section. The design will add color to the photo on the live site to match the design, so this photo should be black and white. To change this photo, go to Publish > Files > bg_ql > Upload a New File.
*NOTE: Recommended pixel size for background photo is 3200 wide by 626 tall.
There are 3 widgets that allow you to edit the 3 columns of navigation in the footer. This can either be an exact duplication of your navigation, or you can use it to highlight specific links. To edit these link columns, go to Publish > Widgets > Footer Links 1, Footer Links 2, Footer Links 3, and Footer Links 4. Make sure to keep all of the text in the “Paragraph” font and in a bulleted list.* To edit, simply replace the links in the list and link them to the pages in your site. The first item in each list will automatically be enlarged and serves as a title.
*NOTE: Navigation links should be 1–4 words each (20 characters max).
Social Media Icons
This section allows you to display up to 5 social media icons. To add these, go to Publish > Social Links. From there you can edit, add, and arrange different links to the social networks your organization uses for outreach and connection.
Footer Logo + Contact Info
This widget allows you to add a logo, address, phone number, and primary email in the footer of your website. To edit this section go to Publish > Widgets > Footer: Church Info. When uploading a logo to add it above the text, be sure the logo is a PNG file with a transparent background, so the color of the footer is visible behind the logo. Please also make sure to keep all of the text in the “Paragraph” font. If you want the email to open an email application, simply type the email address, select it, and click the link tool. From there, click the Email Address tab.
A Word About Events
When adding events into the Calendar, please do not forget the most important event of your week. Believe it or not, many churches forget to add their weekly gathering as a reoccurring event. Be sure to add the time(s) and location along with some helpful info about what people can expect if they visit.
A Word About Settings
You are also able to connect your website to various 3rd party social media and other services by going to Admin > Settings. In this area, you are able to select a Bible version that will display whenever a Bible verse is written out on your pages and in your Sermons/Podcasts. You can also connect a Twitter account and/or Facebook Page to share new posts every time you publish new Sermons, Events, and Blog Posts. You are also able to add your Google Analytics account to track all of your visitor statistics and your Google Sitemap Verification Code. Lastly, if you do not have online giving, you can easily connect a PayPal account that will create an “Online Giving” page that you can add into your navigation.