Aurea

Posts em Destaque na Página Inicial


/**/
/*--- Slides ---- */
.section-title {background: none repeat scroll 0 0 #FFFFFF; float: left; margin: -7px 0 0;}
.heading{border-top: 1px solid #E6E6E6; color: #929292; display: block; font-family: Tahoma,Geneva,sans-serif; font-size: 14px; line-height: 14px; margin: 7px 0 10px; text-transform: uppercase;}
.sect-container{padding:23px 0 6px 12px
}
#slider-cont{padding: 0px 0px 0px 0px;}
.slide-1,.slide-2,.slide-3,.slid-thumb{width:200px;}
.slide-1,.slide-2,.slide-3,.slid-thumb{height:200px; overflow:hidden; position:relative; display: block; -webkit-transition: all 2s ease-in-out;
-moz-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; -ms-transition: all 2s ease-in-out; transition: all 2s ease-in-out;}
.slide-1:hover,.slide-2:hover,.slide-3:hover,.slid-thumb:hover{ opacity:.6;filter:alpha(opacity=60);-moz-opacity:.6;-khtml-opacity:.6}
.top-strip{ background:#111; opacity:0.7; filter:alpha(opacity = 70); color: #929292; display: block; font-family: Tahoma,Geneva,sans-serif; font-size: 11px; left: 0; line-height: 11px; padding: 5px; position: absolute; text-transform: uppercase; top: 10px;}
.slid-cont{position:absolute; bottom:0; left:0; right:0; background:#111; opacity:0.7; filter:alpha(opacity = 70); padding:10px; overflow:hidden; margin-bottom:0px;}
.slid-cont h3{color:#fff; padding:0; margin:0; font-family: Tahoma,Geneva,sans-serif;}
.slid-cont a{color:#fff; line-height:11px; font-size:14px; font-weight:bold;}
.slid-cont a:hover{text-decoration:underline;}
.slide-1{float: left; margin-left:10px;}
.slide-2,.slide-3{float:left; margin-left:10px;
/**/

Já pensou em destacar alguns posts que gostaria de ter mais acessos em seu blog?

Com este tutorial você poderá colocar um Gadget de 3 Posts em Destaque no início do seu blog com um estilo bem legal. Que, inclusive já estou utilizando aqui no TPV.
Antes »»» Não Se Esqueça:
» Essas configurações demandam algum conhecimento em códigos HTML e CSS.
Portanto:
♥ Sempre tente antes num blog de testes.
♥ Salve o seu template antes de começar, clicando em Baixar modelo completo.
♥ LEIA O TUTORIAL ATÉ O FIM E TENHA CERTEZA DE TER ENTENDIDO.

Demonstração Click aqui

Observações Importantes:

»Para que o Gadget de Posts em Destaque apareça apenas nas páginas inicial, estáticas e de marcadores temos que usar as tags condicionais.
»Aqui no tutorial o gadget estará programado para NÃO aparecer apenas nas páginas dos posts. As demais páginas inicial, estática, de marcadores e de arquivos terão os posts em destaque.
»Caso você queira que este gadget não apareça nestas páginas basta colocar as tags condicionais correspondentes que estão neste post aqui do TPV:
♥Condicionais no Blogger–Parte 01–Ocultando Elementos em Páginas Específicas♥

Como colocar o Gadget de Posts em Destaque no Blog


→ Você deve ir em Layout » Clicar em Adicionar um gadget em cima da coluna dos posts.

Já sei!
Você foi em Layout e não tinha opção de Adicionar um Gadget em cima da coluna dos posts né?
Não se preocupe.
Basta criar uma seção para incluir os gadgets em cima da coluna dos posts.
Para isso:

Vá em Modelo » Editar HTML e procure pela tag:
E inclua este código abaixo acima desta tag:

  • Love
  • Save
    Add a blog to Bloglovin’
    Enter the full blog address (e.g. https://www.fashionsquad.com)
    We're working on your request. This will take just a minute...