quinta-feira, 11 de fevereiro de 2016

Modificar H2 sidebar e Footer Blogger

modificar-h2-sidebar-blogger

Hoje vamos mostrar como fazer uma sidebar com mais estilo bem como footer blogger como pode ver na imagem mostrada acima onde esta circulada em vermelho isso da um layout mais profissional ao mesmo tempo que seu Blogger fica em perfeita harmonia para adicionar isso a seu Blogger siga os seguintes Passos abaixo


Adicionando CSS. 

Faça login no blogger 
em menu modelo clique em editar/HTML então com as teclas combinadas 
CTRL+F  busque por ]]></b:skin> então cole os seguintes códigos acima disso.


Para sidebar 
#sidebar-wrapper h2 {overflow: hidden;position: relative;font-family: 'Oswald';font-size: 15px;font-weight: 500;color: #666;padding: 10px 0;text-transform: uppercase;display: block;letter-spacing: 1px;}
#sidebar-wrapper h2:after {content: '';display: inline-block;position: absolute;height: 14px;top: 0;margin: 13px 0 12px 10px;width: 100%;background: url(http://4.bp.blogspot.com/-R2WTW6O9E1o/VX7dqIGT1eI/AAAAAAAACc4/pyvQDMMLX3E/s1600/repeat-bg.png)repeat;}


Para footer

#footer-wrapper h2 {overflow: hidden;position: relative;font-family: 'Oswald';font-size: 15px;font-weight: 500;color: #fff;padding: 10px 0;text-transform: uppercase;display: block;letter-spacing: 1px;}
#footer-wrapper h2:after {content: '';display: inline-block;position: absolute;height: 14px;top: 0;margin: 13px 0 12px 10px;width: 100%;background: url(http://4.bp.blogspot.com/-R2WTW6O9E1o/VX7dqIGT1eI/AAAAAAAACc4/pyvQDMMLX3E/s1600/repeat-bg.png)repeat;}
#footer-wrapper ul,#footer-wrapper ol {list-style-type:none;margin:0 0 0 0;padding:0 0 0 0;}

Salve e veja o resultado.



NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post

Nenhum comentário:

Postar um comentário

NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post
 

Delivered by FeedBurner