Creating Events – Views
Event Calendar View Setup
Home » Administration » Structure
Click on Views
Structure > Views > Calendar
Then click on Edit button to the right of the Calendar view
Figure 27
Admin_StructureViewsCalendarMonth1.jpg
From the Month view click on the Advanced link at the right.
Figure 28
Admin_StructureViewsCalendarMonthAdvanced0.jpg
To update calendar to use our event dates we have to change the field, the sorting and the contextual filters for each view (Month, Week, Day, Year, iCal and Block
Change Fields
Change the default field to be event date and not Updated date as it is now.
Change sort criteria to event date
Click on Fields Content: Updated date
Hit remove button to remove updated field
Click Add (button) on right of Fields
Add time (Time) with defaults
Change Sort Criteria
Remove updated date from sort criteria [Remove] button
Search for Time and select Content: Time – start date (field_time)
Click [Add and configure sort criteria] button
Sort Ascending (should already be picked)
Click [Apply (all displays)] button
After changing the Fields and Sort Criteria your display should look like this.
Figure 29
Admin_StructureViewsCalendarMonthAfterChange1.jpg
Change Contextual Filters
Locate the Advanced area (right of screen).
Figure 30
Admin_StructureViewsCalendarMonthAdvancedMenu2.jpg
Under Contextual Filters:
Click on Date: Date (note (Content: Updated date)
Under the When the filter value is not in the URL
Select the radio button for Provide default value
And for Type in the drop down box select Current date
Figure 31
Admin_StructureViewsCalendarContextualViewDefaultVal1.jpg
Scroll down to Date Fields(s) section of the window
Uncheck the Content: Updated date and check the Content: Time – start date (field_time)
Figure 32
Admin_StructureViewsCalendarDisplayAdvancedFieldChange2.jpg
Click [Apply (this displays)] button
Update Contextual Filter for Week, Day, Year, and Block
Perform the same contextual update (changing field) for Week, Day, Year and Block tabs (located at the top of the view section just under Displays).
Figure 33
Change Upcoming and iCal
The Upcoming and iCal tabs need do not use Contextual Filters but we need to fix the Filter.
Click on the Upcoming tab under Displays (see below Upcoming is dark indicating it is selected).
Figure 34
Admin_StructureViewsCalendarDisplayUpcoming1.jpg
Change the Filter Criteria (on the left of the screen – not the Contextual Filters) :
Click on Date: Date (node) (Content: Updated date >= now)
Click [Remove] button to delete updated date.
Then click Add next to Filter Criteria
Search for time and then select Content: Time – start date (field_time)
Figure 35
Admin_StructureViewsCalendarDisplayUpcoming2.jpg
Then click on [Add and configure filter criteria] button
Filter granularity will be at day (if not, select day)
Figure 36
Admin_StructureViewsCalendarDisplayUpcoming3.jpg
Click [Apply and continue] button
Set the Operator to be “Is greater than or equal to”
Click on the Select a date drop down
Figure 37
Admin_StructureViewsCalendarDisplayUpcomingIsGreaterThan4.jpg
Set the Select a date drop down to be “Enter a relative date”
Enter the word “now” without quotes in the Relative date text box
Click the [Apply (this display)] button
Figure 38
Admin_StructureViewsCalendarDisplayUpcomingIsGreaterThan5.jpg
The filter criteria should now display:
Filter criteria
Content: Published (Yes)
Content: Time – start date (now) | Settings
Figure 39
Admin_StructureViewsCalendarDisplayUpcomingIsGreaterThan6.jpg
Repeat the same steps just completed for Upcoming and apply them to the iCal setting.
When iCal is done this will complete the view setup.
Click on the [Save] button at the top right of the screen
Figure 40
Admin_StructureViewsCalendarDisplaySave1.jpg
At this point your views are set up for events via the calendar.
Click on the Month tab and then click on the View Month button on the top right of the screen
Figure 41
The page should include the calendar in the middle of the page as shown here:
Figure 42
calendar1.jpg
We do not have any events entered yet so the month should be clean. Note the heading of “calendar” – this does not look good so we need to change it.
Click on Structures, Views then the word Edit on the right of Calendar from the list of views.
Under the TITLE area, click on the title “calendar” to edit it.
Figure 43
Admin_StructureViewsCalendarTitle1.jpg
Change it to “Church Calendar” or “Your church name Calendar” etc.
Click on [Apply (all displays)] button then click on the save button at top right of view.
Then click on view month button on the right.
Your calendar should now be displayed as it was above but with the corrected title of “Church Calendar”
Set up Access to the Event content type
Home » Administration » People
Click on People then click on the Permissions tab on the right top of the page.
Scroll down to Node area and find Event type
We will set up a role later for event administrators so for now allow access to admin for Event types (not all members can enter Events)
Check box for Administrator on all Event choices to allow full access.
Set the check box on the following: Create new content, Edit own content, Edit any content, Delete own content, Delete any content
Figure 44
Admin_People_Event1.jpg
Scroll to the bottom of the page and click on [Save permissions] button.
Add First Event
Click on Content then click on + Add content link
Figure 45
Admin_Content_AddContent1.jpg
Then click on Event
Figure 46
Admin_Content_AddContent_Event1.jpg
Now enter a Title and Description of the event.
Figure 47
Admin_Content_AddContent_Event2.jpg
For example, let’s enter an entry for a meeting on fasting.
We will also enter an ‘article’ about this to help promote it later.
Here is an example of a Title and Description with a date – when you are trying this pick a date in the future for the current month (in this example we are using Jan 4, 2012).
Title
The Unexplainable Life
Description
What would happen if our Church family spent 21 days praying, fasting, surrendering our wills and desperately seeking more of God…together?
Let’s find out! Please prayerfully consider participating in our 21 day journey to an unexplainable life, beginning January 8th.
To learn more about this journey, join us in the Sanctuary on Wednesday January 4 at 6:30 PM.
Location
Sanctuary
Time
Uncheck “Show End Date” since this is a one day meeting
Enter the date and time (in this example Jan 4, 2012 at 6:30pm
Click on the [Save] button to save the event.
Figure 48
Admin_Content_AddContent_Event3.jpg
The event should now appear on your browser as seen below:
Figure 49
Admin_Content_AddContent_Event4Published.jpg
Add Events to Main Menu and Side Bar
Events are a key area of communication with our church family so we need to add a Menu tab to the navigation for events, and we should add the event list to the right side of all pages.
Add Events Menu Tab to Main Menu
To add a link to the month view of our events, we need to know the link to that month view. To find the path we need to go to the calendar view and make a note of the link.
Click on Structures, then click on Views
You will be here: Structure > Views > Calendar
Click on Edit button to the right of the Calendar view
Make a note of the path shown under the Page Settings section in the middle of the page.
Page settings
Path: /calendar/month
Menu: No menu
So the path to the month view of calendar is calendar/month/
(Note we do not include the initial / and add a trailing / when setting up links for menus and within pages as will be seen below).
Click on Structure from the top menu then click on Menus from the list of structures.
We want to add the item to the main menu so click on add link on the right of Main menu
Figure 50
Admin_Structure_Menu_Event1.jpg
Fill in the following information:
Menu link title Events
Path calendar/month/
Description Church Events
(Description is the text that is displayed as a tool tip when the user hovers over the Event tab)
Figure 51 Tool Tip Displayed for Events Tab
Admin_Structure_Menu_Event3Sample.jpg
Make sure Parent Link is set to <Main Menu> in the drop down
Weight Set to 2 (or any number above 0)
Figure 52
Admin_Structure_Menu_Event2.jpg
Weight is the position of this menu item relative to the other menu items and is used to ‘sort’ the menu in the order specified by each weight. So a menu item of weight 4 would go after Event and a menu item of 1 would be before for example.
Click on the [Save] button to save your entry.
Click on the Home Icon (little House icon) at the top left of your screen to see how your menu looks.
Figure 53 Home Icon
screen_HomeButton1.jpg
Your screen should be as shown below with Home as the first tab and Events as the second).
Click on Events to see the monthly calendar.
Figure 54
ChurchCalendar1.jpg
Note that our event is displayed in the Jan 4th day.
You can check out the other event views by clicking on Week, Day and Year tabs.
Add some more events
Following the same process used above for the January 4th event let’s enter some more events so we have a list to see.
Title Wednesday Family Dinner
Description Suggested donations: Adults – $5.00 – Children – $3.00
This week’s menu: Meatloaf, Macaroni & Cheese, Vegetable, Salad and Dessert
Location Dining Hall
Time Jan 4, 5-6pm
Title Prayer Team Meeting
Description Prayer Team Weekly Meeting
Location Conference Room
Time Jan 7, 6pm
Title Ladies Bible Study
Description Mercy Triumphs
Location Conference Room
Time Jan 12, 10am
Title Mission trip Team Members Dinner
Description Team Dinner with guest speaker
Location Dining Hall
Time Feb 10, 6pm
Add Event Calendar Upcoming to Right Bar Region
The next step is to set up a list of events (not a calendar view but a list of events) so that it appears on all pages. First a word about regions of the web page.
Check the image below, the yellow areas identify the different regions of the page. We can add content to these regions by using blocks.
Figure 55
Screen_BlockRegions.jpg
A block is content that is displayed in a ‘block’ on the page.
In the case of events we want the events to show up in the Sidebar second (right hand column of a page). There is a block view available from the Calendar view that was set up so we will use that.
Click on Structure then click on Blocks from the list of structures.
This will take you to the Home » Administration » Structure area.
Scroll down to the Disabled section and find the View: Calendar: Upcoming section.
Figure 56
Admin_Blocks_Calendar_Upcoming1.jpg
This is the view that we modified earlier and is ready for use. The next step is to tell the system where we want this block to be displayed.
In the drop down to the right of View: Calendar: Upcoming, click and set to Sidebar second
Figure 57
Admin_Blocks_Calendar_Upcoming2.jpg
This will immediately move the View: Calendar: Upcoming up to the Sidebar second area of the lay out ( you can find it by scrolling up to the top area but this is not necessary).
Click on the [Save blocks] button to save the new layout.
Click on the home (little house) icon at the top left of the screen to see how your list looks.
ON the right hand side of your home page you should see the list of events (your date’s will be different but the Church Calendar list should be like the following:
Figure 58
Screen_Calendar_SidebarSecond_UpcomingList1.jpg
Change Title for List of Upcoming Events Block
Now let’s change the title of this list as Church Calendar does not seem appropriate for a list of events.
Go to Structure > Views > Calendar and Edit.
Click on the Upcoming Tab at the top of the Displays list.
Click on the Title Church Calendar
Change the For drop down to be “This block (override)” since we only want to change the title on this Upcoming block, not all views for Calendar.
Changed the Title to “Upcoming Events”
Click on the Apply (this display) button.
Click the [Save] button at the top right of the display screen to save your changes.
Figure 59
Admin_StructureViewsCalendarUpcomingEventsTitle1.jpg
Click on the home (little house) icon at the top left of the screen to see how your list looks.
The list of upcoming events on the right of the page should have the new title of “Upcoming Events”
Add Tag Field to Event Type
Tags are a great way to find and organize content so let’s add a Tag field to the event type content for future use. This will show you how to edit an existing content type to add a field – in this case adding an existing field we just want to use for events as well.
Click on Structure > Content types and click manage fields next to Event (Machine name: event).
We will be selecting an existing field so use the entries under Add existing field
Add existing field Tags
In drop down Field Name Select – Term reference: field_tags (Tags)
For Widget Select – Autocomplete term widget (tagging)
Figure 60 Add Existing Field – Tags
Admin_Content_ManageFields_Tags1.jpg
Click “Save” to add the field to the Events content type.
Set this field to required and for the help text enter
Enter tags (single words) that best describe this event (more than one is allowed separated with commas) for example: picnic, mission
Figure 61 Setting Tag field to required
admin_event_tag_field_required1.jpg
Click “Save settings”
You can now edit existing events and add Tags if you want to.
Adding an Article for the Home page
From Admin > Add Content > Article
Articles are temporary post (unlike a static web page) that are displayed for a while until they are replaced by newer content.
Let’s add an Article to highlight the upcoming meeting we added to the events calendar pertaining to Fasting. We will basically use the same information but enter it as an article.
Click Content from the main menu
Click on +Add Content and select Article
Title The Unexplainable Life
Tags meeting
(For tags which are key words to help categorize articles we enter meeting since
this is really a meeting announcement)
Description
What would happen if our Church family spent 21 days praying, fasting, surrendering our wills and desperately seeking more of God…together?
Let’s find out! Please prayerfully consider participating in our 21 day journey to an unexplainable life, beginning January 8th.
To learn more about this journey, join us in the Sanctuary on Wednesday January 4 at 6:30 PM.
Figure 62
Admin_AddContent_Article1.jpg
We want this article to go to the home page and we do not want comments allowed since it is on the home page.
Click on the Comment settings link near the bottom of the form.
Click on the Closed Radio button to prevent comment post from users.
Figure 63
Admin_StructureViewsCalendarUpcomingEventsTitle2.jpg
Next we want to publish this content and promote it to the home page. This is the default settings for Articles. Click on the Publishing options link just so you can see where you can change this on future articles if needed.
The Sticky at top of list option would cause this article to always be listed first of any content published to the home page. In this case it is the only article and we will not mind if newer articles push it down a bit so we can leave this unchecked for now (you can always change this later by editing the article).
Figure 64
Admin_StructureViewsCalendarUpcomingEventsTitle3.jpg
Click the [Save] button publish the article.
The home page will change from displaying the “No front page content has been created yet” and will now display the article under your main description.
Your home page should look something like this:
Figure 65
Adding a link to other content
Let’s put in a link to the event entry from the article above.
From the home page, click on the Unexplainable Life entry from the event list on the right of the home page.
Note that in the URL address the location for this entry is:
http://www.yoursite.org/content/unexplainable-life-0
So we will use content/unexplainable-life-0/ as the link.
Now we will edit the Article (not the event).
To find the article, click on Content from the Admin menu
Find the Article (not event) titled The Unexplainable Life
Click on the edit link on the right to edit.
The BUEditor module allows you to add links to other web pages using a link button.
Figure 66 BUEditor Module for Text Editing
Admin_Content_Article_Edit1.jpg
The current text of the Body of the article is:
What would happen if our Church family spent 21 days praying, fasting, surrendering our wills and desperately seeking more of God…together?
Let’s find out! Please prayerfully consider participating in our 21 day journey to an unexplainable life, beginning January 8th.
To learn more about this journey, join us in the Sanctuary on Wednesday January 4 at 6:30 PM.
To add the link change the wording of the last sentence to add the words “for a meeting”
To learn more about this journey, join us for a meeting in the Sanctuary on Wednesday January 4 at 6:30 PM.
Next Highlight the word meeting and click on the second button from the left of the Body tool bar (Insert / edit link)
Figure 67 BUEditor – Add Link to page
Admin_Content_Article_Edit2.jpg
A pop up window will appear for the link information.
For Link URL enter content/unexplainable-life-0
For Link text meeting
For Link Title Unexplainable Life Meeting
Link Title is what shows up as a tool tip, this is an optional entry.
Click on [OK] button to enter the link’s HTML code.
The text will change to show the HTML that was created for the link
To learn more about this journey, join us for a <a href=”content/unexplainable-life-0/” title=”Unexplainable Life Meeting”>meeting</a> in the Sanctuary on Wednesday January 4 at 6:30 PM.
Click the [Save] to publish your revised article.
Click on the home page button (little house)
You should see a revised article with the meeting link in blue.
To learn more about this journey, join us for a meeting in the Sanctuary on Wednesday January 4 at 6:30 PM.
Click on the meeting link to make sure it takes you to the Event for the Unexplainable Life.
In this case the Article and the Event text are the same, in reality you would edit one or both text to better fit where they show up – The article could have more info, and the Event could have a summary with more details on logistics of the meeting (speaker etc).
Create Main Pages and Blocks for Site Layout
Site Blocks for Navigation and Notices
Click on Structure > Blocks then Add Block
Copyright Block
Block Title (leave blank)
Block description Block: Site Copyright
Block Body: © Copyright 2012 [your origination here etc.]
Save the block.
Click on Structure > Blocks then navigate down to the content you just created
Block: Site Copyright
Then in the drop down and select Footer region.
Click [Save blocks]
Your copyright will now be the last line displayed on each website page.
Contact Block
Block Title Contact Us
Block description Block: Contact Information
Note when entering the body set the text format drop down (under the Body text box) to Full HTML to allow email links.
Block Body: Street Address
City, St, Zip
Phone Number
email@oursite.org
Note that when you enter an email address on a line, Drupal will convert that to an email link when you save the block so users can click on it to trigger their email program for sending email.
Click [Save blocks]
Click on Structure > Blocks then navigate down to the content you just created
Block: Site Copyright
Then in the drop down and select Footer first column
Click [Save blocks]
Service Times Block
Block Title Service Times
Block description Block: Service Times
Block Body:
<b>Sunday:</b>
9:30 AM- Sunday School for all ages
<b>10:30 AM- Morning Worship Service / Children’s Church</b>
5:30 PM- Evening Worship and Bible Study
(We have Nursery & Teen activities planned)
<b>Wednesday:</b>
6:15 PM- Prayer Time
6:30 PM- Bible Study
Bible Studies, Youth Activities
Children’s Department, Ladies Sewing Group
<B> is HTML for Bold and </B> is for end bold.
Click [Save blocks]
Click on Structure > Blocks then navigate down to the content you just created
Block: Service Times
Then in the drop down and select Footer forth column
Click [Save blocks]
IT will show up as the second block because we don’t have other second and third footer column data
Your contact information should now appear just above the footer on the left hand side of all pages.
That looks ok but it would be better to have it appear on the left under the User Navigation Menu that appears on the left.
Setting Block Display Locations and Display Order
Moving Times Block to Side Bar – Display Order
Move the Service Times block to the Sidebar first and then drag it up to be the second item displayed.
This will demonstrate how to move blocks to different areas of the page and to also set the order of blocks within a display region.
Click on Structure > Blocks and change the drop down next to Block: Service Times to be Sidebar first
This will move it up to the Sidebar first area of the blocks display.
Scroll up to find it and notice that is listed last.
Set Display Order of Block in Region
You can change the order of display of blocks by grabbing the drag icon (large gray plus (+) sign on the left of each entry.
Click on the Block: Service Times line and drag it to be the second entry for Sidebar first under Navigation
Click on [Save blocks] button.
Figure 68
Admin_Block_SortOrder1.jpg
Limiting Block display to select pages
Take a look at how this appears on different pages. Although it is good to have service times easy to find we don’t need to show them on every sidebar of every page.
Lets limit the display to just the Home and About pages.
Select Structure > Blocks > and click on configure next to Block: Service Times
Scroll down to Pages section.
Click on the radio button Only the listed pages
Figure 69
Admin_Block_Visibility_Pages1.jpg
Enter these two pages (one per line) in the text box under the Radio button.
<front>
content/about
<front> is the name of the home page
Content/about is the link to the about page – you can find this by navigating to the About page from a different browser where you are not logged in and make a note of the link past your base site name.
http://yoursitehere.org/content/about
Click on [Save block] button.
Now test your navigation – you should see the Service times on the home page and About pages only.
Set Foundation and Structure of Site
Pages for Site Map and Basic Navigation
Now let’s set up the basic structure and navigation of the site – creating a page place holder for each key section so we have the navigation and site map in good shape. We can then go back and edit to add more content or have other ‘editors’ edit their own pages.
Remember that our mission in this fist pass is to set up all the pages, and content types we will need so that in the second pass we can add all the finishing touches and polish to the site.
Your mission here is to build the foundation, all the rooms, elevators, phone system and calendar for the building so don’t worry if your first ‘pages’ look basic, we will re-visit each page and polish it up before we publish.
Top Level Navigation
We will start by creating place holders for each key top level page – this will also be our tab / top level navigation.
Home | Ministries | Media & Post | Events | Groups | About
Create a Basic Page
Ministries Basic Page
Click on Content from main admin menu then + Add content then Basic page
Figure 70
Admin_Content_BasicPage1.jpg
Fill in the basic information – Title will be the default name of the Menu Tab link but you can change that if needed.
Title Ministries
Body
Worship Arts
Discipleship
Preschool
Kids Ministries
Missions
Prayer Ministry
(This page will have to be updated and after we create all the Ministry pages, we will update this page so each key area links to the appropriate page. For now this is a place holder.
Next we set the Navigation for this page as indicated in the image below.
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Ministries
Description List of our Ministries
Parent item <Main menu>
Weight 2
Figure 71
Admin_Content_BasicPageMenu2.jpg
Click the [Save] button to save the new page.
Click on the home button to see your handy work.
You will notice the following tabs:
Figure 72 Menu Tabs
Admin_Content_BasicPageMenu3.jpg
Menu Weights
Note that Events is in front of Ministries, and we want that to be on the right. This is because when we first set up events we set the weight to 2 (the same weight we just set Ministries to. We will move Events later by changing its weight.
For menus we will set the following weight for each (Home is already set to 0)
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Change Menu Weight
To change the weight of Events, go to Structure > Menus then click on list links next to Main menu
Click on edit next to Events
Change Weight from 2 to 6
Press [Save] to save your changes to the menu.
Now the menu tab is in the correct order with Home Ministries and Events
Create Remaining Main Navigation Pages
Media & Post Basic Page
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title Our Church Media and Post
Body
Sermon Videos
Photos
Blogs
Forums
Next we set the Navigation for this page as indicated in the image below.
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Media & Post
Description Our Church Media
Parent item <Main menu>
Weight 4
Click the [Save] button to save the new page.
Groups Basic Page
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title Groups
Body
Check back for updated list of groups.
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Groups
Description Church Groups
Parent item <Main menu>
Weight 8
Click the [Save] button to save the new page.
About Basic Page
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title About
Body
Welcome to our church. If you’re looking for a church home, we invite you to review the information on our various ministries, and worship with us. We would like to help you take your next step in your Christian walk.
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title About
Description About our church
Parent item <Main menu>
Weight 10
Click the [Save] button to save the new page.
First Level Navigation Complete
Now check the navigation and look of the site by clicking on each link from your non admin browser (IE, Chrome or Firefox) as discussed in the “Checking the site like a visitor” section.
The home page should resemble this image:
Figure 73
Screen_HomePageWithNavigation1.jpg
Make any adjustments or corrections needed.
Congratulations!
You now have the basic high level Tab Menu and Navigation setup for your site.
Site Navigation – Main Menu and Level 1 Pages
Site Navigation refers to the way your users will move around the site and find their way to various layers.
Here is the layout of a basic menu structure using the main level we just set up as an example.
Main menu
Home
Ministries
Media & Post
Events
Groups
About
The tabs at the top of the page only display top level menu entries.
There is another menu that is displayed called the Main Menu – this menu displays differently than the tabs menu you just set up above, but it still contains the tab names as entries. They both point to the same main top level pages.
The Main menu has to be displayed somewhere else on your pages so your users can navigate all the sub levels of the site that we will be adding. We will later set it up to automatically expand as they click deeper into the levels of the site.
Set Main Menu to display in left Sidebar
We will set up to put the Main Menu block to display on the Sidebar first region but only if the user is not on the home page. We also need to sort the order so the Menu is first, then the navigation menu.
Go to Structure > Blocks
Set Main menu to Sidebar first
Figure 74
Admin_Block_Menu_SidebarFirst1.jpg
The Main Menu entry will move up to the Sidebar first area of the page. Scroll up to that entry and click on the configure link on the right.
Click the [Save block] button to implement your changes.
Now go back to Structure > Blocks
Using the sort + symbol:
Figure 75
image Screen_sortx1.jpg
Drag and drop the Main menu block so that it is the first entry for the Sidebar first group of blocks (the same method used in Set Display Order of Block in Region above.
Your blocks should look like this after setting the display order.
Figure 76
Admin_Block_Menu_SidebarFirst3.jpg
Click the [Save block] button to implement your changes.
Set Visibility of Menu Block
Set the visibility to be for all pages except the home or front page.
Now go back to Structure > Blocks
Enter the word <front> in the text box as shown below. This is the name Drupal uses to identify the home page.
Figure 77
Admin_Block_Menu_SidebarFirst2.jpg
Click the [Save block] button to implement your changes.
Now test out the display by clicking on various tabs – the menu should be the first thing displayed in the Sidebar first (left side of the screen) on all pages except the home page. If your menu is not the first thing shown in that side bar, go back to blocks and make sure you have the order of display correctly so Main menu is the first block shown for the Sidebar first list of blocks to display.
With just one top layer of pages the menu will basically look like the tab menu at the top listing the tabs as menu entries.
Main menu
Home
Ministries
Media & Post
Events
Groups
About
The Main Menu on the left comes in to play after you add sub layers to each main page, which we are about to do.
Create Menu Level 2 Content Pages for Ministries
In this section we will create the pages that go “under” a main page, in this case our Ministries Main Page. All pages that are listed under a main page are called Level 2 pages (explained in more detail below).
In this section you will set up the main page for each Ministry. All of these pages will be displayed under the main menu at the next level so we call these Level 2 pages. Any pages that are under a level 2 pages are called Level 3 pages and so on.
The process you use to enter these pages will be repeated for each Page you create on the site (regardless of level – only the navigation setup changes based on the level).
So we will start with the Ministries Main page and all of its sub pages (Level 2 and 3). Then move on to the next Main page (Media & Post) and enter all of its sub level pages and so on.
This will be become clear as we just get it done below so let’s get started.
Add Sub Pages to Ministries Main Page
The Ministries page is a Level 1 Page.
Here is what our Main Menu will look like after you finish this section and add in all the level 2 pages for each Ministry:
Main Menu
Home
> Ministries
o Worship Arts
o Discipleship
o Preschool
o Kids Ministries
o Student Ministries
o Missions
o Prayer Ministry
Media & Post
Events
Groups
About
Worship Arts
We will start by creating a Worship Arts page.
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title Worship Arts
Worship Arts – Add Image to Basic Page (Optional)
Body
First be sure that the drop down under the Body text box titled Text Format is set to Full HTML (not Filtered HTML)
To add an image from the Body text area click on the Image Icon at the top left of the tool bar.
It will pop up the Insert / edit image block.
For the Image URL enter the path to where you saved your images with cPanel.
For example to load a banner of the phrase team called Band_X400.jpg and stored here:
public_html/ChurchMedia/images
the public facing URL will be
ChurchMedia/images
so the full path relative to our website will be: /ChurchMedia/images/Band_X400.jpg
So the Image URL will be /ChurchMedia/images/Band_X400.jpg
If you know the Width enter that in the Width x Height boxes, if not leave blank
For example in the Band_X400 example it is 400 x 120
Fill in Image Block
Here is how to fill in the Image information:
Image URL /ChurchMedia/images/Band_X400.jpg
Width X Height 400 120
For Alternate text Phrase Band
Figure 78 Add Image to Basic Page
Admin_content_BasicPageAddImage1.jpg
Click [OK] button to insert HTML
You will see the following line of HTML:
<img src=”/ChurchMedia/images/Band_X400.jpg” width=”400″ height=”120″ alt=”Phrase Band” />
(http://yoursite.org/ChurchMedia/images/Band_X400.jpg)
Fill in Description Block
Under that line of image information text (if you entered one) paste the following
Message of the Music
Join us as we worship through music and God’s word each Sunday morning
Next we set the Navigation for this page as indicated in the image below.
Set Menu Navigation
Figure 79
Admin_Content_BasicPage_SubMenu1.jpg
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Worship Arts
Description Worship
Parent item – Ministries
Weight 0
Click the [Save] button to save the new page.
Now navigate to the Ministries page and make sure the sub menu entry for Ministries appears showing your new page under Ministries.
It should appear as shown below:
Figure 80
Screen_Menu_sidebarFirst4.jpg
Discipleship
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title Discipleship
Add Image to Basic Page (Optional)
Body
First be sure that the drop down under the Body text box titled Text Format is set to Full HTML (not Filtered HTML)
To add an image from the Body text area click on the Image Icon at the top left of the tool bar.
It will pop up the Insert / edit image block.
For the Image URL enter the path to where you saved your images with cPanel.
For example to load a banner for Discipleship called button_Discipleship1.jpg and stored here:
public_html/ChurchMedia/images
the public facing URL will be
ChurchMedia/images
so the full path relative to our website will be: /ChurchMedia/images/button_Discipleship1.jpg
So the Image URL will be /ChurchMedia/images/button_Discipleship1.jpg
If you know the Width enter that in the Width x Height boxes, if not leave blank
For example the button_Discipleship1 example it is 415 x 111
Fill in Image Block
Fill in the Image information:
Image URL /ChurchMedia/images/button_Discipleship1.jpg
Width X Height 415 111
For Alternate text Discipleship
Click [OK] button to insert HTML
You will see the following line of HTML:
<img src=”/ChurchMedia/images/button_Discipleship1.jpg” width=”415″ height=”111″ alt=”Discipleship” />
Fill in Description Block
Under that line of image information text (if you entered one) paste the following
Bible Studies
Small Groups
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Discipleship
Description Discipleships
Parent item – Ministries
Weight 2
Click the [Save] button to save the new page.
Preschool
Home (0) | Ministries (2) | Media & Post (4) | Events(6) | Groups (8) | About (10)
Click on Content from main admin menu then + Add content then Basic page
Title Preschool
Add Image to Basic Page (Optional)
Body
First be sure that the drop down under the Body text box titled Text Format is set to Full HTML (not Filtered HTML)
Fill in Image Block
Image URL For example – /YourImagePath/Yourimage.png
Width X Height For example 415 111
For Alternate text Preschool
Click [OK] button to insert HTML if you entered an imge
Fill in Description Block
Under that line of image information text (if you entered one) paste the following
Contact us at youremail@yourdomain.org
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Preschool
Description Our Preschool
Parent item – Ministries
Weight 4
Click the [Save] button to save the new page.
Kids Ministries
Repeat the same process used above for Preschool to create the basic page for Kids Ministries. Add a Title and for the Body, adding an image to the Body text box if you want to and then the main Description text.
Note that for each additional sub page under Ministries, we add two to the previous Weight for the Menu settings.
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Kids Ministries
Description Our Kids Ministries
Parent item – Ministries
Weight 6
Click the [Save] button to save the new page.
Student Ministries
Repeat the same process used above for Title and Body (image optional) and text.
Note that for each additional sub page under Ministries, we add two to the previous Weight for the Menu settings.
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Student Ministries
Description Our Student Ministries
Parent item – Ministries
Weight 8
Click the [Save] button to save the new page.
Missions
Repeat the same process used above for Title and Body (image optional) and text.
For example your Mission Body text might be:
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Missions
Description Our Missions
Parent item – Ministries
Weight 10
Click the [Save] button to save the new page.
Home Page for each key mission
After creating all first level pages under Ministries, we will come back to Missions and add in second level pages for all the Missions, in the mean time lets finish setup up the main pages for Ministries.
Prayer Ministry
Repeat the same process used above for Title and Body (image optional) and text.
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Prayer Ministry
Description Prayers
Parent item – Ministries
Weight 12
Click the [Save] button to save the new page.
Congratulations! You have now entered all the First level sub pages for Ministries.
Site Navigation – Sub Menus
The main menu was set up earlier (see Main Menu and Top Level Site Navigation above)
The Main Menu will automatically point to all the sub pages we just created under Ministries because you entered the navigation instructions for each page and set the weight to show in what order each page will be displayed in the menu.
Level 1 Pages
Menus are made up of layers or levels.
All of main pages shown in the tabs at the top of each page are top level pages – also called Level 1.
All the pages you just entered for Ministries are second level pages – that is they appear ‘under’ the first layer page “Ministries” and are not visible until you click on Ministries which is amain level menu item.
Here is what the Main Menu looks like before you click on Ministries:
Main Menu
Home
Ministries
Media & Post
Events
Groups
About
Level 2 Pages
When you click on Ministries and land on the main Ministries page the Main menu automatically expands to show all pages that are ‘under’ ministries – all the Level 2 pages show here in italicized.
Main Menu
Home
> Ministries
o Worship Arts
o Discipleship
o Preschool
o Kids Ministries
o Student Ministries
o Missions
o Prayer Ministry
Media & Post
Events
Groups
About
You will notice that each Ministry page is listed in the order specified by the Weight entry you put in for each menu set up as you created these pages. If you want Prayer Ministry to show up first, you would change its weight to be less that the Worship Arts weight.
Add Image field to Basic Page Content type
You can set Drupal to allow us to upload images directly into Basic Page content. The only catch is the image will be at the bottom of each page but there are ways to move it once we have it.
To add image ability to the Basic Page you will add an image field to the Basic page content type.
Go to Administration > Structure
Go to Structure > Content types and click manage fields next to Basic page (Machine name: page).
We will be selecting an existing field so use the entries under Add existing field
Add existing field Image
In drop down Field Name Select – Image: field_image (Image)_
For Widget Select – Media file selector
Click [Save] to add the field to the Events content type.
On the next page we will keep defaults so click [Save settings]
You have now updated the Basic Page type to allow the upload of new images or the selection of existing images from a library of images on the site.
The image will always be placed at the top of our page. IF you want to place the image in a different area you can use the Image tool from the Body text edit area and select the image that was uploaded so it displays where you want it to.
Figure 81 Add Image field to Basic Page Content Type
Image Field to Basic Page
Admin_Structure_Fields_Add_Existing_Image_BasicPage1.jpg
Click [Save] so save the settings
On the next page we want all the defaults so press [Save settings]
The default setting for image is to include the title “Image” above each picture as it is displayed in the page. It looks better to not have the label “Image”.
Remove Title from Image display on Basic Page
Let’s remove the display of the title “Image” above each picture.
Go to Administration » Structure » Content types
Next to Basic page (Machine name: page) click on manage display
Figure 82 Remove title above image for Basic Page
Admin_Content_BasicPage_ManageDisplay1.jpg
Next to Image change the drop down select box to <Hidden> to remove labels from images.
Click [Save]
Note that once you upload an image using the [Select media] button to the site, it will be available for use on any page or content. So if you deleted the image from the original page you needed it for, you can add it back manually using the image tool button once you know the path, or you can add it to the bottom of any page by using the [Select media] button and browsing the library to find it.
Image Files Storage Location
To manually set where the image is displayed in a page you will use the BUEditor image button to add an Image to the content (as discussed above in the Worship Arts – Add Image to Basic Page (Optional) section).
The images are stored here:
/sites/default/files/styles/square_thumbnail/public/yourimagehere.jpg
Create Menu Level 3 Content Pages
In this section you will add two mission pages under the Missions Main page that was created above. All of these new pages will be displayed in the Main Menu under Missions – You will not see them as options until you click on Missions menu link which is under the Ministries menu link.
For example our first mission page will be “Amazon Mission Trip”. It will be under the Missions Page which is ‘under’ the Ministries page.
Ministries > Missions > Amazon Mission Trip
Level 1 >Level 2 > Level 3
Any pages that show up under Level 2 pages (like Missions) are called Level 3 pages.
This will be become clear as we just get it done below so let’s get started.
Add Level 2 to Missions Page
The process of adding this page is the same as you followed above for all the other pages. Only the navigation process changes slightly.
Amazon Mission Trip
Repeat the same process used above for all the Ministry pages.
Title Amazon Mission Trip
Add Image to Basic Page (Optional)
Body
You can add a picture like we did above for the level two pages or skip this and use the new select media option below to add a picture to the bottom of your page.
First be sure that the drop down under the Body text box titled Text Format is set to Full HTML (not Filtered HTML)
Add the image for this mission trip (if you have one ) following the steps used above on earlier pages.
Fill in Description Block
Under that line of image information text (if you entered one) paste the information about the trip.
For example:
If you are interested in going on our Mission trip to spread hope, faith and healing to the people of the Amazon basin please contact us.
We are a non-profit organization so your trip payment may be tax deductible.
Select Media
If you want to add an image to the bottom of the page click on [Select Media] button.
Browse your library or upload a new image.
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Amazon Mission
Description Mission trip to Amazon River Basin
Parent item — Missions
Weight 2
Figure 83 Set Menu for Level 3 Basic Page
Admin_Content_BasicPage_Level3Menu1.jpg
Click the [Save] button to save the new page.
The process of adding this page is the same as you followed above for all the other pages. Only the navigation process changes slightly.
Disaster Relief Mission
Repeat the same process used above for all the Ministry pages.
Title Disaster Relief Mission
Add Image to Basic Page (Optional)
Body
You can add a picture like we did above or skip this step and use the new select media option below to add a picture to the bottom of your page.
Fill in Description Block
Under that line of image information text (if you entered one) paste the information about the mission.
For example:
If you are interested in joining us on the disaster relief efforts for the impacted region please contact us.
We are a non-profit organization so your trip payment may be tax deductible.
Select Media
If you want to add an image to the page click on [Select Media] button.
Browse your library or upload a new image.
Set Menu Navigation
Under Menu settings set the following:
Click on the Provide a menu link check box to the right of Menu settings
Fill in the following entries
Menu link title Disaster Relief Mission
Description Mission trip to help with disaster relief
Parent item — Missions
Weight 4
Click the [Save] button to save the new page.
Now click on home and navigate to the main missions page
>Home > Ministries > Missions
Figure 84 Missions Menu and Main Page
screen_MissionsMainPage1.jpg
Note that the menu is a little crowded and the Disaster Relief Missions entry is taking up two lines.
Figure 85 Main Menu Missions Selected
screen_MainMenu_Missions1.jpg
Edit Menu Title of Existing Page
We can edit the menu entry for this so it is shorter. The title on the page will still be correct.
Navigate to the Disaster Relief Page using the main menu (like you would if you were a visitor)
Start by clicking on the Home icon (little picture of a house) at the top left.
Click on the Ministries Tab in the top menu bar (remember our Main Menu does not display on the home page).
Then click on the Missions link on the menu.
Next click on the Disaster Relief Mission menu entry.
Your page should be something like this (as far as the Menu display is concerned).
Figure 86 Disaster Relief Missions Page
screen_Ministry_Missions_DisasterRelief1.jpg
Note that there are two tabs on the top of the page under the Disaster Relief Missions Title.
View and Edit
Normal visitors to the site will not see those tabs since they do not have edit ability (as shown below)
Figure 87 Disaster Relief Missions Page – End user view
screen_Ministry_Missions_DisasterRelief_EndUser1.jpg
These tabs are an easy way for editors (people who have the authority on the site to edit content) can quickly get to Content > Edit
Click on the Edit tab to edit this page’s content and change the Menu title to Disaster Relief (take off the word Mission)
Figure 88 Basic Page Menu Title Change
Admin_Content_BasicPageMenuTitleChange1.jpg
Click [Save] to save your changes.
Now the menu is nice and clean – on one line as shown below.
Figure 89 Disaster Relief Menu after Menu Edit
screen_MainMenuMissionsDisasterReliefMenuAfterEdit.jpg
Congratulations! You have now completed setting up the Level 2 pages for Missions.
[[[[[[[[[[[[[[[[[[[[[[ Site Map ]]]]]]]]]]]]]]]
File Locations
Files uploaded are stored here on Host Gator
public_html/sites/default/files
Files uploaded are stored here on Host Gator
public_html/sites/default/files/styles/medium/public/field/image
Direct path from web site:
http://yoursite.org/sites/default/files/styles/medium/public/field/image/yourimage.jpg
Main
Ministries
Worship Arts
Discipleship
Preschool
Kids Ministries
Student Ministries
Missions
Home Page for each key mission
Prayer Ministry
Media and Post
Sermon Audio / Video
Other Videos
Photos
Blogs
Forums
Events
Groups
Members
About
Contact Us
Service Times
Staff
Staff Profiles
Pastor
Worship Leader
Youth Pastor
Kids Ministry
Day Care Leader
Prayer Ministry
Mission Leaders
Finance Director
We Believe
Resources
Links
Site Map
Content for Map
Main
Ministries
Worship
Discipleship
Preschool
Kids Ministry Director – Sally
Student Ministries Youth Pastor – John
Prayer Ministry – Ralf
Missions
Shepherd’s Care Director – Mary
Worship Arts
Discipleship
Preschool
Kids Ministries
Missions
Home Page for each key mission
Prayer Ministry
Media and Post
Sermon Audio / Video
Other Videos
Photos
Blogs
Forums
Events
Groups
Members
About
Contact Us
Service Times
Staff
Staff Profiles
Pastor
Worship Leader
Youth Pastor
Kids Ministry
Day Care Leader
Prayer Ministry
Mission Leaders
Finance Director
We aBelieve
We Believe…
Resources
Links
Site Map