Basic Theme Modifications - Part 1

Basic Theme Modifications - Part 1

Based on my own findings while teaching ocPortal to a bunch of eager students, I've noticed that one of the first requests after installation was: "How to modify the Site's Logo, Header and Background?" Since this interest is probably similar for new users everywhere, I've decided to show my work here in a series of posts to illustrate a few simple tricks I've discovered. I am far from being an expert on the matter, but after looking at the excellent work of amichan and having to teach the basics of themeing to my students, I found it easier to do so with a series of visual aids in the form of pictorials illustrating different processes to edit the header and Background images used in the ocPortal software. They were initially designed as part of a classroom context presentation, and I hope they will be clear enough as standalones. I have done these before the excellent video tutorial prepared by Allen Ellis, which I recommend viewing before anything else to get a good grasp of what is involved. In this first installment my approach is not as inclusive, since I do not intend to modify the zone menu, css, or templates, in any way.

The first in this series is simply to illustrate how to modify or replace the Top Left Logo after creating it with the Theme Wizard or the Logo Wizard. You have certainly noticed that these methods offer an easy and efficient way to add a standard logo to the website, but you might want to make some creative changes to it. If you are good with graphic design or simply wish to modify the Text and Color of your logo, you will be able to replace the Logo with your own creation in these simple steps.

Preview the result: Visit this Test Site

Part 2, will show how to change the Header Background and use the Logo to add a simple animation.