Embedding Videos with TinyMCE
By default TinyMCE strips out any code that you would use to embed videos or Flash into your site. To allow videos to be embedded you need to change how TinyMCE init's.
Mainly, the valid_elements, extended_valid_elements & valid_child_elements parts of the code.
Use the following code
Getting YouTube thumbnails for HTML
It's so simple to embed a YouTube video, with thumbnail into your site. Ditch any clever PHP scripts or completed jQuery libraries.
So you have a Youtube video - http://www.youtube.com/watch?v=t4_dZPVg8KI
Take the video ID t4_dZPVg8KI and craft yourself a link to YouTube's image server;
http://img.youtube.com/vi/t4_dZPVg8KI/1.jpg
You have a choice of 1.jpg or 2.jpg or 3.jpg
How easy is that!
Prevent images from displaying while loading with AnythingSlider
AnythingSlider is just another jQuery slider effect, except we can embed any content as it uses a semantic unordered list HTML (5) structure.
My recent client wanted a mixture of HTML, videos and images, which means you get the nasty flash of the UL elements whilst your browser renders the window. Apparently its called Flash Of Unstyled Content (or FOUC). Whatever. Its called really annoying to me. So here is a bit of code that should be included in the default anythingslider.css but isn't for some reason.
Using custom CSS in cForms
Pretty much every WordPress installation I've done in the last few years has got cForms installed. Its one of the must have plugins.
Many people are unaware of the custom CSS options available in cForms. Ever edited a default style and lost it during an upgrade? Annoying isn't it?
Here's how you make a custom, upgrade proof CSS skin for your cForms.
[Snippet] How (Not) To Vertically Center Content
Vertically Centering content in divs isn't as straight forward as it used to be in classic table based layouts.
http://phrogz.net/CSS/vertical-align/index.html explains all.
Controling Compatibility View in IE
After hours of frustration trying to make some CSS look right for a selection of people using IE8 I gave up.
There has to be a better solution.
Internet Explorer 8 and Internet Explorer 9 include a Compatibility View feature that displays websites that were created for older browsers as they were designed to appear with Internet Explorer 7. You can enable Compatibility View in Internet Explorer, most users don't even know they are in Compatibility View - which is where the problems arise!
Floating center in CSS
Something that really annoys me is the inability to float items centrally in CSS.
Use the CSS element margin.
- margin:0 auto;
Done!
[Snippet] Clearing forms with Javascript
When creating forms on a website it is helpful to place descriptive text with some of the form fields to help the user understand what they should type in the box. I can never remember the Javascript to do it
- <input value="Username" onclick="this.value=''" type="text">
Ajaxrain.com hits 1,000 entries mile stone
Back in August last year I posted about a new resource called Ajax Rain that lists Ajax/Javascript/Dhtml examples and demos. Well, now they've hit over 1,000 entries.
Sites like this come and go all the time, but it's nice to see a site succeed like this.
CubeCart Mod – Show sub-category products on category page
This modification is for CubeCart 3.
It will show all the products belong to the subcategories on the main category page. Confused? Check out the image, it explains all!


