This site is powered by WordPress for about 3 weeks now. I thought it would be a good moment to share some of my experiences with you. I am not a great programmer, certainly not in a PHP environment. But I’ll try to explain some in my own style. Okay nough blabber let’s get to it.

I will get into the following topics:

1. Header
2. WP-admin
3. Plugins
4. CSS tips
5. Odds and ends

• 1. Header

I ran into a tip the other day on how add a clickable header in the header file of a theme. Assuming all themes work with a separate header file. In this header file is a <div> section called <div id=”header”>. Simply to add the following I managed to get a clickable header.

A little bit of javascript does the trick.

• 2. CSS tips

Maybe some of you noticed those 4 tiny boxes on the frontpage here. Behind them is a bit of stylesheet stuff that maybe of some interest for you. When clicked upon one of the boxes you’ll notice a well known action. Dynamically changing of the font size. Depending on which resolution you are using it can be handy sometimes to change font size on the fly. Here is how I tackled it.

First make so many copies of your ‘standard’ CSS file (offcourse assuming we are using an external one!). I copied mine 4 times. Then search for the ‘generic’ font size settings. Most likely they are in sections like “body” and “hN”(css header sections), mine were anyway. These are the font-size settings which apply the size site-wide. What I did is increase and decrease the values given here. Pay attention as to apply values which are representational, i.e. not too large not too small.

Next step is to name the ‘new’ stylesheets something like “style_small.css”, “style_normal.css”, “style_large.css” and save them, subsequently load them in the same folder as were you standard css file resides.

Another thing you gotta do is modify the header.php file or what ever name it has. There has got to be a line in the header.php that says;

. Leave this line as it is because this will stay your default css file.

Following step is to add a few more lines to reference the alternative css files for changing the font sizes. Those lines have to look like this.

Where this bit of code

, refers to the place where your css files reside. It is PHP a.k.a WP-code . Copy this line so many times as you have decided to adjust the font size. So if you only need 2 font-sizes you only need 2 of these lines. Offcourse referring to all the separate css files made for the sizes.

Finally you have to activate them through a piece of javascript, also in the header.php file. The javascript for this you can download here. The code to add in the header-file could be something like

depending on the place where you put the javascript file.

Now for the implementing allthis in your web-site you need to get them reachable, or clickable. You must decide where this is to be done. Or for that matter how. I put mine into a <div> and did the layout in the main css file. This is for you to decide. All that matters is that visitors van reach the spots to activate them. Like a normal hyperlink somewhere. I put mine in the sidebar.php file. Like this

The styleswitcher.js reacts on the ‘name’ in this link (‘style03′) and activates the name of the alternate stylesheet you’ve given earlier. Those names (titles) have to be identical to work!

• 3. WP-admin

The WP-administration section on your WordPress environment in it’s standard form is something with desirable alterations. Fortunately there are some great plugins and or modifications around to make this a lot better. But! There is always a but. As I discovered not all of them work the way they should. An important thing to consider is: is the plugin 100% compatible with my
version of WP? Second thing: Which browser am I using, and is the plugin compatible with this browser. Especially the version of CSS it supports (or for that matter, doesn’t…). A few examples:

• Tiger Admin A really great and functional add-on plugin to make the WP admin section really worth your while from www.orderedlist.com. But as the author mentions it only works with a browser which can handle CSS version 2. I really don’t know exactly which browser nowadays supports which CSS version. What I do know is that a big group of users still (whether a good or bad thing) uses IE6. And you guessed it. IE6 doesn’t support CSS2, only CSS1. So there we are. Tiger Admin is not usable for IE users allthough IE7 brings us CSS2 support. But as I mentioned in my previous posting IE7 is still in beta.
• Admin Drop Down Menu Brings us a very compatible plugin to be used in WP-admin. It is realy nothing more then some advanced CSS rendering which does a very good job in accessability for the WP-admin section. RSI patients will love this one for it reduces the number of clicks considerably.
• Spotmilk maybe a good alternative for the WP-admin section. I wasn’t all that satisfied with it so I’ll just leave that to you. Try it maybe you’ll like it. If not just deactivate it and delete the plugin file from the plugins-directory.

Then there is the matter of WordPress versions itself. I noticed that WP1.5 and WP2.0 (which I use) are quite different. Plugin authors often, but not allways, mention that their plugin is suitable for the one or the other or both. As a mere end-user (like myself) it is good practise to be alert on this. Some plugins don’t work at all in different WP versions. Some are dedicated to just
one of them.

A good place to keep informed about plugins and their development is here http://weblogtoolscollection.com.

• 4. Odd and ends

One tip I will like you to consider is this. Ever wanted to show some code in your pages or postings? There is a catch offcourse. Coding-lines in a page or posting can cause strange behavior. So you’ll have escape all the tags and transform them into symbols that show correct on screen but don’t interfere with your website. It is quite a laborious task transforming code in normal screen types. The TIP: I know, it isn’t much of an html-editor, use Microsoft’s Frontpage. It really helps! Just click file-> new. Type some stuff on it like <a href=>, go to the Code page of Frontpage and voila there is your transformed line of code just like you want it. Copy paste and you’re done.

Another Tip much mentioned and one I completely concur with is that use of the TinyMCE WP-editor should be avoided as much as possible.

Go to ‘My-Account’ (top right in WP-admin) and

uncheck the “Use the visual rich editor when writing” (below-left) box. Now you use a more rigged editor which allows you to get grips on your html in a better way.

Final TIP: When you upload your WordPress files for the first time and activated the MySQL database it’s a good thing to consider upfront were you’d like to place the files. What I mean is should they be in a sub-folder or directly into the ‘root’? A very good article about his is found here on WordPress itself. Study it and it will be rewarding I assure you.

Well dear visitors that concludes my very first :0) ‘tut’ on this here blog. I hope you find it usefull and handy to put into practise. I had fun writing it. I am sure there will be more to come. So please come back and give me your comments.