Download OSU Drupal 6 Formatting Blocks Powerpoint

advertisement
Drupal Training Series
Foundations for OSU Drupal 6
Formatting Blocks
This work is licensed under a Creative Commons AttributionNonCommercial-ShareAlike 3.0 United States License
What We’ll Be Covering…
Blocks
•
•
What Blocks Are & How They Work
Understanding Regions
– Ex. 01 A Theme Enabling Refresher
•
Configuring & Enabling Default Blocks
– Ex. 02 Configure Block Title Visibility
– Ex. 03 Add Glossary: Random Block
– Ex. 04 Configure Page Visibility
Menus
• What Menus Are & How They Work
– Ex. 05 Organize Menu Items
– Ex. 06 Create Custom Menu Block
Nice Menus
• What Nice Menus Is and How It Works
– Ex. 07 Create Nice Menus Blocks
– Ex. 08 Configure Nice Menus for Navigation Menu
– Nice Menu 2 Lab
Optimized Menus
– Ex. 09 Combine Menu Features
Beyond Menus
• Default Add-On Blocks
– Ex. 10 Add Announcement: Small List Block
– Ex. 11 Add Most Recent Poll Poll Block
– Ex. 12 Add Feed Aggregator Block
•
Custom Add-On Blocks
– Ex. 13 Create Custom Contact Info Block
– Ex. 14 Create OSU Events List Block
– OSU Mini-Calendar Lab
Summary
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
2
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.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
3
Getting Started: Assignment
Your personal training site should
have both the OSU Grey and OSU
Orange themes enabled.
The OSU Grey theme should be the
default theme in use – at least for
the duration of this workshop.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
4
Getting Started: Ex. 01 A Theme Enabling Refresher
Blocks and Themes interact closely
with each other, so let’s refresh our
memories on how to enable a
theme…
Go to Administer > Site building >
Themes and enable OSU Drupal
Lite and OSU Linen.
Just enable them. Don’t choose
them as the default.
Remember to click the Save
Configuration button afterwards.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
5
Getting Started: Layout Overview
“Old-fashioned” layout, in terms of print media, regards the final
arrangement of information to be displayed to a viewer. It’s how a
printed page looks – where images are, where text columns exist,
etc.
Web page design, naturally, adopted this term as well.
One of the best features of Drupal is its layout versatility. The
appearance can be changed very quickly – as we discovered in the
Drupal 6 Exploring OSU Themes workshop.
This isn’t the only way to change the appearance though, or the
functionality.
Blocks provide the easiest and most robust way of adding and
moving things around on your site: from menus, to images, to addons such as poll results or OSU Event Calendar information.
First we should get a grasp on just what a Block is…
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
6
Blocks: Overview
What Blocks are:
• Movable groups of content on a web page
– Ex: A menu block, a “widget”, a hyperlinked list of content
– Note: A Menu will always reside within a Block, but a Block does not
have to contain only Menus
How Blocks are created:
• Some are created automatically by modules
• Others may be created manually
Why Blocks are used:
• To establish the layout of a page
– Help provide a measure of consistency across a web site
– Provide additional functionality
– Provide structure and readability to content
• To “restrict” content access to particular roles
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
7
Blocks: Overview – Layout Regions
Regions are areas on your theme where you can place Blocks.
These areas are defined in the theme programming.
Top Horizontal Bar
Pre-Content
Top Horizontal Bar
Pre-Content
Menu Block
Menu Block
Content
Content
Content
Content
Left Sidebar
Right Sidebar
Left Sidebar
Post-Content
Right Sidebar
Post-Content
Footer
Footer
Different themes may or may not contain different regional areas,
as well as different quantities of regions. It all depends on the
design.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
8
Blocks: Overview – Control Panel
Let’s explore the Blocks screen:
1. Click on Administer > Site building
> Blocks
2. Yellow bar areas are the available
Regions – these are places where
Blocks can be placed
3
Enabled Themes
2
– These Regions correspond to the table
rows and Region column at the center
of your screen – this is how things are
laid out on a Drupal page
– Different Themes can possess different
Regions
3. At the top of the screen, is a list of
the different enabled themes on
the site
1
– Click on the OSU Lite theme to see
what happens
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
9
Blocks: Overview – Layout Region Variation
OSU Grey
• OSU Color Scheme
• 7 Regions
• Fixed sidebar width
OSU Lite
• Blue, white & orange
color scheme
• 4 Regions
• Fixed sidebar width
Administrators can change themes quite easily.
When this happens, Blocks may have to be
repositioned for the new theme.
Note the lack of a Book navigation block on OSU Lite
Now switch back to OSU Grey…
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
10
Blocks: Basic Configuration & Enabling
The settings for any other block used on one theme generally will
not automatically transfer over if a theme is switched. These
blocks must be configured and enabled respective to each theme
they are used with.
The terms configure and enable are common in IT practices – what
do these terms mean though?
Configure: to set something up so it functions in a desired
way. Different configurations can be applied to blocks to
force them to perform in different ways.
Enable: in Drupal terms, to “turn something on” or make it
capable of working. For blocks to appear on your screen
they must be enabled.
In the following exercises, we’ll configure and enable some
different default blocks to see the various ways we can get them to
behave.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
11
Blocks: Basic Configuration & Enabling – Ex. 02 Configure Block Title Visibility
A title display is a basic configurable
option that all blocks possess. A
block title can be configured to show
the block name, a different name, or
no name at all.
1
To configure a block title so it shows
no name, do the following:
1. Locate the Primary Links block
and click the configure link
2. Type <none> in the Block title
field
2
3. Click the Save block button
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
12
Blocks: Basic Configuration & Enabling – Ex. 02 Configure Block Title Visibility – Result
Before
After
The completed configuration displays a
Primary Links block that has no title.
Optionally, a different name could be
applied to the block, if desired.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
13
Blocks: Basic Configuration & Enabling – Ex. 03 Glossary: Random Block
Let’s add a feature to our site that
makes use of some work we’ve
already done – we’ll add a Today’s
Featured Method block that makes
use of Glossary and one of its
blocks:
1. From within the Blocks main
screen at Administer > Site
building > Blocks, scroll down to
the Disabled group and locate
the Glossary: Random block
2. It’s best to make configurations
first, so click on the Glossary:
Random blocks configure link to
open the configuration screen.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
1
14
2
Blocks: Basic Configuration & Enabling – Ex. 03 Glossary: Random Block – Configure
From within the block configuration panel,
make the following configurations:
1. In the Block title field, add the text
Today’s Featured Method
2. In the Choose from group, select the
Cooking Methods option.
3. In the Update every fields, type 1 in
the first field and select days from
the drop down menu
4. Leave the Show term as link box
checked
5. Click the Save block button
1
2
3
4
After saving the block, you will be
redirected back to the main Blocks panel
5
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
15
Blocks: Basic Configuration & Enabling – Ex. 03 Glossary: Random Block – Enable
Now that we’ve configured the
Glossary: Random block, it will need to
be enabled to be visible:
1. Locate the Glossary: Random block
in the Disabled group
2. Select the post-content option
from the drop-down menu
1
2
Note: This will immediately move the
block up to the area specified within the
enabled group
3. Click the Save blocks button
Block moves to
designated location when
enabled
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
16
Blocks: Basic Configuration & Enabling – Ex. 03 Glossary: Random Block – Completed
View the new addition to the layout by scrolling down
the screen.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
17
Blocks: Basic Configuration & Enabling – Ex. 03 Glossary: Random Block – Check Home Page
Now go to the Home page to see how this interacts with the layout of existing content.
A few benefits are realized here
now:
1. The front page has
additional content added to
it – making it more
interesting and fleshed out
2. The content that has been
added is actually “reused”
from another source
3. The content automatically
changes as specified
This is quite a list of benefits provided for the time it took to configure and enable one
block.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
18
Blocks: Page Visibility
You may have noticed that our newly configured Featured Method
block currently shows up on every page of the site.
For some things, such as contact information in a footer, inclusion
on every page is a good idea.
Other things, such as our Featured Method block, may lose
impact, not be relevant on some pages, or even get annoying if
seen on every single page of a site – especially if the site grows
very large.
Fortunately, with every block used in Drupal, the Page Visibility
can be set in the block configuration.
This means, simply, that you can tell your block to appear on the
pages that you want it to appear on and “hide” at other times.
Let’s find out how to do this…
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
19
Blocks: Page Visibility – Ex. 04 Configure Page Visibility
We’ll configure our Featured Method
block to show only on the Home page
– to do this, return to the
configuration screen for the Glossary:
Random block by clicking its configure
link:
1. Scroll down the screen to the
Page specific visibility settings
group and select the Show on
only the listed pages option
2. In the Pages field, enter the term
<front>
3. Click the Save blocks button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
1
2
3
20
Blocks: Page Visibility – Ex. 04 Configure Page Visibility – Completed
As a result, only the front page shows our
Today’s Featured Methods block, while all
others do not show it
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
21
Blocks: Summary
As can be seen up to this point, Blocks play a very large role in
Drupal. It’s really where most of the versatility comes from.
Blocks interact with many other features on a Drupal site:
• Content
• Themes
• Modules
• Views
Blocks do so much, that sometimes it’s easy to forget the main
reason for having them in the first place…Menus.
Menus, the automated ones that we can move around easily on a
Drupal site, must all reside in blocks.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
22
Menus: Overview
What Menus are:
• An organized list of features or content
• Often contains sub-items
How Menus are created:
• Standard menus automatically created during Drupal
installation
– Navigation menu
– Primary Links menu
– Secondary Links menu
• Custom menus can be created manually by all contributors
on an OSU Drupal 6 site
Why Menus are used:
• To provide organization and clear direction
– Users want to “get there” in four clicks or less
– A plain website with a great menu system will beat out a beautiful
website with a poorly designed menu system anytime
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
23
Menus: Control Panel
The Menus control panel is where a
list of all available menus on the site
exists.
This is where to go to quickly order
groups of menu links and add new
menus.
To view the Menus control panel:
1. In the Navigation menu, click
on Administer > Site building >
Menus
2. The List menus panel provides a
list of all available menus on
the site
Note that there is no menu called
“Books” – Book content actually has its
own special area independent from
Menus
2
3
1
3. Click on the Navigation link
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
24
Menus: Control Panel – Ex. 05 Organize Menus Items
Grab with mouse…
Menu items can be manually grabbed
and dragged to put them in the order
you want them in
1
1. Click on the cross icon next to a
menu item and hold it
2. Drag the item to a new position up
or down the list – you can even
make it a child by indenting it
beneath another item
3. Click the Save configuration button
when you are done ordering things
2
Now return your items back to their original order
(remember to click the Save configuration button
when finished)
…drag to desired location
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
25
Menus: Custom Menu Blocks
Adding items to menus in OSU Drupal 6 is very easy – it can be
done right through the content form. Most of the time the user
doesn’t even have to go into the Menus feature.
At some point there may be a need to create a custom menu,
though. This could be for a few different reasons:
• More refined content organization
• To highlight a specific set of links
• To configure a menu block to show only under a certain set
of conditions
As mentioned previously, Menus, in Drupal, are always contained
within a Block. In fact, the Menus feature will actually create a
block for you.
In the following exercise, we’ll create a custom menu block that
contains links to external websites that relate well to our Food For
Thought web site.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
26
Menus: Custom Menu Blocks – Ex. 06 Create Custom Menu Block
To create a custom menu block:
1. From within the Menus feature
main screen at Administer > Site
building > Menus, click on the Add
menu tab
2. In the Menu name field, enter the
name of-interest
1
2
This name must contain ONLY lowercase
letters, numbers, and hyphens. It must
also be a unique name
3
3. In the Title field, enter the title Of
Interest
4
The title can be mixed case and contain
spaces
4. In the Description field, provide
some descriptive text regarding
what this menu block is for
5. Click the Save button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
5
27
Menus: Custom Menu Blocks – Ex. 06 Create Custom Menu Block – Of Interest Menu Block Created
After the Of Interest menu is created,
you will be redirected to the Of Interest
menu screen, which currently contains
no items
1. Note the addition of the Of Interest
menu link in the Navigation menu
To see all menus, click on the Menus
item in the Navigation menu
2. Now we need to add a Menu item
1
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
28
Menus: Custom Menu Blocks – Ex. 06 Create Custom Menu Block – Add Menu Item
To add a menu item, click on the Add Item tab at
the top of the screen and complete the
following information:
1. Path field = http://www.mypyramid.gov
2. Menu link title field = MyPyramid.gov
3. Description field = Link to the USDA’s food
group guidelines.
4. Weight field = -50
Note that while this new menu appears in the
menu list, no block named Of Interest appears
on the screen
We still have to go in to Blocks to configure and
enable the menu block and we also need to add
some content to make this menu visible.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
29
Menus: Custom Menu Blocks – Ex. 06 Create Custom Menu Block – Enable Of Interest Menu Block
To enable the Of Interest block go to
Administer > Site building > Blocks:
1. Once on the Blocks panel,
scroll down the page to the
Disabled group and locate the
Of Interest block
2. Select the right sidebar option
from the Region drop down
menu
3. Grab the small cross on the Of
Interest item and position it
under the Navigation block
4. Click the Save blocks button
1
2
4
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
30
Menus: Custom Menu Blocks – Ex. 06 Create Custom Menu Block – Completed
The Of Interest block will appear
beneath the Navigation block
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
31
Menus: Custom Menu Blocks – Now You Do It – Add Item To Of Interest Menu Block
Go to Administer > Menus > Of
Interest > Add Item tab and add
another link to the Of Interest block
Path field = copy & paste link from lab
materials
• ex-06.doc
Menu link title field = Calorie Finder
Description field = copy & paste
description from lab materials
• ex-06.doc
Enabled option= Leave as is
Expanded option = Leave as is
Parent item field = Leave as is
Weight field = -49
Click the Save button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
32
Nice Menus: Overview
The default menu effect in OSU Drupal 6 is an expanding menu.
Some users prefer what is commonly referred to as “fly-out” or
“drop-down” menus (for top menu navigation).
Fly-Out Menu
Style
Expanding
Menu Style
The “fly-out” menu style is now available in OSU Drupal 6 as a
configurable option for users. This effect is created through the
use of a contributed module called Nice Menus.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
33
Nice Menus: Ex. 07 Create Extra Nice Menus Blocks
By default, there are two Nice
Menus blocks that already exist – if
you want all menus on your site to
fly out, and more than two menus
are used on the site, more Nice
Menus blocks must be generated.
To do this:
1. In the Navigation menu go to
Administer > Site configuration
> Nice Menus
2. In the text field, enter the
number 5
3. Leave Enable IE Support
checked
4. Click the Save configuration
button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
1
2
3
4
34
Nice Menus: Ex. 08 Nice Menus For Navigation Menu
Let’s make the Navigation menu a
fly-out style. From the Blocks main
panel at Administer > Site Building >
Blocks:
1. Scroll down into the Disabled
group and locate the Nice
Menu 1 block
2. Click on the corresponding
configure link
1
2
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
35
Nice Menus: Ex. 08 Nice Menus For Navigation Menu – Configure Nice Menus 1 Block
Within the Nice Menu 1 block
configuration screen:
1. Leave the Block title field as
is
2. Leave the Menu Name field
as is
3. From the Source Menu Tree
field, select <Navigation>
4. Leave the Menu Style set at
right
1
2
3
4
5. Click the Save block button
5
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
36
Nice Menus: Ex. 08 Nice Menus For Navigation Menu – Enable Nice Menus 1 Block
After redirection back to the Blocks list:
1. Locate Nice Menu 1 in the Disabled list
2. Select left sidebar in the corresponding dropdown menu
3. In the Navigation block Region field select <none>
4. Click the Save blocks button
1
2
3
4
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
37
Nice Menus: Now You Do It – Nice Menus For Primary Links
Configure and enable the Nice Menu 2
block for Primary Links
Configure
Go to = Administer > Site building > Blocks >
Nice Menu 2 > configure link
Block title field = Leave as is
Menu name field = Leave as is
Source Menu tree field = <Primary Links>
Menu Style field = down
Click Save block button
Enable (after configuration)
Nice Menu 2 block region = top horizontal bar
Primary Links block region = <none>
Click Save blocks button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
38
Optimized Menus
Space is a valuable asset for a web page. The space “above the
fold” – which is the area above the bottom of your screen – is
considered prime real estate.
This is why it’s a good idea to make the best use of that space as
possible.
Our Book navigation block is a great tool – but we don’t always
need it to be there. Remember, this little collection is really more
of an appendix to what will be the Recipes section of our site.
There is a way to get the Book navigation block to show up only
when we need it to by combining the Page Visibility setting that
we’ve worked with, along with the Primary Links menu that we’ve
put at the top of our site.
Let’s find out how to do this.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
39
Optimized Menus: Ex. 09 Combine Menu Features – Add Book Page Parent to Primary Links
First, we have to add the top page of our
Cooking Companion book to our Primary
Links menu:
1. Click on the Cooking Companion link in
the Book Navigation block and open it
in Edit mode
2. Open the Menu settings group and
enter the following:
1
Menu link title field: Cooking Companion
Parent item field: <Primary Links>
Weight field: -49
3. Click the Save button
4. A new link appears in Primary links
2
3
4
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
40
Optimized Menus: Ex. 09 Combine Menu Features – Configure Book Navigation Block
1
Now, go to Administer > Site building
> Blocks to configure the Book
navigation block:
1. Locate the Book navigation
block in the right sidebar group
and click on its configure link
2. In the Block title field, enter the
title Cooking Companion
3. In the Book navigation block
display group, select Show
block only on book pages
2
4. Click the Save block button
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
41
Optimized Menus: Ex. 09 Combine Menu Features – Completed
Click on the Home link to view the Home page…
…and then compare it to the Cooking Companion page
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
42
Beyond Menus
As can be witnessed, Blocks can do quite a bit in terms of how the
various menus on a site can be laid out.
But, Blocks extends beyond navigational items as well.
Many different modules that are installed on Drupal sites
automatically generate blocks that can be used to increase the
appearance, functionality, or entertainment value of a site.
The following exercises are going to focus on increased
functionality by looking at some default blocks that are included
on your OSU Drupal 6 site:
• Announcement blocks
• Poll Results block
• Feed Aggregator blocks
Note: These are not the only blocks available – there are many more you can experiment with.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
43
Beyond Menus: Announcement Blocks
In the OSU Drupal 6 Content Types workshop we worked with the
Announcement content type. The content that was entered into
this form would then automatically show and hide itself in a block
based upon a Publication and Expiration date entered.
So we know how to make the Announcement content – let’s close
the circle by learning how to work with the blocks that correspond
with this content type.
There exist two different Announcement blocks in OSU Drupal 6:
• Announcements: Small List
Provides Announcement title, publication date, and View All link in block
• Announcements: Summaries
Provides Announcement title, teaser content, Read More link,
publication date and expiration date
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
44
Beyond Menus: Announcement Blocks – Ex. 10 Add Announcements: Small List Block – Enable
To enable the Announcement block, go
to Administer > Site building > Blocks
and do the following:
1. On the Blocks main page, locate
the Announcements: Small List
block in the Disabled list and
select left sidebar from it’s
corresponding drop down menu
2. Position the Announcements:
Small List beneath the Nice Menu
1 block
1
2
3. Click the Save blocks button
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
45
Beyond Menus: Announcement Blocks – Ex. 10 Add Announcements: Small List Block – Completed
Two things are important to note
here:
First – the Announcement: Small List
block was purposely placed beneath
the Navigation menu and above the
Of Interest menu. This is to assist
people who work on the site. The
Navigation menu will not appear for
Anonymous users, but Announcement
lists can grow long and get in the way
for site contributors.
Second - the Announcement: Small
List block is now enabled, but there
currently is no content.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
46
Beyond Menus: Announcement Blocks – Now You Do It – Announcement Content Lab
Create an Announcement to
populate the Announcements:
Small List block
Title field = BBQ Recipe Contest
Body field = use lab materials:
• ex-10.doc
Input Format option = Full HTML
Publication Date field = Today’s date
Expiration Date field = Three months
from now
Preview and Save
Note how the Announcements:
Small List menu block now appears
in the left sidebar region
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
47
Beyond Menus: Announcement Blocks – Now You Do It – Announcement: Summaries Block Lab
Now return to Administer > Site
building > Blocks and enable the
Announcements: Summaries block
to see what it looks like.
When you’re done, decide which
one you like best and disable the
one you don’t want.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
48
Beyond Menus: Most Recent Poll Block
In the Drupal 6 Content Types workshop, we explored how to
create the Poll content type.
Poll functionality can be increased by using the Most Recent Poll
block, which will provide your site’s guests and contributors with
the ability to interact with your site.
The most recent poll available will automatically show up in a
block on your user’s screen. When the user submits a response to
the poll, he or she will then see the current results of the poll.
As new polls are added to a site, the most recent will show. A link
is provided at the bottom of the block to lead users to older polls
they may not have taken.
Let’s take a look at how this works…
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
49
Beyond Menus: Most Recent Poll Block – Ex. 11 Add Most Recent Poll Block – Enable
To activate the Most Recent Poll
block go to Administer > Site
building > Blocks and do the
following:
1. Locate the Most recent poll
block in the Disabled list and
select right sidebar in the
corresponding drop down
menu
2. Position the Most recent poll
block below the Book
navigation block
3. Click the Save blocks button
1
2
The block will not show because we
don’t have a poll going yet, so let’s
make one…
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
3
50
Beyond Menus: Most Recent Poll Block – Now You Do It – Create Poll Content
Create a Poll with the
following information
Question field = What recipes are
you most interested in?
Choices fields =
• Appetizers
• Soups
• Salads
• Breads
• Entrees
• Desserts
Leave all other settings as they
are and click the Save button
Answer the poll and see what
happens to the block
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
51
Beyond Menus: Feed Aggregator Blocks
The name sounds a little intimidating, but its just the tool that
allows your site to pull in news feeds from other sources and
display them.
The Feed Aggregator, and the blocks it creates, are excellent tools
for sites that need to supply the most recent news to its audience.
There is a little bit of a process, though, because we have to go out
and grab a feed from somewhere. We also have to configure the
Feed Aggregator.
Since this is a site about food and we will include some food safety
items on here, let’s visit the USDA’s Food Safety and Inspection
Service website to get a feed from them and then we’ll set up our
Feed Aggregator.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
52
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Locate News Feed
To gather a feed:
1. Open a new tab in your
browser and go to the
following URL:
http://www.fsis.usda.gov/
1
2. From here look to the right
sidebar and click on the
Subscribe to RSS Feeds menu
link
3. This will take you to a page
with different news feed
options. Click on the Open
Recalls RSS option.
2
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
53
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Gather News Feed
To gather the feed:
1. A page will open with a list of
topics – this is the feed
information that we will be pulling
into our site
1
2. Copy the URL
2
Copy this URL
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
54
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Create Category
To create a news feed category, go
to Administer > Content
management > Feed aggregator >
Add category tab:
1. In the Title field, enter the
title Food Recalls
2. In the Description field, enter
the text “Aggregated food
recall information”
3. Click the Save button
1
2
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
55
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Add Feed
To add the news feed to the
aggregator:
1
1. While in the Feed aggregator,
click on the Add feed tab
2
2. In the Title field enter the title
FSIS Open Recall Cases
3
3. In the URL field, paste the URL
copied from FSIS into the field
4
4. For the Update Interval, select 1
day
5
5. In the Categorize news items
group, click the Food Recalls
option
6
6. Click the Save button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
56
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Configure Aggregator
To configure the Feed Aggregator
do the following:
1. From within the Feed
Aggregator click on the
Settings tab
2. Leave the Allowed HTML tags
as they are
3. In the Items shown in sources
field select 3 items
4. In the Discard items older
than field leave it at 16 weeks
5. In the Category selection
type, leave it at checkboxes
6. Click the Save configuration
button
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
1
2
3
4
5
6
57
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Update Feed Items
To get the Feed Aggregator started,
click on the :
1. While in the Feed Aggregator
click on the List tab
1
2. Go down to the Feed
overview section, in the FSIS
Open Recall Cases row, and
click the update items link
2
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
58
This will refresh your Drupal site and
activate this particular news feed.
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Configure Block
To configure the Food Recalls category
latest items block, go to Administer > Site
building > Blocks and do the following:
1. Locate the Food Recalls category
latest items block in the Disabled
list and click on the corresponding
configure link
1
2. Leave the Number of news items
in blocks field set at 3
3. Click the Save block button
2
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
59
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Enable Block
To enable the Food Recalls
category latest items block, go to
Administer > Site building > Blocks
and do the following:
1
1. Locate the Food Recalls
category latest items block
in the Disabled list
2
2. Select right sidebar from it’s
corresponding drop down
menu
3. Position the block below the
Book navigation block
3
4. Click the Save blocks button
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
60
Beyond Menus: Feed Aggregator Blocks – Ex. 12 Add Feed Aggregator Block – Completed
The result is an auto-refreshing list of
categorized news items that appear
on your site.
One thing to keep in mind – if the site
that is supplying the feed has no news
releases for a long duration, your
aggregated items will slowly fall off
the list and will not be replaced until
new items are released at the source
site.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
61
Beyond Menus: Custom Add-On Blocks
Similar to custom menus, custom add-on blocks can be created as
well.
These blocks can contain anything from images, to hyperlink lists,
to code snippets that allow integration of existing technologies
with Drupal.
Just about anything that you put into a typical content type can be
put into a block – just remember that you may have a smaller area
to work with.
We’ll begin by creating a very simple Contact block that contains
some contact information about the Food for Thought site and
then we’ll move into some integration with the OSU Events
Calendar.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
62
Beyond Menus: Custom Add-On Blocks – Ex. 13 Custom Contact Info Block – Create & Configure
To create a custom Contact Information block, do
the following from within Administer > Site building
> Blocks:
1. Click on the Add block tab at the top of the
Blocks page
2. In the Block description field, enter the text
Contact Info
3. In the Block title field, enter Contact Us!
4. In the Block body paste the HTML code from
the ex-13.txt file in your lab materials using
the Edit HTML Source button
5. Set the Input format to Full HTML
6. Click the Save block button
1
2
3
4
3
5
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
63
Beyond Menus: Custom Add-On Blocks – Ex. 13 Custom Contact Info Block – Enable
To enable the custom Contact Info block
do the following:
1. Locate the Contact Info block in
the Disabled group
2. Select left sidebar from the
corresponding drop down menu
3. Position the Contact Info block
beneath all other blocks
4. Click the Save blocks button
1
2
4
3
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
64
Beyond Menus: Custom Add-On Blocks – Ex. 13 Custom Contact Info Block – Completed
The completed Contact Info
block will appear in the left
sidebar underneath all others.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
65
Beyond Menus: Custom Add-On Blocks – OSU Event Calendar
For those organizations who happen to use the OSU Events
Calendar, you can also display your calendar items on your Drupal
site.
There are two different display items that can be shown:
• Events List
A list of upcoming events that includes the date of the event and the title
of the event. The title can be clicked on to open the Event in detail.
• Mini-Calendar
A small month view calendar, similar in display to a wall calendar. Days
with events on your calendar are marked with an underline to indicate
activity on that particular day. Clicking on the day will open the Event in
detail
To create the blocks, we’ll need to use a code snippet supplied by
CWS on WebTrain.
Additionally, you will need to have an OSU Events Calendar. We’ll
use the Food at OSU – Restaurants calendar, located at
http://calendar.oregonstate.edu/foodatosu/
for our example.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
66
Beyond Menus: Custom Add-On Blocks – Ex. 14 OSU Calendar Events List Block – Create
1
First, from the Blocks page, let’s
add a new block to our site called
Events:
2
1. From the Blocks page, click
on the Add block tab
3
2. In the Block description
field, enter Events
4
3. In the Block title field, enter
OSU Restaurant Hours
4. In the Block body field,
leave it blank for the
moment
5
5. Change the Input format to
PHP code
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
67
Beyond Menus: Custom Add-On Blocks – Ex. 14 OSU Calendar Events List Block – Configure
Now we need to add the code and
change the parameters:
1. Paste in the Events List code from
the ex-14.txt file in your lab
materials
2. Change the code by replacing the
following parameters:
– ‘osu’ > ‘foodatosu’
– ‘month’ > ‘day’
– 5 > 10
1
Original parameters
3
3. Add a line of HTML to the top of
the code to guide users, if desired
4. Click the Save block button
4
Changed parameters
2
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
68
Beyond Menus: Custom Add-On Blocks – Ex. 14 OSU Calendar Events List Block – Enable
Now, enable the new Events block on the Blocks panel:
1. Locate the Events block within the Disabled list
2. Select left sidebar from the corresponding drop
down menu
3. Position the Events block between the Nice
Menu 1 and Announcements: Summaries blocks
4. Click the Save blocks button
3
1
2
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
4
69
Beyond Menus: Custom Add-On Blocks – Ex. 14 OSU Calendar Events List Block – Completed
The Events List will show in the left
sidebar.
Clicking on the title of any of the
restaurants will take you to that
particular event for that
restaurant. In this case, the events
are used to indicate the hours that
particular dining area will be open
at OSU.
Now let’s take a look at the MiniCalendar.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
70
Beyond Menus: Custom Add-On Blocks – Now You Do It – OSU Mini-Calendar Block Lab
Go to the Blocks panel, click on the Add
block tab and create a Mini-Calendar
block with the following information
Block description field = Mini-Calendar
Block title field = None
Input format option = PHP code
Block body field = paste in lab materials
• ex-14.txt file
– Mini-Calendar code snippet
– Change osu parameter to foodatosu
– Type in HTML user note at top, if desired
Click the Save block button
Remember to also enable and position your new
Mini-Calendar block on the Blocks main panel
When done, choose one calendar block and
disable the other
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
71
Progress to Date
Contributor View
Anonymous View
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
72
Summary
As can be seen, Blocks provide an incredible amount of flexibility
and versatility to a site.
We’ve covered a some of the default Blocks here, but there are
quite a few others – as well the opportunity for you to create your
own custom Blocks.
The best way to learn about Blocks is to actually get in there,
configure, and enable them to see what happens. While you
might change the appearance of your page, there usually isn’t
anything within a Block that will hurt your site. So have some fun
and experiment around.
Now that we have layout under our belts, it’s time to take a look at
how we can create additional tools that make our lives easier as
site contributors by learning how to create custom content types.
Visit our Generating Custom Content Types workshop to learn all
about how to create these custom data entry forms.
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
73
Conclusion
This completes the OSU Drupal 6 Formatting Blocks tutorial. For
additional tutorials, please visit CWS Training at:
http://oregonstate.edu/cws/training
To view and register for all OSU Drupal 6 Workshops, visit the
Professional Development Central Registration site at:
http://oregonstate.edu/cws/register
To submit a Help Ticket or make a Site Request on-line, go to:
http://oregonstate.edu/cws/contact
Provided by Central Web Services
541-737-1189
http://oregonstate.edu/cws
74
Download