Tutorial: Efecto imagen blanco y negro

Tema - Personalizar (Editar HTML) - CTRL+F y buscas: ]]></b:skin>

Arriba de ]]></b:skin> pegas lo siguiente:

De blanco y negro a normal:

.post img{-webkit-filter: grayscale(1);-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%);filter: url(desaturate.svg#greyscale);filter: gray; filter: grayscale(100%);-webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear;transition: all 0.4s linear;} .post img:hover{-webkit-filter: grayscale(0);-webkit-filter: grayscale(0); -moz-filter: grayscale(0);filter: none; filter: grayscale(0);}

De normal a blanco y negro:

img{-webkit-transition: all 0.8s linear;-moz-transition: all 0.8s linear;transition: all 0.8s linear}
img:hover{-webkit-filter: grayscale(100%);z-index: -99px;}

vista previa: