Wednesday, February 13, 2013

Tweaking a theme in moodle

My customer send me a request stating that he wanted to replace our nice branded image in the header of our moodle site with a line of text.  I like the graphic better, but it is his call.

This is what the image looked like prior to the change.




This is what it looks like now:



We are using a custom theme based on the native moodle Anomoly theme. I browsed to the theme folder and opened theme/au/layout/general.php.  I commented out the line that was including the logo graphic and added a new line for the text.

I opened the theme/au/style/general.css file and added a rule for my page-header-title class.

CSS class added:

#page-header-title{
    float: left;
    font-size: 1.3em;
    margin: 10px 5px 5px 5px;
    font-weight: bolder;
}


Prior to making these changes, I activated theme designer mode, so I would see the changes I was making immediatly.  Site Admin | Appearance | Theme | Theme settings | Designer mode.

I experimented on my RD site, not on my live server.  Once I had the changes to the general.php and general.css files the way I wanted, I copied them to the live site.

Moral of the story?

Themes are pretty useful and structured.

No comments:

Post a Comment