By kornbread on

I'm currently modifying a the Blue Breeze Theme for my site and I would like to change the look of the sidebar.


Right now the output HTML looks something like this: 

<div class="block block-user" id="block-user-1">

  <div class="blockinner">

    <h2 class="title"> Admin </h2>
    <div class="content">
      
<ul class="menu">
<li class="collapsed"><a href="/community/?q=node/add">Create content</a></li>
<li class="leaf"><a href="/community/?q=user/1">My account</a></li>
<li class="collapsed"><a href="/community/?q=admin">Administer</a></li>

<li class="leaf"><a href="/community/?q=logout">Log out</a></li>

</ul>
    </div>
    
  </div>



I would like to create another div container to put the "title" in and then a background image to make it look sharp. However, all of this code is stored in the $sidebar_left variable, and I am unsure how to modify that.

Anyone have any ideas?
Thanks!

⋅ Categories: Drupal 5.x

Comments

mariagwyn’s picture

mariagwyn commented

kornbread: the output of the sidebar is controlled in multiple places. First, in the page.tpl.php, you should see something like 'if $sidebar_'. This outputs the sidebar area. However, the code you pasted in is actually a block (your user-1 block, the default 'navigation' block) that appears within the sidebar (left or right, depending on settings). In drupal 5 you can create special block.tpl.php pages (you have one example probably, node.tpl.php), and can modify this as you want. See the information on customizing the php templates.

However, I think you may actually have an easier solution if you don't want to build special block.tpl.php pages (which requires some skill in php, etc.). If all you want is an image behind the title, you can do it with something like the following CSS:

.block h2.title {display: block; width: ??px; height: ??px; background-image: url(images/image.jpg) no-repeat top left;}
You might need to experiment a bit with the correct css. If you want a different image for different blocks, then instead of calling '.block' call the unique block class .'block-user', and you can give different background images for different titles.

Hope that helps,
mgm

kornbread’s picture

kornbread commented

Mariagwyn,

Thank you for your help. You did offer a really simple solution. It will most likely work for what I am doing.

However, I do think it will be very beneficial for me to learn more about creating and modifying the block template pages. Do you know where I can find more information on how the different templates work together, and which parts of the page that you see in the browser are the different templates? A link would be wonderful.

I have searched the handbooks, and this site, but I was unable to find much information on this, most likely because I don't really know what I am looking for. :)

Thanks for pointing me in the right direction!

Kornbread

ch33ch’s picture

ch33ch commented

Hi mariagwyn,

My situation is similar to kornbread's in that I want to customise the block titles in my sidebars. Specifically, I want to substitute an corresponding image for each block title (rather than using the default text title). I'm currently using the following (trucated) code in my custom block.tpl.php. It works for authenticated users, but not for unauthenicated users. How would I make it work for unauthenticated users? Do I have to make a custom home.tpl.php or a custom front-page.tpl.php file?

Any help will be greatly appreciated.

Thanks,
Ch33ch

if ($block->module == 'user' && $block->delta == 0) {
  $block->subject = t('User login');
} else if ($block->module == 'user' && $block->delta == 1) {
  $block->subject = t('Navigation');
} else if ($block->module == 'user' && $block->delta == 3) {
  $block->subject = t('Online users');
}

if ($block->module == 'search' && $block->delta == 0) {
  $block->subject = t('Search');
}

...

if ($block->subject) {
  print '<h2><img src="<?php print base_path() . path_to_theme()

' .'/images/'. $block->subject . '.png" />

'
}

...