sph training manual d02 - department...within the drupal cms, data are stored in content types. the...
TRANSCRIPT
Training
DrupalTrainingManual
DepartmentContentManagementandAdministrationPrepared for: University of Maryland, School of Public Health
Created By: The Canton Group 2920 O’Donnell Street Baltimore, Maryland 21224
tel: 410.675.5708
fax: 410.675.5111
www.cantongroup.com
TableofContentsTraining ........................................................................................................................................................ 1
Drupal Training Manual ................................................................................................................................ 1
Department Content Management and Administration .......................................................................... 1
Data (Content Types) .................................................................................................................................... 4
Department Basic Page ............................................................................................................................. 5
Event ......................................................................................................................................................... 8
News ....................................................................................................................................................... 14
Slideshow ................................................................................................................................................ 22
Faculty Bio. .............................................................................................................................................. 25
To Quick Reach a Faculty Bio. Page .................................................................................................... 25
Editing Faculty Bio. Pages ................................................................................................................... 25
Staff Bio Content Type .................................................................................................................................. 4
Student‐Alumni Bio Content Type ................................................................................................................ 8
Configure ..................................................................................................................................................... 12
User Account Management .................................................................................................................... 13
Logging In ............................................................................................................................................ 13
Password Reset ................................................................................................................................... 13
Change Existing Password ................................................................................................................... 13
Managing Content .............................................................................................................................. 14
Menu Structure ................................................................................................................................... 15
Modifying the Menu Structure ....................................................................................................... 15
Adding Links to the Main Navigation .............................................................................................. 18
Nodequeues ........................................................................................................................................ 19
Other ........................................................................................................................................................... 21
Managing Files ........................................................................................................................................ 21
Using the Content Editor ........................................................................................................................ 22
HTML Heading Tags ............................................................................................................................ 22
Altering Font Size and Styles ............................................................................................................... 23
Using Links .......................................................................................................................................... 23
Adding Images ..................................................................................................................................... 25
Adding Content from Microsoft Office ............................................................................................... 28
Using Anchor Tags ............................................................................................................................... 28
Embedding Media ............................................................................................................................... 29
File Attachments ................................................................................................................................. 29
Input Formats ...................................................................................................................................... 30
Using the CKFinder File Browser ......................................................................................................... 30
Data(ContentTypes)Within the Drupal CMS, data are stored in content types. The following data or content types have been
created.
When writing or inserting content for the web, it is important to remember to utilize the semantic
markup available, such as headings, sub‐headings, lists, and block quotes. Proper use of these
organizational tools allows the site to be accessible to users with disability and increases the clarity of
the content.
Content can be assigned to and moved around menus of the site. This can be accomplished when
editing a page individually or via the Site Menu editing interface. When specifying the “Weight” of a
menu item it will determine how it orders relative to other menu items. The lower the menu item’s
weight, the higher it will appear in a menu.
Most content in the Drupal content management system is comprised of “Nodes”. They provide a base
set of functionality that allows Drupal to build upon. Basic features include workflow, searching, and
revisions. Nodes represent plain Items, users, and plain pages such as an “about” page.
By default all nodes will be published when saved. To un‐publish a published or new node, uncheck the
“Published” checkbox under the Publishing Options tab near the end of the node edit page and then
save the form.
DepartmentBasicPageThis content type is used to create pages specifically for departments or centers that will appear on their
sites, and within their menu structures and information architecture. For example, an About Us page:
NOTE: While it can be used to create pages at the Global level, the ‘Basic Page’ content type should used
for that purpose.
STEP 1: Add a title.
STEP 2: Choose the Primary Organization this page will be a part of. This will also influence the available
menus that you can initially add this content to.
STEP 3: Add descriptive test in the Body field.
STEP 4: Add the page within the department/center menu structure.
STEP 5: Click preview to review, and then click Save.
EventThis content type is used to create events, both at a global:
And department specific level:
The method for creating a global event or a department event is similar, only differing at the primary
and shared organization fields.
Additionally, global events will be shown in the Event block on the main SPH website:
STEP 1: Add a title.
STEP 2: Select the Primary Organization for the event.
STEP 3: Select any Shared Organizations for the event.
STEP 4: Select the type of Event.
STEP 5: Create a start and end date for the event.
STEP 6: If required, add additional dates for the event.
STEP 7: Add descriptive text in the Body field.
STEP 8: Upload an Image, if needed, for the event.
STEP 9: Click the Featured Event checkbox if the event should be a featured event in the News Room.
STEP 10: Upload an image that will be used if the event is a featured event.
NOTE: If the event was created with a department or center selected as either Primary or Shared
organization, it should also appear in the event listing for that department.
NewsSTEP 1: Enter a title.
STEP 2: Select the Primary Organization the News content is affiliated with.
STEP 3: Select the Shared Organizations the News content will be shared with.
STEP 4: Select categories for the News content.
STEP 5: Select event categories.
STEP 6: Select the publication date.
STEP 7: Enter content in the body field.
STEP 8: Enter and related links for the news content.
STEP 9: Select an image.
STEP 10: Add content that will appear on the main page as an image caption.
STEP 11: Specify if this content needs to be on the top of the News Room page if it is the latest featured
news item. It must include a Featured Image that will be displayed in the Featured block on the News
Room (the default image crop is 440x330).
STEP 12: Select an Image to be used for the Featured Image.
This is the image that will be displayed in the Featured block on the News Room. Image size is 350pixels
wide x 250 pixels high. This field is required when the news article's featured field is checked.
NOTE: This Featured Image browser allows you to upload an image:
Or, browse from available images already uploaded onto the site.
STEP 13: Add a research publication, if applicable.
STEP 14: Add any additional URLs related to this News content.
STEP 15: Link the news item to Faculty Members, Students, or Staff. The field will begin to generate
names as you type.
STEP 16: Select a related degree, if applicable.
STEP 17: Select areas of expertise to associate with the content, if applicable.
STEP 18: You may add an image from Flickr using the Item Type, Item Id, and User Id fields. First, specify
the Item Type – if you want to reference one image from Flickr, or a Photoset.
STEP 19: Enter the Item Id:
The Item Id can be found within the URL of the image, following the username.
Ex.
Ex.
STEP 20: Enter the User Id.
The user id of the Flickr user who owns the photos. If this is left blank, the sites’ default user will be
used. The current default id is 65796725@N08, which is representative of the School of Public Health’s
Flickr Account. To find your FlickrID, you may use this link: http://idgettr.com/
STEP 21: Enter Media Outlet information.
STEP 22: Click Preview to review the content, and click Save to publish the content.
Slideshow
This content type is used to generate the Slideshow images at the ‘home page level’ of the Global Site,
and the Department and Center sites.
STEP 1: Add a title.
STEP 2: Select the Primary Organization.
STEP 3: Select any Shared Organizations that will also have access to this Slideshow content.
STEP 4: Add a destination URL in the provided fields.
STEP 5: Enter descriptive text in the Body field.
STEP 6: Upload an image to be used in the Slideshow.
STEP 7: Select the Background color for the Slideshow. These colors are associated with the global,
department, or center designations.
STEP 7: Click Preview to review the content, and click Save to publish the content.
FacultyBio.
ToQuickReachaFacultyBio.PageSTEP 1: After logging into the website by using your CAS credentials, click Okay on the popup.
STEP 2: Go to http://sph.umd.edu/faculty or click on the Faculty link in the People area of the menu.
STEP 3: Locate your name on the Faculty List and select it to view your full bio record. Alternatively, you
may search for your name using the provided fields.
STEP 4: Click on the Edit tab to update your information.
Alternatively, to create new Faculty Bio. content select Add Content from the Department Content
dashboard, and then select Faculty Bio.
EditingFacultyBio.PagesSTEP 1: Review your headshot. If needed, upload a headshot photo in .jpg format (recommended 400 x
600 pixels).
STEP 2: Add a first name, last name, academic title, and administrative or functional title.
For Academic Title: Please provide your primary academic title. For UMB faculty or affiliates from other
parts of UMD campus: use this field to indicate academic title with collaborative school (which may be
different than academic title in the School of Medicine).
For Administrative (Functional Title): Here you may include additional titles, such as affiliate
appointments, or administrative roles. For UMB faculty or affiliates from other parts of UMD campus:
Use this field as the place to put the primary academic title at the University of Maryland, Baltimore
(such as: Professor, Epidemiology and Public Health, University of Maryland School of Medicine) or in
the department within another school/college at UMD.
STEP 3: Choose the Primary Department Affiliation.
NOTE: If you have a joint appointment, or if you are core faculty in a research center, you may select
more than one primary department (or center).
STEP 4: Choose the Secondary Affiliation.
NOTE: Select a secondary department or center if you have an affiliate appointment with one. You can
select multiple affiliations.
STEP 5: Choose some areas of expertise from this list of high level terms, for use in "find an expert" search. Limit
expertise terms to no more than ~six. More specific expertise terms should be included in your biography.
The terms currently available are as follows:
STEP 6: Add an email address, office phone number, room number, location, and office hours.
Location note: Leave this blank if you are in the School of Public Health building as the default is "School
of Public Health" if your campus is marked as "College Park." If not in the SPH building, please provide
the building name where your office is located. You will enter room number in the field above.
STEP 7: Please provide a brief biography which includes details on your research focus, and details about
your teaching or other activities as appropriate. Be sure to include key terms associated with your area
of expertise in this description.
STEP 8: Upload a PDF file of your current curriculum vitae.
STEP 9: Add a link to website, if available. If the link is external add the complete url, for example:
http://www.website.com. If the link is internal, add the part of the URL path that follows the main SPH
website URL, for example instead of entering http://www.sph.umd.edu/department/person‐name, you
would only use /department/person‐name.
STEP 10: You may link to your laboratory site by selecting it from the provided drop down menu. If your
lab site resides at a URL outside of the SPH website, leave this blank and add that URL to the "website"
field above instead.
STEP 11: Add education and training information.
STEP 12: Please provide up to 10 select publications (most recent or highest impact) sorted from most recent to oldest. You may also link to your page on scholarly research portals such as Researcher ID, Google Scholar, PubMed, etc.
STEP 13: Add Honors and Awards information.
STEP 14: Add collaborators information.
STEP 15: List current/recently taught courses, upload and link to PDF of course syllabi if possible.
STEP 16: Please select the degree programs with which you are affiliated.
Below is a listing of the current related degree programs.
BS, Behavioral and Community Health
BS, Family Science
BS, Kinesiology
BS, Public Health Science (College Park)
BS, Public Health Science (Shady Grove)
Certificate, Gerontology
Certificate, Global Health
Certificate, Principles of Public Health
MA, Kinesiology
MHA, Health Services
MPH, Behavioral and Community Health
(CP)
MPH, Biostatistics (CP)
MPH, Community and Population Health
MPH, Environmental Health Sciences (CP)
MPH, Epidemiology (B)
MPH, Epidemiology (CP)
MPH, Global Health (B)
MPH Physical Activity
MPH, Public Health Practice and Policy (SG)
MS, Couple and Family Therapy
PhD, Behavioral and Community Health
PhD, Epidemiology
PhD, Family Science
PhD, Health Services
PhD, Kinesiology
PhD, Maternal and Child Health
PhD, Toxicology and Environmental Health
Physical Education Master's Certification (K‐
12)
STEP 17: Please select the graduate students whom you advise. Search for users by entering part of their
name. To add additional students, add a comma after the last name and start typing the next student's
name. If you do not see your student advisees here, leave blank for time being. Student profiles are still
being added to the database (7/22/14).
STEP 18: You may associate the Faculty User Account with the Faculty Member by using the provided
field. As you type it will begin to auto‐generate results based on the email address associated with the
user accounts.
STEP 18: Faculty Group
The faculty group should be set to "main" for faculty with primary appointments in the School of Public
Health. Research staff (faculty research assistants), adjuncts and affiliates (which includes faculty from
UMB) should be marked as such, as well as emeriti faculty. This enables proper grouping of faculty.
STEP 19: Please specify campus location if not already indicated. Off‐campus is an option for adjuncts or
research staff not based on one of the campuses.
STEP 20: Faculty with administrative roles should have "yes" checked here. This includes degree
program directors, chairs, etc.
STEP 21: Click Preview to review, and then click Save.
STEP 22: Verify the changes you’ve made are correct, re‐editing if needed.
This content is reflected in the following areas of the site:
[MAIN SITE] People / Faculty
[DEPARTMENT/CENTERS] People / Faculty (or in some cases Faculty/Staff)
In both instances, the content is pulled into a sortable listing. At the global/main level the listing includes
the varied departments and centers:
At the department/center level, there is no such filter:
StaffBioContentTypeThis content type is used to populate Staff information across the website. At the global site level this
content is populated in the Staff area under People.
At a department level the placement may vary but it is commonly populated in the People area of those
sites as well.
In either instance, the process to generate this content is very similar.
STEP 1: Upload an image to be used as a headshot. If no image is provided, a default image will be used.
STEP 2: Enter the first and last name.
STEP 3: Enter the job title.
STEP 4: Select the primary affiliation for the staff member.
STEP 5: Select any additional organizational affiliations.
STEP 6: Enter the staff member’s email address.
STEP 7: Enter the office phone number.
STEP 8: Select the campus.
STEP 9: Staff members who play a role in the school or department administration should be marked as
yes here.
STEP 10: Enter biographical information.
STEP 11: If available, enter a personal website URL (internal or external).
STEP 12: Click Preview to review, and then Click Save.
Student‐AlumniBioContentTypeThis content type is used to populate Graduate Student and Alumni information across the website. At
the global site level this content is populated in the Graduate Student area under People.
STEP 1: Upload an image to be used as a headshot. If no image is provided, a default image will be used.
STEP 2: Enter the first and last name.
STEP 3: Select the primary department affiliation for the student/alumni.
STEP 4: Select any additional organizational affiliations.
STEP 5: Enter the Academic Title.
STEP 6: Select the Academic Degree from the dropdown.
STEP 7: Enter the student/alumni‘s email address.
STEP 8: Enter the office phone number.
STEP 9: Enter the Room Number.
STEP 10: Select the Faculty Advisor.
STEP 11: Enter biographical information.
STEP 12: If available, enter any selected publications information.
STEP 13: Select the Campus.
STEP 14: Enter Fun Facts.
STEP 15: Click Preview to review, and then Click Save.
ConfigureThis section describes the Drupal 7 CMS configuration. Items covered in this section include the
following:
User Account Management
Roles and Permissions
Basic Page Layout (Regions and Blocks)
Modules
Reports and Statistics
UserAccountManagement
LoggingInLogging in is done by referencing the URL of the website and adding /user and then entering the
username/password credentials for the account.
PasswordResetIf you have forgotten your username or password: STEP 1: Click on the “Request New Password” tab.
STEP 2: Enter your username or email address to have a link to reset your password emailed to you.
ChangeExistingPasswordSTEP 1: After logging in, click on the username link in the upper right hand corner of the top Drupal menu.
STEP 2: Click the edit tab.
Enter the new user name in both the Password and Confirm Password fields, and then click Save.
ManagingContent The Department Content area of the Drupal Administration Menu allows you to review content within
your group.
MenuStructure
ModifyingtheMenuStructureThese are the primary navigation elements in your web site. There are typically more than one set of
menus, such as ‘Primary’, ‘Navigation’, or ‘General’. Each set of menus is a block, and is assigned to one
of the regions on your web site. You can also create and add your own menu structures to a region as
well.
Note: Although Drupal supports adding and changing menus on the fly, doing so may break your site
‘theme’, especially if graphics are involved.
STEP 1: “Select Structure ‐> Menus” from the Drupal Administration Menu
STEP 2: Click on the menu you would like to organize. The menu that governs the main site navigation is
called Main Menu, presented below. All other menus are shown in the Menus area, however, as that
functionality is governed in the same administrative area with a users’ ability to edit menus determined
by their user role and permissions.
Click List Links:
STEP 3: Drag and drop menus or click on Add Link.
Dragging a menu option under another creates a sub page of the main navigation item. For example
dragging “School at a Glance” under “Mission and Vision”:
`
STEP 4: Click “Save Configuration” when you’re done dragging and reordering.
NOTE: You may also use the POWER EDIT option to re‐order your menu structure. This can be
accessed from the menu area by clicking the Power Edit tab.
This will provide a similar view of the menu structure but also provide the ability to alter the title and
path of the entire menu at the same time.
AddingLinkstotheMainNavigationWhile creating content, a user has the option to add that content to the navigational structure of the website. STEP 1: Select ‘Provide a menu link’ in the Menu Settings area of the content creation area.
STEP 2: At this stage you can give the content a menu name independent of the title of the content and select where the content will go in the hierarchy of the navigation.
NOTE: You can also change the placement of the content within the navigation after this stage. Please reference the section of this guide called ‘Menus’ for more information.
NodequeuesThe Nodequeue module allows users to collect nodes in an arbitrarily ordered list. The order in the list
can be used for any purpose, such as a block listing teasers for the five top news stories on a site.
Nodequeue provides a simple drag‐and‐drop interface to manually order any queue. Additionally, it
allows nodes to be added and removed from queues without needing edit permissions to the node.
Currently the only instances of nodequeues on the website are the Homepage Global Slideshow and the
Slideshow Organization, pictured below. This area is reached by hovering over Structure and then
selecting Nodequeues.
To view the content within a Nodequeue, click the View link in the Operations column.
Much like the menu structure, the order of the nodequeues can be rearranged by clicking and dragging
the drag icon next to the title of the slide item.
When you move any of the items, a message will be presented that illustrates the changes will not be
saved unless you click Save.
Additionally, these Nodequeues are generated using the Slideshow content type, so when a user clicks
Edit within the nodequeue area they are taken to editing that specific type of content. Please review the
workflow associated with the Slideshow content type in the Content Types section of this manual for
more information.
Other
ManagingFilesThere are two methods for managing files on the website. The first is done through the File Browser
pictured below. This is accessed by using the Browse server button in either the Image Properties or the
Link Properties window.
NOTE: You may also create sub‐directories/folders by following these steps:
STEP 1: Select Browse Server from the Image Properties window, or the Link window. Right click in the
folders listing.
STEP 2: Click New Subfolder.
STEP 3: You may assign the folder as a subdirectory of any existing directory/folder by selecting the
error next to the field.
STEP 4: Click Ok to add the directory/folder to the existing folder structure.
The second method is using the Media Browser located in some content types, for instance News,
pictured below.
UsingtheContentEditorThe CKEditor allows creation of HTML content using an editor that is very similar to other desktop word processors such as Microsoft Word™ or Open Office™. Available styles include Bold, Italic, Underline, Lists, Tables, and Custom Styles built into the theme.
HTMLHeadingTagsMost formatting for headings and subheadings are styled using HTML Heading Tags such as H1, H2, H3, etc. These HTML Heading Tags are predefined in terms of content formatting and style for your particular web site.
When writing or inserting content for the web, it is important to remember to utilize the semantic markup available, such as headings, sub‐headings, lists, and block quotes. Proper use of these organizational tools allows the site to be accessible to users with disability and increases the clarity of the content.
AlteringFontSizeandStyles
UsingLinksSTEP 1: First, highlight the text you would like to be linked and click on the chain image . STEP 2: Next, the Insert/Edit link dialogue will appear.
In the “Link URL” field, type in the URL where you would like to have the link point to ‐ this can be an external link (starting with ‘http://’) or an on‐site link (starting with ‘/’). STEP 3: Optionally, enter “Title” text that will appear when a user hovers over the link with their mouse or their screen reader reaches the link. When ready, click the “Insert” button and the link will be created in the WYSIWYG editor.
NOTE: The Target tab is used to determine if the link opens in the same window or a new window:
The following options are available for link targets:
Open in New Window (_blank): Load in a new window
Open in Top Frame (Replaces All Frames) (_top): Load in the full body of the window
Open in This Window (_self): Load in the same frame as it was clicked
Open in Parent Window/Frame (_parent): Load in the parent frameset
AddingImagesImages are uploaded and inserted as easily as links are created.
STEP 1: Place the cursor where you would like the image inserted and click the image icon . STEP 2: The “Insert/edit Image” dialogue will appear. You can then upload an image by clicking on Browse Server.
From the File Browser dialog you can select images that have already been uploaded to the server.
STEP 3: If the image you need is not on the server you can upload it by clicking on the “Upload” link at the top of the file browser dialog. The upload link at the top of the dialog window will resemble the graphic here:
NOTE: Before clicking upload, make sure that your department folder is selected. STEP 4: Pick the file from your local computer:
Then check any thumbnail sizes you would also like created, and then click Upload. Your file will be sent to the server and resized as needed. Once the server has the file the page will be refreshed and your image should display. STEP 5: Enter a description of the image as it is require for Section 508 compliance and click “Insert” from the Insert/edit Image dialog. Your picture will be added to the content of the page and should appear in the editor.
The image can now be positioned using the alignment buttons , allowing the text to flow around it.
AddingContentfromMicrosoftOfficeAs a result of the formatting code inherent in Office documents, Drupal is equipped with functionality to
paste from Word without the formatting.
STEP 1: First, select the text or content you want to copy from an Office document (either by selecting
Copy from the menu within the Office program, or by selecting the text and pressing Ctrl+C ).
STEP 2: Next, within the text editor in Drupal, click the Paste From Word button . The Paste From
Word dialog box will appear, where you will be instructed to press Ctrl+V to paste the text into the
window.
UsingAnchorTags
An anchor element is called an anchor because it can be used to anchor a URL to text elsewhere on a web page. It is especially useful to navigate pages with large amounts of text or other content.
1. Place the cursor where you like the anchor to be located and click the anchor icon . The “Insert/edit Anchor” dialogue will appear.
2. After naming the Anchor and inserting the anchor in the content, a smaller Anchor icon will appear , showing where the link will go when clicked.
To use the Anchor, outline existing content and click the insert/edit link button. The insert/edit link dialogue box will appear and you can select the Anchor from the drop down menu. Select the Anchor
you created, in this instance called ‘Test.’ The Link URL will automatically populate after selecting the Anchor. Click on Insert to set the anchor.
EmbeddingMedia
Embedding a video within the WYSIWYG Editor is done by using the Embed Media button . After clicking the Embed Media button, the Embed Media Dialog will pop up. This allows a user to insert the code from media such as YouTube, Vimeo, QuickTime, or other video sharing and distribution services.
After clicking OK the embed code will appear as a solid block within the content area. Once the content is saved, the embedded media will appear within the content area.
FileAttachmentsFiles can be attached to any node using the “File Attachments” or “Downloadable Materials” feature near the end of the Add/Edit page. STEP 1: To upload a file, click the “Choose File” button and select a file from your computer.
STEP 2: Then click the “Upload” button and the file will be uploaded to Drupal and you will be given a URL to the file and the ability to hide the file from listing at the bottom of the node.
STEP 3: To delete the file, click the Remove button and save the page.
InputFormatsThere are multiple options for inputs within the editor; however, only three are normally applicable:
Filtered HTML: Allows for a select subset of allowable HTML. All other formats not mentioned will be removed.
o Web page addresses and e‐mail addresses turn into links automatically. o Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt>
<dd>
Full HTML: This is the preferred option. This allows you to fully use all standard HTML code. o Web page addresses and e‐mail addresses turn into links automatically. o Lines and paragraphs are automatically recognized. The <br /> line break, <p> paragraph and
</p> close paragraph tags are inserted automatically. If paragraphs are not recognized simply add a couple blank lines.
Full HTML + Insert Blocks: This is used when there is a need to display inline blocks, for example a sub‐site specific navigation block.
o You may use [block:module=delta] tags to display the contents of block delta for module. o Use [accordion] and [/accordion] with <h3> header tags to create a jQuery UI Accordion widget.
Using [accordion collapsed] will start with the accordion closed. o Web page addresses and e‐mail addresses turn into links automatically. o Lines and paragraphs break automatically.
Plain Text: This option is used to show the source code for the body content. o No HTML tags allowed. o Web page addresses and e‐mail addresses turn into links automatically. o Lines and paragraphs are automatically recognized. The <br /> line break, <p> paragraph and
</p> close paragraph tags are inserted automatically. If paragraphs are not recognized simply add a couple blank lines.
UsingtheCKFinderFileBrowserTo access files using the File Browser, click the Link button and from the Link popup, select Browse Server.
After clicking Browse Server, the contents of the server will be displayed:
From the CKFinder, files can be deleted, resized, etc. Right click on an image, for instance, to bring up
additional file options.