HTML5 Boilerplate Plugin
this plug-in allows for easy inclusion and removal of all HTML5 Boilerplate options that are pertinent to WP. More about this plug-in can be found at …
Standing on the foreheads of giants (namely Paul Irish and Divya Manian and
the good folks that have helped them create and continue the growth of HTML5 Boilerplate,
I present to you my first WordPress plug-in, HTML5 Boilerplate. As a spin-off of my
Boilerplate – Starkers WP Theme, this plug-in can be added to any theme, new, pre-existing,
already customized, whatevs!
The clumsiest part of this is dealing with the Boilerplate CSS and JS files.
To avoid any changes you make from being overwritten during upgrades,
“starter” files have been created in the /css and /js directories. I recommend
creating copies of the starter files (removing ‘-starter’ from the new filenames)
that you can safely edit. That way, if the starter files are updated later, you can
simply copy/paste from them into your files again, and all is fine.
Another route would be to add additional links in your pages, but this does increase
your HTTP Requests, which hurts performance…
Your call, let me know if you can think of a better implementation.
More about this plug-in can be found at:
http://aarontgrogg.com/html5boilerplate/
I also built a Boilerplate theme based on Elliot Jay Stocks’ Starkers Theme that can be found at:
http://aarontgrogg.com/boilerplate/
Please let me know if you have any questions/suggestions/thoughts,
Atg
http://aarontgrogg.com/
Installation
- Download the ZIP
- Unzip the ZIP
- Copy/paste the unzipped files into your WP plug-in directory (
/wp-content/plugins/) - From within WP’s Plugin Admin panel, Activate the HTML5 Boilerplate plug-in
- In the left-nav, within the Settings menu, you should now have an HTML5 Boilerplate link
- Click the link to view the HTML5 Boilerplate Admin panel
- Check and un-check options to add and remove stuff from your site!
Screenshots
Admin Screen
View Source Before HTML5 Boilerplate
View Source After HTML5 Boilerplate
FAQ
What HTML5 Boilerplate options does the plug-in let me manipulate?
- Use HTML5
DOCTYPE? - Add IE Conditional
<html>Tags? - Move XFN profile from
<head>to<link>? - Use HTML5 Character-Encoding
<meta>Tag? - Kill IE6 Image Toolbar?
- Force IE-edge / Google Chrome?
- Add Google Verification?
- Force iThings to Use Full Zoom?
- Add Favicon?
- Add iThing Favicon?
- Add IE-only CSS file?
- Add Modernizr JS?
- Add Respond JS?
- Add jQuery JS?
- Which jQuery version?
- Put jQuery in
<head>or at end of<body>? - Add jQuery Plug-ins JS?
- Add Site-specific JS?
- Add Google Analytics?
- Use HTML5 Search
<input>Type? - Add Search
placeholderText? - Add Cache Buster to CSS & JS Files?