Carterlake/AJAX/PHP Template - Color Theme Switcher Plugin

I made a Weather Display/PHP/AJAX Website Template - Color Theme Switcher Plugin for the new templates Ken released.

03/07/08 The Color Theme Switcher is officially launched

03/08/08 The Color Theme Switcher Plugin is now included in the Weather Display/PHP/AJAX Website Template Set.

03/10/08 The Color Theme Switcher version 1.05 now has 16 themes and they have also been added to the Weather Display/PHP/AJAX Website Template Set by Ken True

Theme switcher css files updated today:

update your style switcher CSS files:

Download:
www.642weather.com/weather/scripts/css-theme-switcher.zip

Version: 1.23 27-Jun-2009

  • removed a css hack for IE7 compatibility because it basically caused another IE7 problem.
    removed clear:right from main-copy and main-copy-dark
  • It is suggested that if you want to use IE, upgrade to IE8, it has many improvements.
    To upgrade from vers 1.22: just replace all the css files from this zip file to your server

The Color Theme Switcher Plugin is packaged with 16 style themes of many colors of both narrow and wide layouts.
You can install it with just one include file, some included theme css files, and only a few lines of code to add.
It is really easy to install, only 5 minutes :smiley: :slight_smile:

I programmed it from scratch, took about 20 hours.

This plugin for the allows your web site users to select a color theme when they visit your weather site. Look for the “Style Options” on the menu on the left. When you select a style, it saves the setting in a cookie, so if you come back another time, the same style will be shown again.

Download the plugin packaged with 16 style sets of many colors in both wide and narrow layouts.
http://www.642weather.com/weather/scripts/css-theme-switcher.zip
A readme.txt is included, look for the instructions inside, ask any questions here.

See a live demo here:
Weather Display/PHP/AJAX Website Template - Color Theme Switcher Plugin
http://www.642weather.com/weather/template/index.php

Post here your comments, praises, and help requests, thanks.

These other scripts I made also complement the Weather Display/PHP/AJAX Website Templates:

Weather Display/PHP/AJAX Website Template Set - Style Editor
http://www.642weather.com/weather/template/style-edit.php

Wind Direction Graphics Generator
http://www.642weather.com/weather/scripts-wind-graphics.php

My comment: Very Cool!

What a great idea Mike!

Let me know when you finalize it and I’ll add the link on the installation page.

Malleable websites… what a concept!

Best regards,
Ken

Looks good

Mark

Wow, another good one =D>

The smart folks on this forum have really adanced the “state of the art” in weather website design.

Hello Mike…

Pretty Amazing!!

…chris

Jeeeezzzzz, how do you guys do this?

How about black Mike?

Excellent work and so kind of you to share!

Jack

This is great! And thank you to all the hard work everyone contributes to us non-programmer types. :wink:

The Color Theme Switcher is officially launched

Download the plugin packaged with 16 style sets of many colors in both wide and narrow layouts.
http://www.642weather.com/weather/scripts/css-theme-switcher.zip

A readme.txt is included, look for the instructions inside, ask any questions here.

See a live demo here:
Weather Display/PHP/AJAX Website Template - Color Theme Switcher Plugin
http://www.642weather.com/weather/template/index.php

There are two other tools I made to complement the Weather Display/PHP/AJAX Website Templates:

Weather Display/PHP/AJAX Website Template - Style Editor
http://www.642weather.com/weather/template/style-edit.php

Wind Direction Graphics Generator
http://www.642weather.com/weather/scripts-wind-graphics.php

It’s looking pretty good on my end and very easy to install. Thanks for all your hard work!!

I just added a new Silver Theme, look at the demo and tell me what you think.
http://www.642weather.com/weather/template/index.php

Select the silver theme on the menu on the left.

New Version: 1.01 07-Mar-2008
added silver theme,
fixed menu background color for all wide css themes.
To upgrade from vers 1.00: just replace all the css files and the
include-style-switcher.php from this zip file

http://www.642weather.com/weather/scripts/css-theme-switcher.zip

Very sleek! Thanks for the new Silver theme. I’m adding it to the distribution .zips for the templates which should be ready this evening.

Best regards,
Ken

Got the color theme running in San Diego.

www.wx4mt.com

Great instructions … the setup was easy.

Nice! :D/

John

John,
Nice silver theme. :slight_smile:
You did not install the included style neutral windrose image set, did you not like them?

I have noticed something I would like to fix with the template css files and I want to ask Ken and everybody before I made the change.
I can tighten up the menu link spacing allowing more links in a tighter area.
For a sample of what I am talking about compare John’s site to my site menu spacing, see how I have more links in less vertical pixel area?

I would also like to make the #main-copy h1 text not italic, see here the big words that say “Records and Stats”: San Diego Weather at Mission Trails, CA - Trend Graphs
sorry, I just do not like italic very much.

Would you guys like me to integrate these changes into the Color Theme Switcher Plugin style sets?

Hi

Thanks for a great plugin however I have one problem all ok in IE but in Firefox my WU forecast does not line up with dashboard.

http://www.gyweather.com/Newweb/wxindex.php

Thanks

Tony

Tony, It is an issue that only happens with the wide style setting. It has to do with the css for ajaxdashboard interfering with the left sidebar menu when the sidebar is not as tall in vertical pixels. the ajaxdashbpard and the wu forecast are separate tables, but they are sharing the same style of ajaxdashboard. I do not know the fix yet am researching… stay tuned.

Yes, please tune the CSS set! I’ll include the results in the distribution .zip files.

Thanks Mike!

Best regards,
Ken

Tony, I have a simple fix for you :slight_smile:
It was caused because you removed stuff from the top of the page.
edit your wxindex.php and add a line break at the top just before the ajax dashboeard

change

to

Version: 1.02 08-Mar-2008 updated all the css files to tighten the line spacing of the navigation links
also changed the #main-copy h1 text to not be italic,
h1 is used for the big words on that say “Records and Stats” in the wxgraphs.php page
added a backup copy of windrose images into the folder ajax-images-original/
they are only needed if you want to completely uninstall this plugin and restore to original state.
To upgrade from vers 1.02: just replace all the css files from the zip file to your server

My demo template is using all the new changes
http://www.642weather.com/weather/template/index.php

Thanks Mike

All fixed

Tony

Version: 1.03 08-Mar-2008 updated readme.txt instructions for installing,
instructions are now more compatible with the default Settings.php of todays release of the
Weather Display/PHP/AJAX Website Template Set by Ken True
also added ‘How to Upgrade’ instruction section.
Ken True added a setting in Settings.php to disable the the use of Theme Switcher.
Now you can enable/disable it without having to install/uninstall it.
Ken True now includes my windrose images in his default website Template Set download, so I removed the
backup copy of windrose images folder ajax-images-original/, it is no longer needed.