] Primaverando [: Novos Modelos para Sidebar

Olá pessoal! Desculpem a minha ausência, eu ando muito preguiçosa e sem ideias, mas vamos lá. Eu tinha pedido que vocês me dissessem o que queriam que eu postasse, e qual não foi a minha surpresa quando apenas uma pessoa pediu alguma coisa. Poxa gente. Fiquei #chateada com vocês. Vamos melhorar isso aí.

Mas, chega de drama. Trouxe dois modelos para sidebar, como a menina me pediu naquele post.

Vamos lá?

Modelo 1

Para aplicar esse modelo, você precisa instalar a fonte Short Stack no seu template. Então, procure por <head> no seu HTML e cole abaixo dessa tag o código:

<link href='http://fonts.googleapis.com/css?family=Short+Stack' rel='stylesheet' type='text/css'/>

Agora procure por /* Headings. Logo abaixo disso deve haver um código que começa com h2 { ... Apague todo esse código ( a partir de h2 até } ) e cole o código abaixo:

OBS: se não tiver essa tag h2, cole o código logo abaixo de /* Headings.

h2 {
text-align: center;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJb7YSJM8MQbdUG-z65HFpHk9ksHqP05xMA5TN8LrP5JMBLiQcVB9vJM20aDXDbRNzBfywYzRmG5G0Tq5lSxfXOmkflIJ1ol8pK22Qz0BF_67GXLIz3lmES0MOjArglmyFW6cK5vImW0Q/s1600/linepattern.png) repeat;
border-bottom: 4px double #FFC1E0;
font-family:Short Stack;
font-size: 13px;
font-weight: lighter;
line-height: 10px;
margin-top: -10px;
padding-top: 2px;
color: $(widget.title.text.color);
-webkit-transition: 0.5s ease-in;
-moz-transition: 0.5s ease-in;
-o-transition: 0.5s ease-in;
transition: 0.5s ease-in;
}
h2:hover {
color:hotpink;
}

Visualize e se estiver tudo certinho, salve (:

Modelo 2

Procure por /* Mobile no seu HTML. Abaixo disso, cole o código a seguir:

OBS: se a sua sidebar for à direita, troque todos os left do código por right.

.sidebar .widget h2{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6L_PTnpy_2qjzaTf8X_xq4e4PDWtUvt4R212ExtGaKqIZ75TtnY66PptDYNIadzKhLajDZI32fLv0HYlMMguNCTk34hLuI635mW3jf0Koi8LaoXin1rCIDZ1uWslZo8ilnKVTMcUjX6a7/s297/faixa5.png) no-repeat left;
margin-top:-5px;
margin-left:-40px;
margin-bottom:0px;
padding:15px;
width:150%;
overflow:hidden;
}

Prontinho. Gostaram? São dois modelos bem simples e bem bonitinhos, não são? Espero que usem e se usarem creditem (:

Beijos~