TLA Webinar: Introduction to Drupal -- part 3 of 3

Intro to Drupal, Part 3 of 3 TLA Webinar Series, Jan. 10, 2014

Introduction to Drupal Part 3 of 3

Text Formats, Images, Media, Views & Themes


Recap from Nov. 11 •  Installation & File System

•  Configuration System Site name, Site email, Timezone

•  Content Types Default types, Adding new types, settings

•  Extending Drupal with Contributed Modules

•  User Roles


Recap from Dec. 10

•  Blocks

•  Menus

•  Taxonomy

•  Webforms


Recap: Drupal Glossary •  Node: a piece of content which belongs to a content type. A

node page is the specific single page for that content, but nodes can be viewed outside of their page.

•  Teaser (aka Summary): an introductory paragraph about a piece of content.

•  Terms (aka Tags): organizational keywords that can be used to create categories or metadata.

•  Module: a package of code (typically written in PHP and CSS) that extends Drupal functionality.

https://drupal.org/glossary


Recap: Drupal Glossary •  User: an individual with login credentials for the site.

•  Role: a set of permissions that can be applied to individual users. Users can belong to multiple roles.

•  Permission: a tool for controlling access to content creation, modification and site administration.

•  User1 (aka Site Maintenance Account): this is the first user on the site, and can do anything. It is not advisable to work on your site as User1. Always create an administrative account for yourself, and protect the User1 credentials.



Recap: Drupal Glossary •  Administrator: a default Drupal role that has high-level

permissions on the site. This should only be given to trusted individuals who know what the tools do.

•  Authenticated user: a site visitor who has logged into the site using their credentials.

•  Anonymous user: a site visitor who has not logged in (and may not have credentials). The general public will typically be anonymous users.



Recap: Drupal Glossary •  Region: Defined areas of the page where blocks and other

elements can be placed. Includes Header, Footer, Content, +.

•  Block: A visible box of content or functionality. Blocks can be created by modules, including Views, or manually added.

•  Menu: A set of clickable navigation items on the page.

•  Menu Item: A specific link in a menu that takes the user elsewhere when clicked.

•  Path or Alias: The last part of the URL of a page (following the domain name), e.g. node/4 or teens/summer-reading.



Recap: Drupal Glossary •  Taxonomy: A core module that gives your site a system of

categorization and classification.

•  Vocabulary: A collection of terms, e.g. Site Section vs. Database Category vs. Special Collection.

•  Term: An organizational keyword that can be applied to a node.

•  Tag: The same as Term, but usually refers to a freeform method of applying keywords and so is more commonly thought of as a classification method for blogging and social media.



Recap: Drupal Glossary •  Webform: A form that a user can fill out, including the search

or contact forms. ALSO: A module that enables the site administrator to easily build complex forms on their site.

•  Select or Other: A module and form option that allows a user who chooses “other” in a form to fill out a text field with the “other” value.

•  Form Component: Each specific field within the form.

•  Form Validation: A module and method for ensuring that user responses in a form line up with requirements.

•  CAPTCHA: A module and method for ensuring the form is filled out by a human (not a spam bot).


What’s next? •  Text Formats

•  Images

•  Media

•  Views

•  Themes


Text Formats And… why do they matter?

Photo credit: http://www.flickr.com/photos/stevenm_61


Why does this matter? •  Security: A CMS allows people to enter data into the site.

Entered data could contain security risks.

•  Branding: A consistent look and feel not only makes your site look more professional, it engenders trust from the user.

•  Usability: If anyone can format however they want, eventually you will have green text on a blue background, difficult to read fonts, or worse.

•  WYSIWYG: Providing content contributors with a UI for formatting will make their lives much easier, as they won’t need to know HTML. It also makes it easier for you to control how they format their content.


Text Formats Demo


Recap: Drupal Glossary •  Text Format: (aka Input Format) A tool for defining the

processing that happens to user-entered text before it is rendered in the browser.

•  Filtered HTML: A default text format that strips unwanted HTML from user-entered content.

•  Full HTML: A default text format that will allow any HTML markup to render in the browser (has security implications).

•  Plain Text: A default text format that removes all formatting.



Recap: Drupal Glossary •  WYSIWYG: (pronounced whizz-i-wig) A graphical user

interface for formatting user-entered content. Comes from “what-you-see-is-what-you-get” (which is not always true).

•  Rich Text: The opposite of Plain Text, but not a text format. This describes all formats when formatting is displayed.

•  Paste from Word: A tool that should be enabled in any WYSIWYG to help strip out unwanted invisible code from any content pasted from a word processor (such as MS Word). Warning: this is not always successful and can give a false sense of security.



Working with Images


Images Demo


Recap: Drupal Glossary •  Image Styles: Predefined settings for displaying an image (size,

aspect ratio, rotation, etc.). Drupal creates new images for each setting, as needed, so that the image styles aren’t rendered in the browser on the fly.

•  Inline Images: Images that are placed within a large block of text (or “blob” of content).

•  Imagecache: The name of the module (now in Core) previously used for Image Styles. Important to know when looking for interesting image modules.



Recap: Drupal Glossary •  Alt Text: Alternate text, or, the text that is presented in place of

the image when the image is not available. Examples of when Alt Text is used:

•  Missing images

•  Screen readers

•  Search engines

Alt text should never be left blank.



Working with Media


Media Demo


Views

Photo credit: http://www.flickr.com/photos/micahtaylor


Views Examples & Demo


Recap: Drupal Glossary •  Views: A module that provides a graphical user interface for

building queries – lists of your content that are displayed in customized ways.

•  Filters: The tool within Views to determine which content displays in any given list.

•  Exposed Filters: Filters that the end-user can see and change to customize what results show on their screen.

•  Sort: The tool within Views to determine the order in which results are displayed.

•  Bulk operations: A tool for performing actions on multiple entities at once.


Themes

Photo credit: http://www.flickr.com/photos/pearlmatic


Theming Options •  Easy/Fast/Cheap: Contributed themes, which can be found free

on Drupal.org or purchased from companies that sell Drupal themes. Mostly plug-and-play.

•  Intermediate: Subthemes, which you create from one of the many well-regarded Base themes such as Zen, Zurb Foundation, AdaptiveTheme, Omega, etc. Enables you to have a custom design without having to start from scratch.

•  Advanced/Expensive: Custom theme, which you build from scratch.


Contrib Themes Demo


Theming resources found at

http://chillco.com/tla-drupal/questions


Questions?


http://chillco.com/ tla-drupal-questions

Technology

TLA Webinar: Introduction to Drupal -- part 3 of 3