|
blocks.gif
blocks.gif
blocks.gif
blocks.gif
blocks.gif
|
 |
|
|
|
|
|
|
 |
 |
 |
|
| |
 |
Step7: Theme.php / Style.css
Putting your theme together should not be too hard, if this is your first time, I recommend using the sample theme structure, play with it till you get the hang of it then you can make a different structure and setup. I will try to explain showing images and explain each part, you can click on these images to get a closer look. Open up your theme.php in the sample theme.
Image-1-bg color and opentable
The 4 bg color is the main background colors you want for your theme. The text colors are used when there are texts thats not defined by a font class. Only important part on this section is that you dont want to have the bgcolors and the text colors the same color, or else you wont be able to see the text.
The opentable function is almost used in every module, this is used to wrap content up with a box. On this theme I just gave a td class in style.css to define my box style. Notice on opentable function at the end where it says td class extra, keep that in mind for now.
Function Header
The header function in this theme I used theuser variable, in the image above you can see how theuser variable is used. By using (if), this is what how it can tell if its a guest or a user when the visitor enters your site. Open up the header.html at the same time, you will see where I named my user.gif thats where I have the variable theuser in that td section. This is done by giving the variable (theuser) define it in theme.php. Its your choice where or even to use this variable or not, to play with it you can use (topic_list) variable if you like just to see how this works, if you want to use (topic_list) variable, simply uncomment the variable and in the header.html where I have (theuser) change that to (topic_list) just to see what it looks like. There are alot of variables you can use, in the near future I will show you a list of variables to use and how to use.
Function Footer
The footer function is pretty simple, I just used footer message variable, the image above you can see how its defined, I also moved the banner function into the footer, most themes have it at the header function, you can do that as well. I have my banner function if you have banner ads on site it will opentable then show your banners, in my opinion it looks better that way, having it wrapped in a table.
The next 2 would be the themeindex (story box) and the article function. In general, most themes have the same functions for these 2. You can open up the storyhome.html and storypage.html to see what I did with the story box.
Function themesidebox is the last one on the theme.php which is the easiest, only using (title) variable so not much explaining here. Moving on to the last and final, style.css
Style.css style sheet
The style sheet can make a big difference in looks on your theme, open up the style.css in the sample theme, you can see the classes I used for this theme. You can give it any class and any colors you like for any sections of the theme, The one I will point out is the (td.extra) class, that is what I used for opentable and story page. Tip: for this class, I used a background color that is close to the main background color of the theme, but not exact, this way you can still see it when the main background is showing. Also for the borders, you can have all 4 showing same color, just in my opinion for the right and bottom I used 1 color and top, left I used another color. This way it kinda have a 3d feeling in it. The scroll bars on each class (most important under the body section which is the last 2 lines in the style.css) again in my opinion, I use something thats close to the themes colors, you can use the scroll bar generator on my community to see what the colors will come out like.
Thats it for now, I know this tutorial is not so detailed and I dont explain too well, my advice is just open up all the files thats given and play around with them, also look for commented lines inside the htmls and the theme.php. The amount of time I have its hard to make a full detailed tutorial, plus there are so many ways on making a theme I cant cover all lol. Feel free to post on my forum to ask any questions about themes, or if you need help on certain part, I will try to help out when I can, hope this tutorial can get you some where, enjoy! |
|
|
|
 |
 |
 |
|
|
|
blocks.gif
blocks.gif
blocks.gif
blocks.gif
blocks.gif
blocks.gif
|
