I am trying to finalize my first drupal website (version 6.6) by theming the pages. I want to create some custom page designs (for user profiles, front page, landing pages etc) using Views, Panel modules and by manipulating/relocating information generated by other drupal modules. To do all these I think I probably need to know how to create my own template.php file...and I will need to have good understanding of phptemplate before I can even start... but I am having a hard time learning...
I have found some good tutorials online but because I have very limited knowledge in PHP and am still struggling to understand what they are trying to explain, here is some of the information I found:
http://drupal.org/node/221881
http://drupal.org/phptemplate
http://www.chapterthree.com/blog/matt_cheney/howto_fully_theme_and_custo...
http://www.lullabot.com/articles/hacking_phptemplate
http://www.nicklewis.org/node/841
http://drupalsn.com/learn-drupal/drupal-tutorials/drupal-theming-tips-an...
http://drupal.org/node/23348
I am a little lost and dont know where to start... I wonder if you know any tutorial online for beginners like me...any help will be much appreciated =) Thank you
Comments
There's several theme
There's several theme related drupaldojo videos-- I'd watch them all. They're excellent. Even the ones for d5-- much of the concepts are still applicable.
===
"Give a man a fish and you feed him for a day. Teach a man to fish and you feed him for a lifetime." - Lao Tzu
"God helps those who help themselves." - Ben Franklin
"Search is your best friend." - Worldfallz
This is great!
Thank you WorldFallz for the link!! I love it. I hope many drupal users will find their way to this too =) thank you.
You might...
...want to learn on a plain core test site to begin with. I suspect things like views and panels will make it harder to get the basic concepts and add some confusion.
Once you have the basic core stuff figured out somewhat then you could try theming the more advanced addon modules.
As for where to start?
How about at the beginning? It sounds like you want to run before you can walk and dive into theming panels etc. I suggest instead of looking for the perfect tutorial (you probably won't find it) and thinking you need to know everything before you start, just have a go. eg:
create a folder for your theme in sites/all/themes,
create an info file (base it on another themes one if needed),
create an empty style.css for your theme (make sure it is listed in the .info file),
copy a page.tpl.php file from another theme into your folder, and just try changing some of the HTML in the template (don't worry about changing the PHP for now). Look for the changes in the HTML output of your site,
Note: When adding a new template (or function), you need to rebuild the theme registry for the changes to be picked up. Simplest way: On the "Administer > Site configuration > Performance" page, click on the "Clear cached data" button.
Add some CSS to the stylesheet - eg change some background or text colours etc,
look through the core template files (anything ending in .tpl.php, but something common like node.tpl.php or block.tpl.php would be good) for one that looks interesting, and copy it into your theme folder. Make some changes to the HTML markup and look for the changes in your sites output,
etc
Don't worry about the PHP aspect yet, just get a handle on the different files and templates etc and learn things one step at a time by trying them out. You'll only need template.php if you want to override theme functions (ie ones without templates) or change the variables sent to the templates. While you will want to learn how to do that eventually, don't bother with it just yet.
After you've had a little play with templates etc, try installing the devel module and looking at the theme developer bit. It's pretty nifty and can tell you which templates or theme functions you'll need to override to change certain bits on the page. Install some contrib modules and look through their files and use devel to inspect their inner workings etc.
After some actual experience of the basics, the theme docs will start to make more sense. Even the PHP might start making more sense and even if you can't write any yet, you'll start to have a vague idea what it is doing. That might be the time to go looking for basic PHP tutorials on the web.
But the key is to just make a start. That way when you run into specific problems trying to do something you can ask for specific answers in the forums :)
--
Anton
Thank you!
Thank you so much for your help Anton, actually what you said is right, i have already created two custom themes myself using the default ones as template. both themes are working fine and i am able to change the layout, add regions or move things around in page.tpl.php file now. Today i am playing with Views and have been able to figure out how to create pages/blocks/panes in Views, my next step would be create pages using Panels.
I still need to spend some time to learn using devel module. thank you for the information on devel i never thought that it can help creating templates. can you tell me abit more about Devel module?
I have read several PHP tutorials online and right now reading a book "PHP 5 and MySQL Bible" I am starting to understand how PHP generally work but what I need to get the job done now is to understand how phptemplate works in drupal and how to manipulate them...
thanks again for your kind help =) i hope to hear from you again here.
Theming
It's like Firebug for PHPTemplate. That about sums it up :)
If you don't use Firebug yet (I assume you do already), run don't walk to google so you can get it installed in Firefox. It is the single most important tool available for anyone doing HTML/CSS work.
Watch the Theme Devel screencast:
http://drupal.org/node/209561
OK, you shouldn't be too far away from "getting it" then :) You are probably just missing one or two simple pieces that will make the whole puzzle fit together. I not sure exactly which pieces they are though, so I'll give you a quick and rough overview (the Drupal 6 theme guide should fill in the actual details)...
The important common PHP stuff to understand for this is functions - eg how you define them, how to call them, and how to return stuff from them. That will allow you to make more sense of the API docs at http://api.drupal.org
When Drupal (eg core or a module) wants to create some HTML output from some data, it does so via theme functions or templates. These get processed by the theme() function. The theme function then goes looking for the correct theme function or template to use to render that data as HTML and also looks for any overrides in the current theme.
I'll explain overriding theme functions as it sounds like you've already used template overrides...
eg the code in the user module creates a block with lists of users in them, and you want to override that.
The block function is user_block(). If you look through the code you'll see some lines that look like :
Don't worry too much about that - the theming bit to look at in there is:
$output = theme('user_list', $items);. This is how Drupal core and modules call the theme layer via the theme() function to render their data.The theme() function is sent a string identifying the theme 'hook' to use and the data (eg in this case the array $items which came from a database query) to be sent to the theme hook.
If the theme layer doesn't find any overrides for the 'user_list' hook, it will use the default fallback implementation called theme_user_list(). If your template.php has a function called phptemplate_user_list() or yourthemename_user_list() it will use those instead of theme_user_list().
So if you haven't overridden theme_user_list(),
$output = theme('user_list', $items);effectively uses$output = theme_user_list($items);which is the default implementation for the HTML output.This is the default implementation of the 'user_list' theme function (I've added some comments):
If you're wondering where the actual HTML is, well you'll notice the data that gets returned from the function also passes through another couple of theme hooks eg 'username' (default function is theme_username()) and 'itemlist' (default function is theme_item_list()). Each of those functions could also be overridden in your theme.
Basically the easiest way to override a theme function is to copy the original function into your themes template.php file and rename it eg yourthemename_item_list. Once you've renamed it, you can alter the PHP code inside your copy of the function.
--
Anton
Thank you so much
Hi Anton,
Thank you so much for your kind help. I will spend this weekend trying to learn and hopefully figure out phptemplate and get the job done soon =)
Thanks you so much!! I really love this place!
BB
No problem
I didn't actually mean to spend that long on it, but it's a big topic :)
And the other replies about the preprocess functions are worth looking into too (when you get to that point).
Just to clarify where they fit in:
There are two types of theming implementations - templates and theme functions. Theme functions are generally used when the output requires a lot of processing (eg loops, decisions etc) and don't have as much markup, while templates are generally used when there is a single chunk of markup with a few PHP print statements spread through it for the variable bits.
Each approach has a different method of overriding and you generally need to use the same method as the original implementation did *.
Theme functions are overridden by a suitably named PHP function in your template.php.
Templates have two parts (one for the processing and one for the final markup), but you don't need to override both if you don't need to. For the markup there is the template itself, which you override by copying a template file into your theme. But if you want to change the templates variables, that's where the preprocess functions that you put in your template.php come in.
Hopefully that helps get your head around it.
* Although if you know what you are doing you can alter the theme registry to switch methods or generally hack around with the process. Don't bother about learning that yet though, but it is the kind of thing that really impresses me about Drupal 6 :)
--
Anton
Hi again
Hi Anton,
I read your post and now I think I have a better idea of how phptemplate works....
i was originally trying to redesign the user profile page but have found an easier way to get what i wanted (it looks like in drupal 6 we can rearrange items on pages two ways, using phptemplate and also the template files that comes with the modules, i used the later method by simply copying the original tpl.php file to my custom theme folder then rearrange the items) that was easy!!
I am now looking at the home page of my organic groups and need to do the same thing here again but this time i am guessing that i do need to use phptemplate...
i have created a content type using cck and set that as a group node.
in that content type, i have
1.Title stay as Title
2. Body set as the group's mission statement
3. imagefield where user can upload an image as the group's avatar
4. taxonomy field where user should select a type for the group they are creating
Everything works fine till now and i created a test group and posted few messages as a user to the group.
Now when I go to the group's home page, I will get:
1. group's name (title)
2. group's mission statement (Body)
3. user submitted contents (events, discussions, messages etc)
4. group avatar (imagefield)
5. group type (taxonomy)
I want to have the group avatar and group type to come above the mission statement at the top of the page but have no idea how to do it. when i look in to the node-og-group.tpl.php file which comes with organic group, it looks like all 1, 2, 3, 4, 5 comes from $content and i am guessing that i need to find this $content, somehow use it to create a template.php file and redefine the function phptemplate_, then rearrange the items... ( i hope you can understand what i mean...)
if what i am guessing is correct, i need to know where to find this $content thing....
$content appears several times in the og folders and i am not sure which one should be used...should i look for one that is 'connected' to "theme_" or that doesnt matter? what about those preprocess functions? i am not sure if this is something supposed to be simple since og is a big module and there are many files that come with it...
i tried also rearraging the page by manipulating the og_ghp_ron node view with no luck at all... i am wondering if i should do this using panels...
please let me know what you think...
thank you.
Not too sure
as I haven't themed CCK or OG stuff before, but...
The theme devel module (you have installed it, right?) will help you instantly track down the theme functions and templates/preprocess functions that are used for each bit.
--
Anton
Yes I have installed Devel
Here's what i have got
1. For the entire page ( I am guessing that this is where I should find the hint but the list is so long...lol) :
2. For the user submitted content section:
3. For the group taxonomy section
4. For the avatar:
by the way this is inside node-og-group.tpl.php file:
any suggestions? =D drupal is fun
I suggest you look at the CCK theming docs
As I said, I've never themed CCK stuff before.
But in general if you want to change something that is already a template variable (eg $content), you need to look through the preprocess functions that generate that variable. You'll hopefully then find something there that you can override.
--
Anton
Zen theme
You may want to try to work from something already done and with great documentation as well. The Zen Theme has a sub-theme structure, so you don't need to include everything yourself if you have the Zen theme installed alongside your custom theme. http://drupal.org/project/zen and if you want to edit a *.tpl.php, take the one that it is currently using and copy it to your sub-themes folder and make your edits there.
Hi Ninja
Hi Ninja Overlord,
Konnichiwa! Thank you for your reply. I did create my own custom theme using a default one as template. I have just downloaded the Zen Theme and will check it out later tonight, but what do you mean by "have the Zen theme installed alongside your custom theme"? Do you know where I can find tutorial for creating template.php file for starters?
Thanks again for your time. Sayonara and have a great day!
...
Theres no point in creating a generic template.php file (for starters as you described) since this is going to be site specific - i.e. to include customisations for your particular site - see styro's very informative post above. That said, one of the handiest things to use in template.php are preprocess funtions - which are covered in some detail in the Drupal 6 theme guide.
"have the Zen theme installed alongside your custom theme"
Zen is a starter theme framework - the idea is to build a subtheme and never touch the core framework. A similar but different framework is Genesis which works the same way (copy/paste the included subtheme to get started sort of thing).
If you want a pretty serious introduction to what you can do in template.php with preprocess functions and other theme function over rides take a look at both Zen and Genesis and a number of other themes that make extensive use of template.php.
Pimp your Drupal 8 Toolbar - make it badass.
Adaptivetheme - theming system for people who don't code.
Hi jmburnz, You guys are
Hi jmburnz,
You guys are great!! Thank you so much for your message. I have downloaded Zen theme and hopefully will be able to check it out this weekend too.
Thanks again to all you guys!
Sorry for the delay, I was
Sorry for the delay, I was lacking my laptop for awhile, so I've been disconnected from the internet...
Anyways, after you install the Zen theme, you can check the read me file, or the documentation linked from the project page: http://drupal.org/node/226507
Once the basic steps are complete, number 9 tells you how to where to get the a template.php file to customize within the Zen theme.
Hello again Ninja
Thank you for the additional information. I have downloaded Zen template and am scheduled to look into it actually today. It's going to be fun and I will post more questions later...
Thank you all
Sorry for replying so late...recently my side job has become more like my main job =[ but I am happy that I should be able to carefully go through everything posted on this page tomorrow and during the weekend.
Thanks again so much to everyone of you =)
hi thanks
This Tutorials is very good