Tutorial Como Colocar Menu com Imagens

Ae esto aqui realizando o pedido do Cesar Major ae que me pediu vo ta postando ae primeiro vai em Design do blog dps vai em editar html expandi modelo e procure pela seguinte tag ]]></b:skin>

e cole o codigo a baixo, debaixo da tag

Obs: os links em rosa sao as imagens do menu pessoal a barrinha onde fica as palavras inicio parceria n estao no codigo voce tem que desenha no header e dps ajeitar no codigo

/*-----Menu Imagens By:DjCopax/

#menuimagem{

width:100px;

height:100px;

display:block;

position:absolute;

margin:-68px 0 0 115px;

}

#home {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpQtAAmB-zaH547NmXo1P5MH90t0Yzsy_wfxV7iifuqjKK4-Ge4mzaKnzvooTznHlTIoFOr4guPb73T6_kVH__eFTx9kRtj2a2avA2cyBOSWYcUMo6cJB2BAEFk2zq5UA0hU1ItCENUjqB/s1600/inicio.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#home:hover {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGELt0HnI9lwuORuh0GUeZ7O6G-IbRv4uy4WhVIYn96of1h__GaPaYycsg-C6gItDhGY1HG8kNjpieJlsPnYplmncCPV1K6VLllCQxczdl33kkkZ9iq5NB0KfhGNRUWBzi4QP1EUii9xzH/s1600/inicio2.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#HOME{

width:208px;

height:57px;

display:block;

position:absolute;

margin:-22px 0 0 100px;

}

#contato2 {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRkzL4mJd5YVjhjjF075KVNTwMI44WNAjV8HQkrtAagowthNoK55X4AfdXDRijv6Id067ZKJ8jIKmgocSSLepT2yaEfCSt5MzgtTR6x7JNsf4VVHUrECGHdefkA6FLCtxfuYiHJT7jw5Pn/s1600/parceria.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#contato2:hover {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijv28m3NvytrrOGMBl73cG43xKsaCegAO7b5fb6GvU-RV3RiLEfJwhlcNnLrti4XXZDcW1yAKqbB7-yPMf1NaSxf48NvUSAKcFGtkGIpN8lwiURD42TR1i8dhVq7aihISCBe_amN6oYZce/s1600/parceria2.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#CONTATO2{

width:208px;

height:57px;

display:block;

position:absolute;

margin:-22px 0 0 295px;

}

#parceria {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU115Cp96kCpeRC85K5QAxR5rtbzq1KlO7A2zOjpzllPvjUjwqsNM_GIoZWm6G6yBki9Ju2asidZFsg9UXDKZY2Z2e1R9XcuFD8MXH2GSBgfbQXBneHFXM2_s58cvbfdgKfn8GJ8xsKZnP/s1600/pedidos.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#parceria:hover {

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif5yO91Ukm8Srb1V8kmm5vFOwQ898J1qk_IHnJonZg2uixZizuIBCr3XKBUk-VXCGXh-rb5uM4TOc8T0uNhJb3_CIwya_5m8jXmclS4t7KuDQSl0N3HhusTmo-Jb_xyhODHBJPj3DZUGzZ/s1600/pedidos2.png) no-repeat;

width:173px;

height:70px;

float:left;

}

#PARCERIA{

width:208px;

height:57px;

display:block;

position:absolute;

margin:-22px 0 0 500px;

}

Coleque o codigo abaixo , debaixo do header = <div id='header-wrapper'> n cole deibaixo cole onde acaba o <div>

<div id='menuimagem'>

<div id='HOME'>

<a href='/' id='home' title='Volte Para a Pagina Inicial'/>

</div>

<div id='CONTATO2'>

<a href='Seu link aqui' id='contato2' title='Seja Nosso Parceiro !'/>

</div>

<div id='PARCERIA'>

<a href='Seu link aqui' id='parceria' title='Faça seu Pedido'/>

</div>

</div>