Category Archives: CSS Style

TeleTech

CSS: Full Page (Screen) Background Image Slideshow: Made Easy

Full screen background image that span all over the browser window is getting much more popular now. It definitely catches visitor’s eye and boost the overall design of the website. It looks much more colourful and attractive. Few examples of some awesome looking websites are TeleTech, Vivo Group, Chicago L-Shirts and Fleming Steele. This snippet is not specific to WordPress except that it require jQuery and uses WordPress conventions. Please note that it does not require any jQuery plugin.

breadcrumb

Shortcode: Easily Add Breadcrumb

Links are one of the vital parts of a web layout and if you have a lot of them you got to add a navigation and breadcrumb system. So that at any particular article visitor know where he is in the site’s navigation layout and how he can find similar articles. This shortcode will automatically generate breadcrumb for all the posts, pages, categories and tags.

menu

CSS: Cross Browser WordPress Horizontal CSS Menu

Cascading Style Sheets (CSS) is becoming so powerful that we no longer need to use javascript for the mouse hovering events, nor we need to use images to make our web beautiful. With the new CSS3, There are number of properties that adds very cool look to our websites. Some of those are transitions, gradients, shadows and rounded corners. Although, none of these are supported in older versions of Internet Explorer but they do die gracefully.

body class

CSS: Add custom css class in body tag

Add following code to “functions.php” Snippet

highlight current menu

CSS: Highlight Current Page in Menu

Add following snippet to “style.css” Snippet Result

Preview: Author Box

CSS: Display Author Info Box

Add following snippet to an appropriate place in “single.php” Snippet To make it look good, lets add some css (put it in “style.css”) Result

style.css header

CSS: Style.css Header

Add following snippet to the top of your style.css file Snippet Result