T2B Control is a wordpress plugin that helps you use a different theme depending on the browser you are using. This is great for things like having a dedicated theme for mobile devices (for now just iPhone/iPod), but also is a great way to cheat your way out of CSS hacks and browser specific annoyances ( IE anybody? ). Even though themes are usually designed to be cross browser and CSS fine tuning is part of it, sometimes you do not have the time to spend trying to figure out a way to make the  pages behave across browsers.

For now the supported software is: Internet Explorer, FireFox, Opera, iPhone/iPod, Safari. All of them modern versions, however, version specific detection will come in future upgrades of the plugin.

How to install

Easy: after downloading the plugin just save it to the plugins folder of your wordpress install. Go to the admin page and then Plugins. Locate Theme to Browser (T2B) Control and click on activate.

Setup

Once the plugin is activated just go to the “Appearance” tab and find T2B Control. There you should be able to figure out what theme to use in which browser.

Download

Just go to the wordpress plugin repo and get it! Here’s the link http://wordpress.org/extend/plugins/theme-to-browser-t2b-control/

This is a very neat plugin that does an all too common featured content on WordPress, but it has a HUGE problem which is the lack of a timer for changing the slides. If you go through the code it’s not even ready for a timer to work … which sucks, but that’s ok. Here’s how you do it.

Find the plugin at the wordpress plugin site or go here http://www.iwebix.de/featured-content-slider-wordpress-plugin/

then find the jQuery timers plugin (for jQuery) at http://plugins.jquery.com/project/timers and save it in the scripts folder of the wp content slider plugin folder.

If you have wordpress setup to load jQuery you might have a problem with the plugin as it does it’s own jQuery loading. We need to modify featured-content-slider.php from the plugin folder to read:

$sliderscript = "<link rel=\"stylesheet\" href=\"".$slider_path."css/slide.css\" type=\"text/css\" media=\"screen\" charset=\"utf-8\"/>

<script type=\"text/javascript\" src=\"".$slider_path."scripts/slider.js\"></script>

<script type=\"text/javascript\" src=\"".$slider_path."scripts/jquery-1.2.6.min.js\"></script>

<script type=\"text/javascript\" src=\"".$slider_path."scripts/jquery-timer.js\"></script>

 \n";

Then open slider.js from the scripts folder and modify to read (almost at the end of the file):

			if (config.contenttype[0]=="ajax" && typeof config.contenttype[1]!="undefined") //fetch ajax content?
				stepcarousel.getremotepanels($, config)
			else
				stepcarousel.alignpanels($, config) //align panels and initialize gallery

			jQuery(document).everyTime('3s', function(i) { stepcarousel.stepBy(config.galleryid, config.defaultbuttons.moveby)} )

		}) //end document.ready

That’s it. Change 3s to whatever timing you want.

Easy enough huh? now we need to add a hover stop on the timer … which i haven’t done yet … but this should do for now.