Website Documentation
Version 1.0.0
Welcome to the tutorial document for using the Calvary Church website, before I go on I would like to mention that I didn’t make this website myself and as such I’ve done my best to learn how it works myself in order to communicate the inner workings. It’s a detailed overview, though there are areas where going into too much detail seemed counter-productive, so if there’s anything you need help with feel free to email me on matt@western.graphics anytime and I’ll help however I can.
First things first, head over to https://calvarychurchpembs.co.uk/wp-admin to log into the back end of the website. In case you’re not aware, “wp” stands for WordPress, which is the platform used to build this website. I’ve made a user for you to log in as a site admin, which gives you full control of the WP Dashboard.
TIP: In case you’re unfamiliar with WordPress, as an admin you do have access to areas where you could unintentionally affect the website so it’s wise to stick to these instructions or contact me if you ever need a hand.
For security reasons the user login isn’t listed here on a public page, refer to the details you have been sent.
TIP: You are able to change the password once you’ve logged in, if you would like to use something a little easier to memorise.
Once you log in you land in the WP Dashboard, where you can see a menu down the left-hand side. This menu is how you navigate the back end of the website, so it might be worth taking a minute to familiarise yourself with the interface by viewing some of the different menu items. You can ignore the notices that appear in the top of the window for things that need updating, these aren’t worth the risk. The site was built a few years ago by a third party, so updating things could create a compatibility issue.
So, presuming one of the main areas you’ll be likely to make changes is on the pages themselves, let’s click ‘Pages’ in the aforementioned side-menu. You’ll be presented with a list of pages. The top one (called Home) says “front page” next to it, which means it’s the page that’s active as the main homepage for the website. To make a change on this page we’ll need to access the edit screen, do this by clicking its name or the ‘Edit’ link that appears when you hover over the element.
This is where things get a little more technical, so what I’ll do is break the page down in the order that the sections appear on the website’s homepage. So the first thing is the hero image, with the Pastor pointing at the church and a large heading aligned to the left.
This section is referred to as the ‘Featured Area’ of the page, so in the Page Editor you’ll need to scroll down past the grid of icons (content blocks) and beyond the rows of various content elements which are in use until you can see the section called ‘Vam-Tam Options’ with a series of options and setting which you can alter according to whatever you’re looking to change. You can change the photo of the Pastor here by clicking the ‘Insert’ button in the ‘Featured Area Background’ or if you keep scrolling down you’ll find some text boxes. The top box is for the main heading and the second box is the sub-heading.
As you continue to scroll, you’ll arrive at a third text box, which is the ‘Welcome’ area of the homepage. You can update the message here and the image that appears alongside it can be changed by clicking the little pen that appears when you hover over the current image.
The third section of the homepage is the ‘About Us’ and to make changes to this you’ll need to make your way to the row in the Page Editor that’s labelled “ABOUT US” which features four blocks in a row that are labelled “Service Box” as the people who made the website used these preset boxes as their template for the sections of the About Us. When you hover over one of the blocks you can see a little pen appear, click this to edit and this will trigger the editing area to expand. You can change the template if you wish (though it’s wise to leave it consistent for the four boxes) as well as altering things like the Image, Title and Description for that particular block. Once you’ve made your changes, click to save the element. Repeat this for the other three, should you need to. If you’re looking to make change to the pages that these blocks link off to, read on and I’ll explain.
Following this section on the Homepage are the Upcoming Events, Latest News and then a quote from the Pastor. The content for these areas is predominantly controlled by a separate area of the WP Dashboard.
If you go back to the Pages section of the WP Dashboard and look for a set of sub-pages which are listed underneath the About page; these are called Donations, History, We support, What we believe, Mission & Vision and Meet the Leadership. I’ve made the four pages that appear in the About Us grid bold here for reference.
So to make changes to the pages that load when one of each of these elements is clicked on the Homepage, click the name of the appropriate page and you’ll land in a Page Editor much like the one you were just in for the Homepage, just for the sub-page of the About section.
INFO: If the page doesn’t look the same and it’s just a box of part text, part code, look for the three tabs towards the right-hand side and click ‘Vamtam’ which is the page builder that the company used to make the website.
The four pages vary slightly in terms of content, most have Featured Areas just like the Homepage which you edit the exact same way, they also predominantly feature text/image blocks which you edit in much the same way as the four About Us blocks we looked at when editing the Homepage. I’d suggest you take your time looking at the content they’ve already got on the live page then compare this to the blocks in the Page Editor to spot where each part of the page’s content is controlled, then make a couple of changes and check they’re correct. You’ll get the hang of the way it works as you use it, it might sound technical but the WordPress platform is built to be user-friendly. Once you’ve made your changes, be sure to save the content and check the page looks alright.