Wordpress customization - The manual way
Scribbled on Friday, August 22nd, 2008It’s the most longest post which I’m trying to write, including everything I did to setup this blog website in Wordpress. It’s still not now complete but within 2 days I will make it more legible and complete it. It was a long desire of mine to share with you what I learned, so please bear with me. If there are any mistakes or error then please tell me.
We have many plugins around to make things automatic in wordpress. But why would anyone need a manual customization ? Some reasons as I may quote down are:
- Sometime plugins may conflict, your site’s design may get screwed or sometime even worse.
- Sometime automatic method fail. Then should you wait for the developer to fix bug ?
- Why use tiny little plugins for everything ? When you can just do it yourself.
- Plugins do cost overhead, which in turn affect the website performance.
- Using same plugins will not add to the uniqueness of your website
These are just some points that exhort me to do my own custom modifications. Yes it takes time for an average bunny, but thats why I’m writing it here to help you. Let me assure you that it ain’t rocket science, just a bit of determination and you can make your website unique and more efficient.
Here is the listing of customizations I will be explaining, these are divided into Design and Code section, design affects the layout and code is related to the data you wan’t to get or display.
Design:
Basic:
- Add your own custom header
- Replace your own bullet image style
- Add a neat hover effect over the hyper-links
- Adding paginated navigation for longer posts
- Adding a Favicon
Intermediate:
- Use of classes and id to provide separate set of effects for Main content and the Sidebar
- Add a nice border around images
- Remove border from smilies. Also removing additional padding and margin
- Adding your custom CSS read on button
- Image effect on hover without Javascript
- Image swap without Javascript
- Round border for Mozilla Firefox 3 browser without using images
- Creating a nice Feed and Email block with CSS. And for some other enhancements too
- Providing custom share and bookmark icon block
- Custom warning or announcement block
- A nice spoiler block for Firefox, Opera and IE 7 browsers without using Javascript.
- A nice custom made Quote Block.
- Modifying Title of posts to include a cool Calendar image which displays date over it
- Enhancing the Text fields and Text areas for better dynamic impression.
Code + Design:
Basic:
- Enable comment posting on pages and custom display messages if comments disabled.
- Displaying Post Meta
- Displaying custom message at the Main Index Template top
- Displaying most popular posts
- Hiding the pages from Header Navigation Bar using simple code edit
Intermediate:
- Adjusting the position of Search text-field and removing newline between text-field and button
- Displaying Gravatars
- Comment boxes customization. Add alternate colors and unique color for the author of the post. Comment numbering
- Getting 5 recent posts
- Getting 5 random posts
- Replacing smilies with your own.