Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member

Working with blocks

From: Drupal Gardens Essential Training

Video: Working with blocks

For most of this course we've been dealing with the content that appears in the center of the page and ignored all of the stuff that's floating around the edges. This video talks about that edge stuff, which is contained in something called blocks. These blocks in turn are placed in blocks regions. You can put three kinds of things in blocks. First, there's static content such as text and pictures. Second, there's dynamic content, such as you'd create with simple views as you learned in an earlier video. Finally, Drupal Gardens automatically creates a few special blocks that are available for placement right away.

Working with blocks

For most of this course we've been dealing with the content that appears in the center of the page and ignored all of the stuff that's floating around the edges. This video talks about that edge stuff, which is contained in something called blocks. These blocks in turn are placed in blocks regions. You can put three kinds of things in blocks. First, there's static content such as text and pictures. Second, there's dynamic content, such as you'd create with simple views as you learned in an earlier video. Finally, Drupal Gardens automatically creates a few special blocks that are available for placement right away.

As we look through our page, we can see some of these blocks regions, scroll down a little bit and you see, this is the main region, where our main content goes. This left area is called sidebar A; the right area is called sidebar B. But there are many, many more. There is these down at the bottom. There are some up at the top. In fact, there are about 20 block regions, although only about eight have blocks in them right now. There are two ways to see all the block regions, one of them is to go to a Documentation page on the Drupal Gardens site.

That's at regions.drupalgardens.com, and here we are. As you can, there's a lot of stuff there that we don't have showing on our site. The other way is by going to your site's Block Management page. We'll go back to our site and go there by going to Structure and Blocks, and then clicking on this link toward the top, Demonstrate Block Regions. All of these yellow bars demonstrate, more or less, where these Blocks are. Remember those three columns at the top? Well, here they are, in our own theme.

When you're done looking at the block regions, just click on this Exit block region demonstration, and that takes you back to your list of block regions. Each section of bold text here corresponds to one of those block regions, so we have the Header, Navigation Area, Highlighted Content, and so on. I mentioned Sidebar A, which is a lot of stuff in it, and Sidebar B, and you might remember that we had added some things into the earlier on in the course. Toward the bottom are all of the blocks that are available but are not yet in a block region. They are in this Disabled area.

By the way, I want to mention that these block regions are standardized throughout Drupal Gardens, so if you create something in the Campaign theme and then change to a different theme altogether, your items will stay in their block regions. That's a real boon, because it's not true among contributed themes for core Drupal, generally. That is, if you self-host Drupal, not using Drupal Gardens, but just put it on your own server and you start downloading all these themes, you might find that blocks disappear as you change from theme to theme, but you don't have to worry about that in Drupal Gardens, which I think is just terrific.

Anyway, let's get back to our blocks. When I am working with them I like to open up a few windows. The first one shows this Block Administration page, so I can move things around. The second, which I'll open by right- clicking and choosing it in a new tab, is to show where those block regions are. The third page I'd like to show is just the homepage and, again, I'll open that in a new tab. This way I can see the immediate effects of what I change on this Block page, as well is where those block regions are, very quickly just by moving from tab to tab.

Now, there are a few different ways that I can move blocks from one region to another. Let's say, for example, that I want a move that rotating banner that's at the top from the Banner area into, let's say, Precontent second. Well, I could just grabbed that little compass-like icon and drag it down. When I do that, you'll notice that it changes on the pop-up menu, and it also shows this little orange asterisk. What that means is that I have to save the page, or I'll lose that change. If I were in fact to close this out by clicking on this X, it would not move.

In fact, that's what I'm going to do, because I don't really want to move this. And you see that page redraws, and this banner up here doesn't actually move. I'll go back by going to Structure and Blocks. Another way to move things around, as you might guess, is by changing it in this region pop-up menu itself. Again, go back to that Rotating Banner and move it to Preheader First, for example. It jumps up to that area, and once again we see our orange asterisk. And again, I'm not going to save that. I am just to bring it back to the Banner area.

Another way to change things on a block is by going to the block itself and editing it. You can do that in two ways, either by hovering your cursor over the block itself until you see the widget and then click it and change Configure Block. In the page that you get to, you'll see Region Settings, and there you can choose from the list here of what region you want it to be in, or remove it entirely by changing it to None. You can also get to that Block Configuration page, once again, by going to the Block page > Structure > Blocks and clicking the Configure link next to whichever block you want to change.

Now that you know how to move blocks around, let's look at some of those that Drupal Gardens provides but keeps disabled by default. Scroll down to the bottom here to our Disabled region, and we see Active Forum Topics, Author Information, Add This button. The best way to learn about these is really to start implementing them in your site, particularly when you have a lot of stuff on your site already, because some of these things only become relevant when they are displayed in your content, or when you have a lot of comments coming in. For example, right now, if we go back or front page, we have a block over here, Comments, but no comments are available, so there's really not much reason for it to show. And in fact, it doesn't tell us anything.

In fact, I'm going to remove this one by clicking Configure Block, going to our Region Settings and going to None and saving. One block that I actually like to add is the Recent Content block, which again starts out as disabled. I am going to put that let's say into sidebar A. Now when I do that it, jumps up to Sidebar A, but since there's a lot of stuff there, I'm never really sure where it's going to put it. It might be at the top or the bottom or the middle, so I'll just go down and save and make sure that I like the way that it looks. And there it is.

Although it said that it was at the top before, it actually ended up in the middle. Now let's add a dynamic block that we created earlier with simple views. That block was called Newest Tours. I'll go up to Structure and Blocks once again, and down toward Disabled region. And there's our Newest Tours Block. Go and I'm also going to put that one into sidebar A. Go down and save. Then actually, instead of closing this out, I am going to go to my homepage right there, and reload it.

Now when I scroll down, I see recent content which I put there, and then at the bottom Newest Tours, just as we would expect. This is a good time to take a look at what else is on this page and decide what we really want. You know, I think I am going to remove this sample gallery. We don't need it there, and again, it's just a sample. So, Configure Block, move it out of sidebar B, and it's gone. There is one thing that I want to warn you about blocks: not every one fits into every block region well.

Let's go back down here to that Newest Tours, for example, which looks so good in sidebar A. I am going to configure it, and let's move it up into say, the header region, go down and save it. Hey! It really kind of clutters up the header region there, so I am going to bring that right back down and put it in sidebar A once again. And what you'll find is that a lot of those ones at the very top and bottom of the screen actually change the look of the block quite a bit. So don't just decide, oh! This will look good there, this will look good there, because the typefaces will actually change depending on the design of the theme.

Go back and save the block. Put it back to where it was. Now, at the beginning of this video I said there were three kinds of blocks. They were those provided by Drupal Gardens-- which you already saw, such as Recent Content-- dynamic blocks, such as the one you saw are created by simple views--that Recent Tours--and static blocks that you create explicitly. I am now going to going to create one of those static blocks. To do that, I go back to my Blocks administration page. I could do that again by just going to that tab or clicking Structure and Blocks, and then say Add block.

Block Description, I am going to say "Need guidance?" I'll make that the block title as well, and then, in the Body, I'm going to add "Need help finding your way around? Write for one-on-one help," and then for this Write for one-on-one help, I am going to link that to our Contact page, which incidentally is at /contact, in Drupal Gardens. You'll learn more about that in the video "Setting Up Contact Forms." Click on the link here and make it /contact. There. Go down and change its region so it shows up in sidebar A. Scroll to the bottom and Save.

Let's take a look at what that looks like by going back for homepage, clicking, and scrolling down. There it is! It does show up at the bottom, however, so I am just going to move that up to the top. I think it is important enough. I do that by going down here, grabbing its little compass, dragging it up to the top, and saving. Close that out, and there it is. You know, blocks are a tough subject to teach.

On one hand they're vitally important for defining how people experience your sites, so I wish I could teach them first. But on the other hand you need to understand a lot of Drupal concepts first, about nodes and such, before blocks make any sense. But now you know the basics of block management; we haven't really gone deeply into the configuration pages, or for example you can change settings so the block only shows up on certain pages or to certain kinds of users. If you want to know more of those details, the Drupal Essential Training course is the place to go.

Show transcript

This video is part of

Image for Drupal Gardens Essential Training
Drupal Gardens Essential Training

65 video lessons · 11903 viewers

Tom Geller
Author

 
Expand all | Collapse all
  1. 29m 56s
    1. Welcome
      1m 39s
    2. Previewing the finished project
      1m 29s
    3. What's new in the late 2011 update?
      5m 28s
    4. What is Drupal?
      5m 8s
    5. What is Drupal Gardens?
      5m 57s
    6. Getting started with Drupal Gardens
      5m 35s
    7. Getting help
      4m 1s
    8. Using the exercise files
      39s
  2. 17m 40s
    1. Using the administrative overlay
      2m 54s
    2. Using the dashboard, toolbar, and shortcut bar
      5m 36s
    3. Touring the newly created site
      3m 55s
    4. Configuring the site
      5m 15s
  3. 59m 47s
    1. Creating and managing content
      11m 11s
    2. Creating and managing content types
      10m 35s
    3. Embedding YouTube videos and other media
      4m 5s
    4. Subscribing to RSS feeds
      4m 49s
    5. Categorizing RSS feeds
      5m 1s
    6. Managing tags and taxonomies
      5m 50s
    7. Creating dynamic pages with simple views
      4m 29s
    8. Creating complex information collections with Views
      8m 59s
    9. Creating image galleries
      4m 48s
  4. 37m 50s
    1. Working with blocks
      10m 26s
    2. Setting up rotating banners
      7m 45s
    3. Understanding menus
      7m 27s
    4. Setting up contact forms
      7m 7s
    5. Adding and removing functionality
      5m 5s
  5. 54m 54s
    1. Managing users
      6m 28s
    2. Adjusting user permissions
      6m 35s
    3. Managing comments
      7m 7s
    4. Slowing spam
      5m 20s
    5. Starting discussion forums
      9m 3s
    6. Creating blogs
      4m 41s
    7. Setting up mailing lists
      4m 50s
    8. Allowing users to rate content
      4m 21s
    9. Using best practices for online clubs
      6m 29s
  6. 44m 35s
    1. Getting feedback with webforms
      6m 14s
    2. Publishing RSS feeds
      6m 40s
    3. Taking advantage of social media
      9m 33s
    4. Emphasizing external links
      2m 44s
    5. Improving search engine optimization (SEO)
      7m 30s
    6. Internationalizing sites
      8m 6s
    7. Tracking site usage with Google Analytics
      3m 48s
  7. 34m 40s
    1. Understanding Drupal themes
      5m 44s
    2. Understanding the Theme Builder
      5m 25s
    3. Switching, saving, and copying themes
      7m 13s
    4. Introducing custom CSS
      6m 51s
    5. Refining selections in the Theme Builder
      5m 48s
    6. Exporting themes
      3m 39s
  8. 48m 31s
    1. Changing the site's color palette
      2m 32s
    2. Changing the site's main logo and favicon
      5m 22s
    3. Changing the column number and arrangement
      5m 7s
    4. Adding background colors and images
      6m 29s
    5. Changing element spacing and borders
      6m 11s
    6. Adjusting typography
      4m 24s
    7. Using fonts from outside sources
      5m 7s
    8. Inserting raw CSS code into themes
      6m 57s
    9. Adding visual effects with JavaScript libraries
      6m 22s
  9. 14m 18s
    1. Finessing theme design
      7m 51s
    2. Eight ideas for modifying themes
      6m 27s
  10. 23m 38s
    1. Monitoring sites
      4m 11s
    2. Duplicating and deleting sites
      4m 23s
    3. Adding custom domains
      3m 48s
    4. Using exported sites outside of Drupal Gardens
      3m 46s
    5. Hosting exported Drupal Gardens sites
      7m 30s
  11. 51s
    1. Goodbye
      51s

Start learning today

Get unlimited access to all courses for just $25/month.

Become a member
Sometimes @lynda teaches me how to use a program and sometimes Lynda.com changes my life forever. @JosefShutter
@lynda lynda.com is an absolute life saver when it comes to learning todays software. Definitely recommend it! #higherlearning @Michael_Caraway
@lynda The best thing online! Your database of courses is great! To the mark and very helpful. Thanks! @ru22more
Got to create something yesterday I never thought I could do. #thanks @lynda @Ngventurella
I really do love @lynda as a learning platform. Never stop learning and developing, it’s probably our greatest gift as a species! @soundslikedavid
@lynda just subscribed to lynda.com all I can say its brilliant join now trust me @ButchSamurai
@lynda is an awesome resource. The membership is priceless if you take advantage of it. @diabetic_techie
One of the best decision I made this year. Buy a 1yr subscription to @lynda @cybercaptive
guys lynda.com (@lynda) is the best. So far I’ve learned Java, principles of OO programming, and now learning about MS project @lucasmitchell
Signed back up to @lynda dot com. I’ve missed it!! Proper geeking out right now! #timetolearn #geek @JayGodbold
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

Join now "Already a member? Log in

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Drupal Gardens Essential Training.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Are you sure you want to delete this note?

No

Your file was successfully uploaded.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.