Now things are going to get a little rough; just kidding! In Apache Roller, it’s very easy to create your own themes, and in this section I’m going to show you how.
For the following exercises, you’ll need to download http://www.packtpub.com/files/code/9508_Code.zip. Extract the chapter07.zip file’s contents into a directory in your hard disk. For example, I used Ubuntu Linux in the exercises, created a chapter07 directory inside my Desktop directory, and copied the mytheme directory inside Desktop/chapter07. All the steps in the exercises are based on these assumptions.
Every Roller theme has a directory and some required files such as weblog.vm, _day.vm, and theme.xml. The next exercise will show you how to create a directory for your new theme inside Roller’s themes directory, and how to copy these required files from the support files.
Now, I’ll show you all the necessary steps to create your new theme directory inside Roller’s themes directory in a Linux Ubuntu system, and then copy all the required files. If you’re using Windows or any other flavor of Linux, the procedure is very similar:
As you can see from the previous exercise, the mytheme theme has a very basic functionality. That’s because the CSS stylesheet (mystylesheet.css) is empty, so I’m going to show you how to add styles to your headings, links, and all the other elements displayed in your weblog. However, first we need to see a quick introduction to the four files that every Roller theme must have in order to run without any trouble:
File | Definition | Tip |
weblog.vm | Describes the main page of your weblog | In this file you set the structure for your weblog, using macros and elements from Roller and the Velocity template language. |
_day.vm | Describes how to display one day’s worth of entries in your weblog | Here you can configure how to display each entry’s title, content and comments, for example. You can set the font’s color and size of each element, based on the CSS stylesheet definitions. |
mystylesheet.css | Stylesheet override file that defines the CSS style code used by your weblog | Here you define all your weblog’s styles, like size and color for headings and fonts used in your posts. |
theme.xml | Theme definition file that describes each file used in your weblog | You need to include some basic data about your theme, the stylesheet file, the weblog and _day templates, and every other file and/or resource used in your weblog. |
In the next exercises, you’ll learn how to edit these files to change your weblog’s visual appearance and suit your needs.
The first thing we need to do in order to change your new theme’s visual appearance is edit the stylesheet override file: mystylesheet.css. We can do this in two ways: Edit the file directly from the mytheme directory inside Roller’s themes directory, or use Roller’s Custom Theme feature. If we use the first option, we’ll need to restart Tomcat every time we make a modification to mystylesheet.css. On the other hand, if we choose the second option, we can edit the stylesheet inside Roller’s admin interface and see how our changes affect our weblog’s visual appearance immediately, so I’m going to show you how to use the second option.
It’s very easy to edit the stylesheet override file for your custom theme inside Roller, and the next exercise will show you how to do it:
div.dayTitle {
color:brown;
font-weight:bold;
font-size:90%;
text-transform:uppercase;
border-bottom:1px dotted #666;
}
.entryTitle {
font-weight: bold;
}
a {
text-decoration: none;
}
a:link {
color: blue;
font-weight: medium;
}
a:visited {
color: purple;
font-weight: medium;
}
a:hover {
text-decoration: underline overline;
}
body {
font-family:"Lucida Grande", lucida, Geneva, Arial,
sans-serif;
background:#FFFFCC;
}
I remember deciding to pursue my first IT certification, the CompTIA A+. I had signed…
Key takeaways The transformer architecture has proved to be revolutionary in outperforming the classical RNN…
Once we learn how to deploy an Ubuntu server, how to manage users, and how…
Key-takeaways: Clean code isn’t just a nice thing to have or a luxury in software projects; it's a necessity. If we…
While developing a web application, or setting dynamic pages and meta tags we need to deal with…
Software architecture is one of the most discussed topics in the software industry today, and…