I have seen many questions on various sites on 'how do I make my own theme in the Apple install of Blojsom in 10.4 Server?' Well, I dug around in the files for a day or two and here it is. BTW, as you can see, I'm still tweeking my own site.
Disclamer: If you destroy your Macintosh or anything else, don't blame me! Always consult a professional before attempting these modifications.
Here are the steps required...
- Create a weblog via the Apple provided method, i.e. www.yourdomain.com/weblog/. Visit your weblog and use the Settings option to decide what theme you want to modify -- www.yourdomain.com/weblog/macnode -- and remember to replace "macnode" with your username. Be sure to log out and close your browser after this step
- Back up the following folder (in case you break your blog completely): Library/Tomcat/blojsom_root/
- Choose a blog template you want to modify (Grey, White, Graphite, or Blue). Look at the code at the end of this file:
Library/Tomcat/blojsom_root/webapps/ROOT/strings/en.properties
You will see:
Now add another line for your custom theme (we will create this theme in the next step):template.apple_layout=Grey template.v2_layout=White template.v4_layout=Graphite template.v5_layout=Bluetemplate.macnode_layout=Macnode - Create your template files. Go to Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> WEB-INF -> templates. Duplicate the following four files and rename them carefully:
The new names might look something like:html-comments.vm html-referers.vm html-trackback.vm html.vm
html_macnode.vm will be the core file that generates how your blog looks (your new theme).html_macnode-comments.vm html_macnode-referers.vm html_macnode-trackback.vm html_macnode.vm - Create your style sheets. Go to Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> blojsom_resources -> stylesheets. You will duplicate the two style sheets that match the theme you want to modify. For example, if you want to modify from the theme Graphite, duplicate these files:
and rename them to:v4_layout.css v4_layout.jsmacnode_layout.css macnode_layout.js - Change your blog properties file to use the new stylesheet. Replace "macnode" with your user name in the following, as in step one. Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> WEB-INF -> macnode/blog.properties. In the blog.properties files, change this line...
...to reflect the stylesheet you created in step five, so it should be something like:blog-stylesheet=v4_layoutblog-stylesheet=macnode_layout - Create the graphics for your new theme. Go to Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> WEB-INF -> images. Duplicate the files for the theme you choose to modify:
Rename the duplicated files to something like:v4_background_linkhover.gif v4_background_main.gif v4_background_side_bottom.gif v4_background_side_top.gif v4_background_side.gif v4_background_top.gif
Go back to the stylesheet you created in step five (ie macnode_layout.css). Carefully change the lines in the stylesheet to your new graphics, for example...macnode_background_linkhover.gif macnode_background_main.jpg macnode_background_side_bottom.jpg macnode_background_side_top.jpg macnode_background_side.jpg macnode_background_top.jpg
would become...background: url(/blojsom_resources/macnode/images/v4_background_top.jpg) no-repeat top center;
(The line break was added for a narrower display; type it all on one line).background: url(/blojsom_resources/macnode/images/macnode_background_top.jpg) no-repeat top center; - Select the new theme you created. Return to you browser and login to your weblog at www.mydomain.com/weblog/macnode. Go to the Settings and you will see the new theme you created. Select it.
- Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> WEB-INF -> templates -> html_macnode.vm: This is the file that contains the HTML code for your theme.
- Library -> Tomcat -> blojsom_root -> webapps -> ROOT -> blojsom_resources -> stylesheets -> macnode_layout.css: This is the file that is the stylesheet for your HTML code.
- macnode_background_main.jpg, macnode_background_side_bottom.jpg, macnode_background_side_top.jpg, macnode_background_side.jpg, macnode_background_top.jpg: These are the graphics files you created in step seven. That's it; enjoy your new theme!

