Drupal Training Series

1. Drupal Training Series • Foundations for OSU Drupal 6 • Generating Custom Content Types

2. What We’ll Be Covering… • Anatomy of a Content Type • Data Input Form and Database • Change Existing Content Type Settings • Workflow Settings • Ex. 01 Change Content Type Settings • What CCK Is • How CCK Benefits Users • Import a Custom Content Type • Form Re-Use • Ex. 02 Import Equipment Content Type • Ex. 03 Add Equipment Node • Lab Add Additional Equipment Nodes • Create Custom Content • Deciding What You Need • Create an Employee Content Type • Ex. 04 Create Employee Content Type • Ex. 05 Add Employee Node • Lab Add Additional Employee Nodes • Create a Recipes Content Type • Ex. 06 Create Recipes Content Type • Ex. 07 Add Recipe Node • Lab Add Additional Recipe Nodes • Summary

3. Getting Started • As a reminder, to get to your personal development site go to: • http://drupaldev.cws.oregonstate.edu/training/<yourONIDname>/login • From there, log in with your ONID information. • After logging in, please open a second tab in your browser and go to CWS Training at • http://oregonstate.edu/cws/training • Locate the name of this workshop in the list and click it. This will take you to a page describing the course with download links at the bottom of the page. • Download the lab materials to your desktop and unzip them.

4. Assignment • The pre-class assignment required the development of a set of TaxonomyVocabularies. • These vocabularies will be attached to the custom content types that we’ll develop through the course of this workshop. • These vocabularies will be a necessary part of both this workshop and future workshops related to Views.

5. Anatomy of a Content Type • By this point in your Drupal endeavors, you should be fairly knowledgeable about content types from the user interface (the UI or “front-end”). • Now though, since we’ll actually be building some custom content types, it’s time to start understanding a little bit about what goes on in the background. Database Server Web Server

6. Anatomy of a Content Type: Database Records • A Drupal website is actually the front end of a very powerful, industrial-sized MySQL database. • It’s this database, combined with a dynamic programming language known as PHP, that allows your site to respond and display real-time changes according to various events. • Most of us have, at some point, seen some type of database record. Let’s take a look at some that you’re probably familiar with. • Note that all of these items are organized inside of a table. Each row of the table is a unique record and is identified by some form of a unique id number or code.

7. Anatomy of a Content Type: Node Type Data • Every time you create or edit a node within Drupal, you’re actually entering or updating data in the database. • Most of the content types we work with – such as Announcement, Book, or Poll - have their own tables inside of this big database. Each time you create a new node – you’re actually creating a new record in the respective table. • All of these tables are then related together into the overall system and given a Node ID. This Node ID is the unique identifier of a particular page of content. • This is what a MySQL database for a Drupal site looks like when using phpMyAdmin – a database management tool.

8. Anatomy of a Content Type: Why Is This Important? Database • Knowing a little bit about the supporting database behind your system is important – because through the course of this workshop, we’ll be doing things that will, ultimately, affect its structure. • We’ll also be doing things that will automatically affect the directory structure of your site. • This is where the need for a system mindset really begins to manifest. • It’s now getting to the point where random changes can drastically affect the display, and possibly even the integrity, of your site. File System User Interface

9. Anatomy of a Content Type: Content Type Settings • Up to this point, we’ve all encountered some small annoyances with some of the existing content types: • For example: • Content revision tracking must be manually toggled for all content types • Some content types have the Promoted to Front Page settings enabled by default • Some content types are set to either Publish automatically when saving, while others are set to or Save as Draft when saving • Just like with most other Drupal features, content types can be configured as well, if desired. By default, in the OSU Drupal 6 installation, the Administrator and Advanced Author are the only roles who can do this. • We’ll start by changing the Create new revision default option on the Book page content type.

10. Ex. 01 Change Content Type Settings • You may not see a need to keep revisions of some content types, such as Announcements or Polls. Other types, though, such as Book pages may involve deeper and more complex levels of development – so automatic revisions may be desired. To change the Create New Revision option, do the following: • Go to Administer > Content management > Content types • Locate the Book page row and click on its edit link 1 2

11. Change Content Type Settings: Edit Workflow Settings • Once within the Book page content type settings, do the following: • Scroll down the page and click on the Workflow settings field set to expand it. • Check the Create new revision checkbox. • Click on the Save content type button at the bottom of the page • You’ll receive a confirmation message that the change has been made, but it won’t be evident until you open up the Book page content type. 1 2 3

12. Change Content Type Settings: View Revision Setting Change • Let’s see how this settings change translates into our Book page content type: • Go to your Cooking Companion > Methods > Cooking > BBQ&A page and click on its Edit tab. • From your lab materials, copy the contents of ex-01.doc and paste it over the original content on your BBQ&A page. Insert your choice of images, if desired. • Scroll down the page to the Revision information fieldset, open it, and note how it’s checked. • Click the Save button. 1 2 3 4

13. Change Content Type Settings: Revision Tab Visible • After saving, you’ll see that a Revisions tab appears at the top of your page. • From this point on, any Book page that you create will automatically save all revisions.

14. Change Revision Settings: Now You Do It • Go to Administer > Content management > Content typesand change the Create New Revision option for the following content types: • Page • Story • For both content types: Workflow Settings = check the Create new revision checkbox Click theSave content type button

15. Revisiting the Site Map Cooking Methods Book • Remember our site map from back during the Developing Site Structures workshop? • Now it’s finally time to finish it up. • We’ll be adding three brand new content types to our site: • Equipment • Employee • Recipe • To do this, we’ll need to use a module called CCK. Equipment CCK Methods Book Conversions Book Handling Methods Book Cooking Companion Book Food for Thought Home Page Employee CCK Recipe CCK

16. Content Construction Kit (CCK) Module • The Content Construction Kit, or CCK, module is one of the most well-developed and extended modules available for Drupal. In fact, this contributed module is so popular and useful that it’s slowly being integrated into Drupal as a core feature. • CCK allows a permitted user the ability to add custom fields to any content type, or to create completely custom content types altogether. • In the OSU Drupal 6 world, CCK is commonly used to create custom content types for various things such as employees, courses, and publication information. • Another nice feature is the ability to actually import existing CCK types into your Drupal site as well. • We’ll start with this, as a little bit of a warm up.

17. Form Re-Use • Code re-use is a common occurrence in programming. If something has been proven to work well, is stable, and efficient there’s typically little desire to reinvent the wheel. • The same can hold true for objects as well, such as forms. • OSU Drupal 6 has the capability of both importing and exporting CCK types. • When available, form re-use can save a great deal of time and effort. • Let’s take a look at how to import a CCK type.

18. Ex. 02 Import Equipment Content Type • To import the Equipment custom content type, do the following: • Click on Administer > Content management > Content types > Import tab • In the Content type field, leave the default set at <Create> • In the Import data field, paste in the code found in the equipment.txt file, within your lab materials. • Click the Import button at the bottom of the page. 1 2 3 4

19. Import Equipment Content Type: Set Permissions • Before you can fully use your Equipment content type, Permissions must be set for it. To set permissions, do the following: • Go to Administer > User management > Permissions. • Scroll down the page until you find the node module group. Within this group, set the following permissions: • Click the Save permissions button at the bottom of the screen. 1 2 3

20. Import Equipment Content Type: Add Equipment Tag List • Remember the extra Tag Lists we created way back in the Developing Site Structures workshop? Now it’s time to put one of them to use: • Go to Administer > Content management > Taxonomy, locate the Equipment vocabulary in the list, and click on its edit vocabulary link. • In the Content types fieldset, check the Equipment content type. • Click on the Save button. 2 1 3

21. Ex. 03 Create an Equipment Node • So now it’s time to explore the newly imported Equipment content type: • Click on the Create content > Equipment link. You’ll discover that this form looks a bit different than ones that you are currently accustomed to. In addition to the standard fields and tag list, there exist the following custom fields: • Image Upload field • Description Field • Maintenance Field • Since we have some new and different features here, let’s take this one a bit slow and examine what’s going on. a b c

22. Create an Equipment Node: Enter Text Information 1 • In the Equipment content type form, enter the standard information first: • Name field = Casserole Dish • Equipment tag list = Bakeware • Description field = paste lab materials • ex-03.doc corresponding Description Note: This field is actually the Body field, just with a different label. It works the same way as you’re accustomed to. Remember to change the Input format to Full HTML. • Maintenance field = paste lab materials • ex-03.doc corresponding Maintenance Note: This field is a custom text field that has been added, but it works the same way as you’re accustomed to. Remember to change the Input format to Full HTML. 2 3 4

23. Create an Equipment Node: Exploring the Imagefield Widget • Now let’s check out the Image field, which uses a custom field type generated by the Imagefield widget. • Click on the Browse button. • In your File Uploader, navigate to: ..lab > ex-03 > images > dish-casserole.png file and then click on the Open button. • Click the Upload button. Note: This will immediately open up an area with a thumbnail of your image and metadata fields to describe your image • Description = Casserole Dish • Alternate Text = casserole-dish • Title = Casserole Dish 2 1 3 4 5 6

24. Create an Equipment Node: Completed Equipment Node • Preview and Save your new content. • You may have noticed a few things... • The image label isn’t really necessary • A menu link was not created • The text does not flow around the image • For the label issue, we’ll address that right now. We’ll address the other concerns (and a lot more) when we get to the upcoming Views workshop.

25. Create an Equipment Node: Edit Equipment Node Display • To edit the labels on your node display, do the following: • Go to Administer > Content management > Content types and click on the Equipment manage fields link. • Once inside the Equipment configuration panel, click the Display fields tab. • On the Display fields screen, in the Label column, select <Hidden> for the Image row. • Click the Save button. 1 2 3 4

26. Create an Equipment Node: View Edited Equipment Node • Now, take a look at your new Equipment node by going to Administer > Content management > Content and clicking on the Casserole Dish title.

27. Create an Equipment Node: Now You Do It • Over the next 10 minutes, go to Create content > Equipment and create a few more Equipment nodes using the following information: • Lab Materials: • Text = ..lab > ex-03 > ex-03.doc • Photos = ..lab > ex-03 > ex-03-images folder • Note: You may not be able to create all 10 items in the given time limit – this is expected. Extra content has been provided for you to practice with on your own at a later time.

28. Create an Equipment Node: Equipment Image Uploads • You might be wondering where your equipment image was uploaded to. To find out, click on the My account > File browser tab. • You’ll note that a new equipment-images sub-directory exists in sites/default/files and it contains the image we just uploaded. You can manage these files just like any others in your file browser. • We’ll learn how to set this up ourselves in just a few minutes.

29. Planning Custom Content Types • Before rushing headlong into creating a custom content type, it’s a good idea to have a general idea of what you want to use the form for. • CCK isn’t really intended for items of a singular nature. It’s meant for content that has a format to it – items that possess similar types of information and need to look consistent in a group of similar content. • We’ll use an Employee information form as an example. • On an employee data entry form, there will exist some general form data that always applies toeach employee. What are some examples of this type of data? • ? • ? • ? • ? • Other, information may also be included that may or may not apply to each employee. What are some examples of this type of data? • ? • ? • ? • ? • ?

30. Planning Custom Content Types: Required vs. Optional Information • Data that is consistent for all employees should be considered Required. For example: • All employees will possess a First Name and a Last Name • All employees have some sort of Position at their place of employment • Data that is not consistent for all employees should be considered Optional. For example: • Not every employee may have their own office phone • Not every employee may want their photo published • Required Information • First Name • Last Name • Department • Position • Optional Information • Biography • Experience • Photo • E-mail • Phone Number • Note: As a general rule of thumb, it’s a good idea to avoid publishing personal information, such as your home address, personal phone number, etc on a web site.

31. Planning the Employee Content Type: Understanding Data Types • Now that we know what fields we want on our Content Type form, we should consider what data types these fields will hold. • A data type is a set of data values that possess predefined characteristics. Following are some common data types that you may be familiar with: • Text • Number • Image • So, now we should refine our data field lists a bit more by including the type of data that will be involved with each field. • Required Information • First Name – Text field • Last Name – Text field • Department – Selection box • Position – we’ll use Taxonomy for this • Optional Information • Biography – Text area • Experience – Text area • Photo – Image field • E-mail – Text field • Phone Number – Text field

32. Planning the Employee Content Type: Putting It All Together • It’s usually easiest to put these items in a table:

33. Ex. 04 Create Employee Content Type 1 • Now that we’re prepared, it’s time to create the Employee custom content type: • Go to Administer > Content management > Content types. • Take a good look at the table as it currently exists, as this table will change once your new content type is created. Note the cells named Name, Type, and Description. • Click on the Add content type tab. 3 2

34. Create Employee Content Type: Configure Identification Settings • The Identification fieldset is where you set all name and description information for this particular content type: • Name field = Employee This information should be human-readable (may contain mixed case and spaces). It will be displayed on the main content type list. • Type field = employee This information must be machine-readable (all lowercase letters and/or numbers, and underscores only). It is used to create a data table in the database. • Description = Employee information This information will appear on the main Create content page 1 2 3

35. Create Employee Content Type: Configure Submission Form Settings • The Submission form settings fieldset is where you set custom information for default fields used: • Title field label field = Employee This is the label you want to use for the Employee field. • Body field label field = Biography This is the label you want to use for the Biography field. • Minimum number of words field = 0 Leave this at the default setting, for now. • Explanation/Guidelines field = This content type is intended for work purposes only. Please avoid entering personal contact information. This is a place where you can add any special instructions to your contributors regarding use of this content type. 1 2 3 4

36. Create Employee Content Type: Configure Workflow Settings • The Workflow settings fieldset is where you determine the processing of your content type as well as the use of add-on features: • Default options group = uncheck Promoted to Front Page option • Multilingual support group = Disabled • Attachments group = Disabled field • Click the Save content type button • Once saved, you’ll be redirected back to the main Content types screen and your new content type will be added to the list. • Now it’s time to add some custom fields… 1 2 3 4

37. Create Employee Content Type: Create First Name Text Field • To edit your new Employee content type, click on the manage fields link in its row. We have seven more fields to add, so we’re going to do this one by one, as we’ll be dealing with some different data types. We’ll start with the First name field. • Label field = First name • Field name field = first_name • Data type field = Text • Form element field = Textfield • Click the Save button • You will be redirected to the First name field configuration screen. 1 2 3 4 5

38. Create Employee Content Type: Configure First Name Text Field • To configure the First name field, do the following: • Size of textfield field = 20 • Help text field = Enter employee’s first name • Required check box = checked • Maximum length field = 25 • Click the Save field settings button • After saving, you’ll be redirected back to the Manage fields panel to add the next field. • Using the same method as used for the First name field, now create the Last name field. 1 2 3 4 5

39. Create Employee Content Type: Create Department Selection Box • There are a couple of different departments included in our Food For Thought company. One way to provide options for your contributors to select from is to create a selection box. To create a Department selection box, do the following: • Label field = Department • Field name field = department • Data type field = Text • Form element field = Select list • Click the Save button • After saving you’ll be redirected to the Department field configuration screen. 1 2 3 4 5

40. Create Employee Content Type: Configure Department Selection Box • Now configure the Department field: • Help text field = Select the department associated with this employee. • Required checkbox = checked • Maximum length field = 30 • Allowed values list field = enter the following, one per line: Communications Research & Development • Click the Save button • After saving you’ll be redirected to the Manage fields main screen. 1 2 3 4 5

41. Create Employee Content Type: Create Experience Text Area • A text area differs from a text box in that a text area has multiple lines – it’s a larger space. To create the Experience text area, do the following: • Label field = Experience • Field name field = experience • Data type field = Text • Form element field = Text area • Click the Save button • You will be redirected to the Experience field configuration screen. 1 2 4 3 5

42. Create Employee Content Type: Configure Experience Text Area • To configure the Experience text area, do the following: • Rows field = 10 • Help text field = Type or paste information regarding the employee’s work/professional achievements and experience. Please use bulleted text. • Text processing option group = Filtered text • Click the Save button • After saving you’ll be redirected to the Manage fields main screen. 1 2 3 4

43. Create Employee Content Type: Create Photo Field • Creating an image field is a little elusive as it’s not listed as you would expect it to be. To create the Photo field, do the following: • Label field = Photo • Field name field = employee_photo • Data type field = File • Form element field = Image • Click the Save button • After saving you’ll be redirected to the Photo field configuration screen. 3 2 4 1 5

44. Create Employee Content Type: Config Photo Field – Employee Settings • Images require quite a bit of configuration, so we’ll take this part section-by-section, starting with the Employeesettings fieldset: • Help text field = Upload employee photo. • Permitted upload field = default • Maximum resolution field = 250x250 Note: all images used in the lab materials have been resized to fit a 250 x 250 field at 72 dpi. Remember, the larger an image is, the longer it takes for it to load on the page. • Minimum resolution field = default 1 2 3 4

45. Create Employee Content Type: Config Photo Field – Path Settings • The Path settings fieldset is where you can name a particular directory into which your content type’s images will be automatically uploaded. To set the File path, do the following: • File path field = employee-images Type the path in exactly as shown with no preceding or trailing slashes. This will create an employee-images directory in your sites/default/files path into which your employee images will be uploaded. • The large token list underneath the File path field doesn’t quite apply at this stage yet so don’t be concerned with it. 1

46. Create Employee Content Type: Config Photo Field – File Size Restrictions • Images can be memory intensive. Most contemporary digital cameras are set at a very high resolution, by default – much higher than is needed (or desired) for a web page. Use the File size restrictions fieldset to help manage the size of uploaded image files: • Max upload size per file field = 150KB This limits the size of a file when it’s uploaded. • Max upload size per node field = 1MB This limits the total size of all combined images on a particular node. 1 2

47. Create Employee Content Type:Config Photo Field – ALT Text Settings • ALT text (Alternative Text) serves two purposes. If a link to an image is broken, the ALT text will provide a text description for the viewer. Additionally ALT text is also read by screen readers, which are utilized by those with vision impairment. To configure the ALT text settings, do the following: • Enable custom ALT text box = check This allows a contributor to provide custom ALT text, if desired. • Default ALT text field = food-for-thought-image This will put a default ALT text entry in if a custom one is missed. • The large token list underneath the Default ALT text field doesn’t quite apply at this stage yet so don’t be concerned with it. 1 2

48. Create Employee Content Type:Config Photo Field – Title Text Settings • Title text serves as a tool-tip when a user hovers a mouse over an image. This information can be handy in many cases: as directions to a user, as captions, or as credits for the image creator. To configure the Title text settings, do the following: • Enable custom Title text box = check This allows a contributor to provide custom Title text, if desired. • Input type = textfield • Default Title text field = leave blank • The large token list underneath the Default Title text field doesn’t quite apply at this stage yet so don’t be concerned with it. 1 2 3

49. Create Employee Content Type:Config Photo Field – Global Settings • The Photo field Global settings are as follows: • Required check box = default • Number of values field = default • List field option group = default • Description field = check Enabled • Click the Save field settings button • That’s it for the image configuration. There are still a couple more fields to add, though. 1 2 3 4 5

50. E-mail field Label field = E-mail Field name field = employee_email Type of data field = Text Form element field = Text field • Configuration Size of textfield field = 60 Maximum length field = 60 Click Save field settings button • Phone field Label field = Phone Field name field = employee_phone Type of data field = Text Form element field = Text field • Configuration Size of textfield field = 14 Maximum length field = 14 Click Save field settings button Create Employee Content Type: Now You Do It • Two final text fields need to be created to complete our Employee content type, an E-mail field and a Phone field. Using the specifications provided below, create and configure the final two fields for your content type. • Remember, to get to the Employee content type to edit it, go to Administer > Content > Content types > Employee manage fields link.