Tutorial menu deslizante

Hooooy pimpolhass! vim fazer esse tuto aki a pedido da Mandy do papo teen(www) e os creditos vão a (www),sabe meu menu ali do lado?pois e o tutorial e pra fazer ele!

1. No Blogger, vá em Design> Editar HTML.
2. Tecle Ctrl F e procure por:

]]></b:skin>

3. Logo acima dessa tag, cole o código abaixo:

.deslizante {
width: 185px; */ Largura do menu */
padding: 13px;
height: 100%; */ Altura do menu */
border-right: 8px solid #cbd6df; */ Cor e estilo da borda da direita */
background: #efefef;  */ Cor do background */
color: #;
top: 0;
margin: 0;
position: fixed;
left: -200px;
height: 100%;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
overflow: hidden;
cursor: default; */ Cursor */
font-weight: normal;
z-index: 12345;
}
.deslizante:hover {
left: 0;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.deslizante a {
border: none;
background: #6881AB; */ Cor do background dos links do menu */
color: #fff;
padding: 5px; */ Cor da fonte */
display: block;
width: 100%;
text-transform: uppercase;
-webkit-transition: all .1s ease-out;
-moz-transition: all .1s ease-out;
-o-transition: all .1s ease-out;
transition: all .1s ease-out;
font-size: 7pt;
margin: 5px -10px;
text-shadow: 0 1px 1px #;
}
.deslizante a:hover {
background: #919191; */ Cor do background dos links hover */
-webkit-transition: all .1s ease-out;
-moz-transition: all .1s ease-out;
-o-transition: all .1s ease-out;
transition: all .1s ease-out;
padding-left: 20px;
}
.deslizante a:first-child {
margin-top: 10px;
}
.deslizante a:last-child {
margin-bottom: 0px;
}
.deslizante a { padding: 4px 6px; }

4. Edite o código de acordo com as partes em negrito e salve.
5. Agora vá para Elementos da página.
6. Adicione um novo gadget de HTML/Javascript e cole nele o seguinte código:

<div class="deslizante">
<a rel="nofollow"><font style=" text-transform: none; font: italic 20px georgia;"><div align="left">Nome do seu blog</div></font></a>
<p>
<a href="Link 1">Nome do link</a>
<a  href="Link 2">Nome do link</a>
<a  href="Link 3">Nome do link</a>
<a href="Link 4">Nome do link</a>
<a href="Link 5">Nome do link</a>
<br>                  
</div>

7. Edite as partes em negrito e salve.


Prontuh!! agora salve e seu menu ta la!
mais tarde posto como por imagem de link me nele!
Xoxo!