Get Started Learning Drupal 7 Site Building Open Outreach by Nicholas Roberts is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.

Get Started Learning Drupal 7 Site-Building With Open Outreach Author: Nicholas RobertsDate: 2 January, 2012Website: www.OpenSourceCollege.org Email: info@OpenSourceCollege.org

Get Started Learning Drupal 7 Site Building Open Outreach1 Reset Password, Request New Password1.1 Change Admin Profile*1.2 Upload User Image1.3 View Profile1.4 My Follow Links1.5 Author Bio1.6 View Updated Author Bio1.7 Add Content1.7.1 Add Content1.7.2 Create Article1.7.2 Add Article Image1.7.3 Preview Article1.7.4 View Article1.7.5 Homepage1.8 Appearance1.8.1 Granada Settings1.8.2 Granada Settings Logo & Background Image1.8.3 Granada Settings Colors1.8.4 Granada Settings Updated1.8.5 View Granada Theme Updated1.9 Events1.9.1 Create Event1.9.2 View Event1.9.3 View Event Calender1.9.4 Links1.9.5 Create Link1.9.5 View Link1.9.6 View Links1.9.7 View Multimedia1.9.8 Add Highlighted1.9.9 Homepage1.10 Configuration1.10.1 Site Information*1.10.2 Account Settings1.10.2 Comment Notify1.11 People1.11 Add People1.12 Content Management1.12.1 Content Filter By Published1.13 Dashboard1.14 Modules1.14.1 Enable Module Module Filter1.14.2 Filter Modules by "Admin"

BackgroundThis guide is written for an online education short-course run by Merritt College.

0. How to Use this Guide1. Your website IS NOT www.OpenSourceCollege.org and so the links in this document

WILL NOT work for you !2. You can also copy and paste the relative path i.e. /user/register into the location bar in

your browser3. You will need to update your website address;

YOURUSERNAME.dev.lab.opensourcecollege.org

GET STARTED

1 Reset Password, Request New Password 1. You will receive an email with a one-time link that you click and then your browser will be

taken to a Reset Password Login2. You can only use this login once ! 3. If you need to get a password reminder go to http://opensourcecollege.org/user/

password4. To create a new user http://opensourcecollege.org/user/register

1.1 Change Admin Profile

1. After login you will see the User profile edit page http://opensourcecollege.org/user/1/edit

2. Change the Username field from admin3. Change the Password field, repeat the

password NOTE: Make a strong password using the tips provided next to the field

4. Select the check-boxes for ALL the Roles; editor, blogger, contributor, administrator, authenticated user

5. Upload a picture, use the check-box to Delete picture if you want to change it

6. In Administrative Overlay de-select “Use the overlay for administrative pages”

7. Change the Locale Settings to your specific locale

1.2 Upload User ImageAfter selecting the All Roles and Uploading a Picture you will get something like this below

1.3 View Profile1. Select the View tab in the User profile page and visit the profile http://

opensourcecollege.org/users/niccolox

1.4 My Follow Links1. Click the My Follow Links http://opensourcecollege.org/user/1/follow2. Update the fields with links to profiles of social media sites such as Facebook, Vimeo,

YouTube3. Click submit4. You can check the links

1.5 Author Bio1. Visit the Edit http://opensourcecollege.org/user/1/edit and click the Author Bio sub-tab2. Update the First Name, Last Name and Bio

1.6 View Updated Author Bio1. View the user profile to check the changes http://opensourcecollege.org/users/niccolox2. Go back to edit if you want to make more changes

1.7 Add Content 1. Click the Add Content on the Content shortcuts on the profile page

1.7.1 Add Content

1. Visit http://opensourcecollege.org/node/add2. On the Add Content page you have a choice of Content Types to choose

1.7.2 Create Article

1. Create Article http://opensourcecollege.org/node/add/article

2. Add Title3. Select Image4. Add tags with commas5. Add Body text, use the formatting options such as

bold, italic, underline, bullets, numbering etc

6. Insert image by clicking the images icon RESOURCE: Watch this screencast on Articles in Open Outreach http://openoutreach.org/media/60

1.7.2 Add Article Image

1.7.3 Preview Article

1.7.4 View Article

1.7.5 Homepage 1. Visit the homepage to check the new Article content http://opensourcecollege.org/

1.8 Appearance1. Click on the Appearance tab in the toolbar at the top of the page

2. Next we will start to change the Appearance of the website http://opensourcecollege.org/

admin/appearance3. We will work with the Enabled Themes available. We will use the Granada theme and

begin by clicking on the Settings link next to the Theme screenshot highlighted in red below

1.8.1 Granada Settings1. Clicking on Settings will take us Granada settings http://opensourcecollege.org/admin/

appearance/settings/granada2. On this page we can change many common theme options3. However, at this stage, we will remain limited to using changing Images and Colors

which are blue links at the bottom of the page4. We need to click on Images and Colors and the area will expand

TIP: You can watch an OpenOutreach.org Screencast on modifying appearance http://openoutreach.org/media/61

1.8.2 Granada Settings Logo & Background Image

1. Expand the Images and Colors blue links2. For Images

a. Click on Choose File for logo b. TIP Logo Image will NOT be compressed or resized, you will need to do that in

an image tool like GIMP, a logo of 70 pixels height and wide works wellc. TIP: Background image needs to be large, 1600 wide is goodd. TIP: Be careful not to upload images that are too large, this will slow down the

site and degrade the user experience3. For Colors

a. Either change the Color Code hexadecimal valueb. or, click in the color box and use the color wheel to select a new color for Header

or Primary color and a secondary color4. Click submit

1.8.3 Granada Settings Colors

1.8.4 Granada Settings Updated1. New logos, background image and colors will be visible on Granada Settings page

1.8.5 View Granada Theme Updated1. To view full changes to Appearance, visit homepage http://opensourcecollege.org/

1.9 Events

1. Navigate to the Events landing page http://opensourcecollege.org/event2. Click on the Add a new events link 3. RESOURCE: Watch this screencast on Events in Open Outreach http://

openoutreach.org/media/60

1.9.1 Create Event

1. The Create Event form is at http://opensourcecollege.org/event/add

2. Add Title3. Add Date and Time of Event4. Select Show End Date for an event that spans

longer than one day5. Add Tags describing the event6. Select an Image associated with the Event7. Add Description text like you have already in the

Article

8. Format the Description text with Bold, Underline,

Italics and add Hyperlinks 9. Hyperlinks can add links to other websites or web-

pages

1.9.2 View Event1. View Event http://opensourcecollege.org/event/edt-801-learn-drupal-7-site-building-

communication-and-ecommerce-open-outreach

1.9.3 View Event Calender1. View Event Calender http://opensourcecollege.org/event

1.9.4 Links

1. Visit the Links page http://opensourcecollege.org/link2. Add a new link by selecting the blue link highlighted in red below

1.9.5 Create Link

1. Create a new Link http://opensourcecollege.org/link/add

2. Add Title3. Add Body text as in Event or Article 4. Select and Upload an Image5. Add Link URL and Link Title

1.9.5 View Link1. http://opensourcecollege.org/link/open-outreach

1.9.6 View Links1. http://opensourcecollege.org/link

1.9.7 View Multimedia1. http://opensourcecollege.org/file

1.9.8 Add Highlighted

1. Add Highlighted http://opensourcecollege.org/node/add/highlighted

2. Add Title3. Select Image4. Add Kicker i.e. highlight text, two or three sentences5. Add Link to an external URL or a page on your website

1.9.9 Homepage1. Visit Homepage to review Highlighted content http://opensourcecollege.org

1.10 Configuration1. Watch this screencast on Configuration in Open Outreach http://opensourcecollege.org/

admin/config2. Click on Configuration http://opensourcecollege.org/admin/config3. We will change Account Settings, Site Information and review Comment Notify

1.10.1 Site Information1. First, we will change the Site Details of the Configuration by clicking on the Site

Information link on the Configuration page http://opensourcecollege.org/admin/config/system/site-information

2. Change the Site Name to a better name3. Add a site Slogan 4. The Site Name and Slogan can be reviewed on the homepage

1.10.2 Account Settings1. Go to Account Settings http://opensourcecollege.org/admin/config/people/accounts2. There is no need to change any of the default settings, they work very well for most

websites, but it may be useful in the future during a later stage

1.10.2 Comment Notify1. Go to Comment Notify http://opensourcecollege.org/admin/config/people/

comment_notify2. Select the check-box for other Content Types; Article, Blog, Book page, Event,

Highlighted, Link and Section so that you will get notification on all content

1.11 People1. http://opensourcecollege.org/admin/people

1.11 Add People1. http://opensourcecollege.org/admin/people/create

1.12 Content Management1. http://opensourcecollege.org/admin/content

1.12.1 Content Filter By Published

1.13 Dashboard

1. http://opensourcecollege.org/admin/dashboard

1.14 Modules1. http://opensourcecollege.org/admin/modules

1.14.1 Enable Module Module Filter

1.14.2 Filter Modules by "Admin"

1.14.3 Enable Backup & Migrate Modules1. Go to Modules page http://opensourcecollege.org/admin/modules2. Type “Backup” (without “ ”) into Module filter3. Two modules appear that you select the check-box

a. Backup & Migrateb. Backup & Migrate Files

4. Select both Backup modules5. Bottom left of page select Update button

Save Configuration

1.14.4 Enable Demonstration Site Module 1. On Module page again http://opensourcecollege.org/admin/modules2. Type “Demo” into Module filter3. Select to Enable both Demonstration Site and Demonstration Site Reset modules4. Save Configuration

Save Configuration

1.15 Add Blog

1.16 Add Blog Menu Link

1.17 Add Blog URL Alias

1.18 Change Menu