The Blue Fade theme (currently version 3.0) was originally created for my own blog and was designed to match the main website that I previously had. This updated version now includes threaded comments for WordPress 2.7 and above.

Web Considerations Blue Fade WordPress theme design

Downloaded 194 Times

Preview Theme

As more of my customers and website visitors made their nice comments on the design, I decided to make it available for other webmasters and bloggers who wanted to use the theme for their own. Of course I had to make some tweaks and modifications before it was released to the general public, but after just a little work, I made the theme available for download at no cost. You can also download it directly from WordPress as it is now listed in their theme directory.

Features

  • Clean and easy to navigate, two columns, Photo-friendly, Widget ready
  • Passes both XHTML/CSS validation
  • Gravatars support
  • Access to admin menu from any page
  • PNG file included so you can change the default “Blue Fade” text in the logo to match your blog name

To install the theme:

  1. Download the Blue Fade theme.
  2. Unzip the bluefade-3.0.zip to the themes directory of your blog i.e. wp-content/themes.
  3. Upload the wp-content/themes/bluefade directory to the server the WordPress blog is installed on.
  4. Log into your blog admin console and activate the theme. It is called Blue Fade 3.0 (at this release).

Blue Fade Logo Text

The Blue Fade theme includes a “header.png” file located in the fireworks directory that you can edit to include your own blog name with the custom styling that is used on the “blue fade” logo. I used Fireworks to create the file but any graphics editor that can read png files should work.

To edit the file, open in your graphics editor.

  1. The file is wp-contentthemesbluefadefireworksheader.png.
  2. Change the “blue fade” text in both the name and shadow of the text to the name you want i.e. your blog name.
  3. The header.png is sliced into two files: back-ground.jpg and logo.jpg.
  4. Export the files to the images directory of the bluefade directory in your themes and upload the images again.
  5. By default, the alt description of the logo is set to alt=”WordPress Theme Design – Blue Fade – Web Considerations”. You can change this in the header.php. You need to have an alt description for valid XHTML.
  6. The coding in the header.php already uses the proper file location and logo file name.

Since you can change the words “blue fade” in the PNG to any name you want, you may want to remove your blog name (and/or description) from the very top of the page and change it to something like your page/post titles. To do so, look for (…div id=”top”..) (…?php bloginfo(‘name’);…) – (…?php bloginfo(‘description’)…) in the header.php and change it something you want.

For example, if you want to change it to the title of your specific pages and posts remove (…?php bloginfo(‘name’);…) – (…php bloginfo(‘description’);…) and add (…?php the_title(); ?…).

By the way, I could not put the actual code in this page since WordPress recognizes it as just that… code. (The details are in the readme.txt that is included in the download).

Last Notes

  1. When I tested this theme, it validated on the XHMTL and CSS perfectly. However, I have noticed on some sites, one (1) error will occur concerning a closing </ul> tag.
  2. If this happens to you, remove the <ul class=”menulist”> line above the “…( function_exists(‘dynamic_sidebar’)…” and the </ul> line below the …?php endif; … line located in the SIDEBAR.PHP.
  3. The theme includes all the standard features in the sidebar.php i.e. Search, Pages, Archives, Category, Blogroll and Meta. If you have added any of those specific features in your Widget management, just delete the appropriate areas out of the sidebar.php OR remove them from your Widgets management tool.
  4. The overall look of the theme looks better when the pages and posts are several paragraphs long or the are several posts per category. However, the theme still functions and looks just fine for shorter lengths. The only small thing is that if the length is shorter, the sidebar items will extend past the content. No biggie really.
  5. The style.css file, of course, contains all the styling for the layout and WordPress sections of the design. I did my best to lable the specific sections or elements. If it not labeled, don’t fret… it’s in there. The style.css is sectioned pretty good though; at least in my head. :)

Release Version Changes

Version 2.1.0

  1. Modified the sidebar.php to move the Category section above the Archive secction.
  2. Modified the index.php and changed the “continue_read” styling from a SPAN element to a DIV.
  3. Modified the index.php and changed the “tag” styling from a SPAM element to a DIV.
  4. The changes in item 2 and 3 were to correct a XHTML validation error when, as an admin, you set the default home page of your post to “Your Latest Posts”. If it was set to a specific page it would validate fine before the fix but now will validate fine with either option.
  5. Modifed the 404.php to better display the “Not Found” message and to include a list of recent posts.

Version 2.1.1

  1. Modified the comments.php to pass XHTML validation when there are two or more comments. (Changed avatar element from ID to class)
  2. Modifed the comments.php to correctly connect to login page when admin options are set to “Must be registerd and logged in to comment”.
  3. Modifed the functions.php to better style the sidebar when widgets are added.
  4. Removed the XFN link from sidebar.

Version 2.2

  1. Modified comments.php to include new “threaded comments” as a part of WordPress 2.7.
  2. Created this new HTML file for version release changes and notes.

Release Changes 3.0

  1. Modified header.php so that the reply link moved the reply form to the proper comment.
  2. Modified the style.css to better style the input and text areas.
  3. Renamed the blue-fade folder to bluefade so that the theme preview displayed the screenshot properly. (Issue surfaced in WordPress 2.71.
  4. If you are replacing any previous version, you can delete the blue-fade folder from your server and replace it with this version. Be sure to copy over any plugins that you have installed.

License

Blue Fade theme is released under GPL License.