Add a Block Region to a Drupal 7 Theme

drupal-add-block

In this tutorial, I will walk through the steps for adding a region to Drupal’s Bartik theme. There are a couple ways you can do this.

  1. Modify the Bartik theme directly. Of course, this is not the suggested practice. In the Drupal community, we don’t modify Drupal’s core unless we are applying a patch.
  2. Copy the Bartik theme to the /sites/all/themes directory, rename the theme, and modify it to include the region you desire.

There is a third option, which includes turning Bartik into a base theme and then creating a sub-theme, but that conversation is outside the scope of this tutorial.

In this tutorial, we will make a copy of Bartik and modify it.

Step 1. Copy the Bartik theme

media_1377805008461.png

Go to the root themes directory on your server and download the bartik directory to your computer. Rename the directory to mybartik.

Step 2. Modify the bartik.info file

media_1377805326159.png

Open bartik.info in a text editor like Notepad and make the following changes.

  • Change name from Bartik to mybartik
  • Add the region you want. In our example, we are going to add a region below the content region. Insert regions[content_bottom] = Content Bottom (see line 18 in the screen shot)
  • Save the file as mybartik.info

Step 3. Add the region to the page template.

media_1377805736177.png

First, open the templates directory and then open page.tpl.php and tell Drupal to print the new region. Enter the following line of code as shown in the screen shot.

<?php print render($page[‘content_bottom’]); ?>

Inserting the region here will cause content bottom region to be rendered the same as the content region. Of course, you can place the region where ever you want but remember to wrap this line of code in a <div> tag so that you can apply the CSS that makes the region unique.

Step 4. Upload mybartik to your site

media_1377806046871.png

Upload your new theme to the sites/all/themes directory.

Step 5. Enable your theme and see the new region

media_1377806146610.png

Go to your site and click on Appearance in the black menu bar. Enable and set as default the mybartik theme that now appears in the disabled list.

Summary

The example above is simple, yes, but it conveys the steps needed to add a region to an existing theme. You can follow this process for any Drupal 7 theme. However, if you choose to copy and then modify an existing theme and that theme is updated, those updates will not automatically post to your version of the theme. If you choose to simple modify the theme so that updates can be applied, then you will likely loose the modifications you made.

At the start of this tutorial, I mentioned the base/sub-theme strategy. This strategy leaves the chosen theme in tact except for a minor modification to the .info file, allowing you to easily update the theme and not loose the changes you have made because the changes are stored in a sub-theme.

Author

0 0 votes
Article Rating
Subscribe
Notify of
guest

9 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
User
User
10 years ago

Just what I was looking for, thanks!

Nux
Nux
10 years ago

I don’t understand. How does that differ from “Copy the Bartik theme to the /sites/all/themes directory, rename the theme, and modify it to include the region you desire.”. You did just that. Or am I missing something.

Nux
Nux
10 years ago

Here is a correct way to add a sub-theme:

[url=http://www.coolestguidesontheplanet.com/downtown/make-subtheme-bartik-color-appearance-module-wheel]http://www.coolestguidesont…[/url]
To add a region just change copy page.tpl.php from “bartik/templates” to “mybartik/templates” nad change info file.

Chris Brown
Chris Brown
10 years ago

This is a very good template. I will try to apply it to my website: [url=http://templendo.com]http://templendo.com[/url]

Pradeep Kumar.B
Pradeep Kumar.B
10 years ago

hi..thanks

Jadeng47
Jadeng47
8 years ago

hi,

i’m using the marinelli theme,

I want to create a block region on the left far side bar (out of any content)

what code do I need to put in to make this possible?

Michaël Lessard
Michaël Lessard
8 years ago

Thank you ! Very helpful and concise.

bhuvesh
bhuvesh
4 years ago

i have bootsrap theme and i made subtheme of that theme and in that theme there is region like this
regions[navigation]    = ‘Navigation’
regions[header]        = ‘Top Bar’
regions[highlighted]    = ‘Highlighted’
regions[help]          = ‘Help’
regions[content]        = ‘Content’
regions[sidebar_first]  = ‘Primary’
regions[sidebar_second] = ‘Secondary’
regions[Top_Footer]    = ‘Top Footer’
regions[footer]        = ‘Footer’
regions[page_top]      = ‘Page top’
regions[page_bottom]    = ‘Page bottom’

This all data is in .info file

as u see i add a region top fotter in this but i want to render a block also so how can i make could anyone will suggest it to me .

imrodmartin
4 years ago
Reply to  bhuvesh

Hi bhuvesh,

this is a VERY old blog post that is for Drupal 7 and Bartik only.  Bootstrap has it’s own way of doing a sub-theme.  

Let’s see what we can do:  Are you on Drupal 7 or 8? – the theming engine is very different for both.  Let me know and we’ll see how we can help. 

Thanks
Rod

9
0
Would love your thoughts, please comment.x
()
x