Este template é ideal para quem tem blog de vídeos ou usa muitos vídeos em suas postagens.
Ele possui inúmeros hacks e é baseado no template Simple. As postagens são resumidas na página inicial, mas percebam que é só clicar que os vídeos tocam. Sem muitas gambiarras, esse template é fácil de implementar e de usar. Ele possui "postagens populares" em forma de slide, menu de navegação dentro dos posts, menu com efeito neon, posts no footer com scroll, três colunas na parte superior...
Agora vá ao editor de texto de seu Blogger (onde você escreve)
Clique em HTML e cole o código.
O código deverá vir assim:
<iframe width="560" height="345" src="http://www.youtube.com/embed/smyyQfsPhBs" frameborder="0" allowfullscreen></iframe>
Apague a parte que está em azul. Escreva o que quiser no post e publique.
O vídeo estará pequeno, mas não se importe, ele está configurado para fazer a modificação no tamanho ao ser publicado.
Copie o código abaixo e cole no HTML/Javascript
Procure por:
<div class='menu'>
E faça as modificações como se pede, colocando nos locais indicados os endereços que queira linkar
Ele possui inúmeros hacks e é baseado no template Simple. As postagens são resumidas na página inicial, mas percebam que é só clicar que os vídeos tocam. Sem muitas gambiarras, esse template é fácil de implementar e de usar. Ele possui "postagens populares" em forma de slide, menu de navegação dentro dos posts, menu com efeito neon, posts no footer com scroll, três colunas na parte superior...
As imagens nos posts devem ficar centralizadas e acima de qualquer rescrita, ou não dará certo.
ATENÇÃO:
ATENÇÃO:
Para colocar os vídeos do You Tube, basta seguir a imagem.
Agora vá ao editor de texto de seu Blogger (onde você escreve)
Clique em HTML e cole o código.
O código deverá vir assim:
<iframe width="560" height="345" src="http://www.youtube.com/embed/smyyQfsPhBs" frameborder="0" allowfullscreen></iframe>
Apague a parte que está em azul. Escreva o que quiser no post e publique.
O vídeo estará pequeno, mas não se importe, ele está configurado para fazer a modificação no tamanho ao ser publicado.
Para habilitar o widget Postagens populares.
Copie o código abaixo e cole no HTML/Javascript
<style type="text/css" media="screen">
#PopularPosts1 {
overflow:hidden;
margin:32px -15px 0px 0;
padding:0px 0 13px 0;
height:150px;
}
#PopularPosts1 ul {
width:460px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#PopularPosts1 li {
width:450px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:150px;
overflow: hidden;
background: url(http://blogblog.com/1kt/travel/bg_black_50.png) repeat;
}
#PopularPosts1 li .item-title {
font-size:18px;
margin-bottom:0.5em;
}
#PopularPosts1 li .item-title a {
font-family: normal normal 12px Calibri;
text-decoration:none;
color:#cc0000;
font-size:20px;
height:20px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#PopularPosts1 li img {
float:left;
margin-right:5px;
background:#2D2E30;
border:0;
}
#PopularPosts1 li .item-snippet {
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:12px;
color:#fff;
padding:0px 0px;
margin:0px 0px;
}
#PopularPosts1 .item-snippet a,
#PopularPosts1 .item-snippet a:visited {
color:#3E4548;
text-decoration: none;
}
#PopularPosts1 .spyWrapper {
height: 100%;
overflow: hidden;
position: relative;
}
#PopularPosts1 {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
#PopularPosts1 img{
width: 150px; height: 140px;
margin: 10px 0 0 8px;
}
.tags span,
.tags a {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
a img {
border: 0;
}
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
$('.popular-posts ul').simpleSpy();
});
</script>
<script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></script>
#PopularPosts1 {
overflow:hidden;
margin:32px -15px 0px 0;
padding:0px 0 13px 0;
height:150px;
}
#PopularPosts1 ul {
width:460px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#PopularPosts1 li {
width:450px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:150px;
overflow: hidden;
background: url(http://blogblog.com/1kt/travel/bg_black_50.png) repeat;
}
#PopularPosts1 li .item-title {
font-size:18px;
margin-bottom:0.5em;
}
#PopularPosts1 li .item-title a {
font-family: normal normal 12px Calibri;
text-decoration:none;
color:#cc0000;
font-size:20px;
height:20px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#PopularPosts1 li img {
float:left;
margin-right:5px;
background:#2D2E30;
border:0;
}
#PopularPosts1 li .item-snippet {
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:12px;
color:#fff;
padding:0px 0px;
margin:0px 0px;
}
#PopularPosts1 .item-snippet a,
#PopularPosts1 .item-snippet a:visited {
color:#3E4548;
text-decoration: none;
}
#PopularPosts1 .spyWrapper {
height: 100%;
overflow: hidden;
position: relative;
}
#PopularPosts1 {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
#PopularPosts1 img{
width: 150px; height: 140px;
margin: 10px 0 0 8px;
}
.tags span,
.tags a {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
a img {
border: 0;
}
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
$('.popular-posts ul').simpleSpy();
});
</script>
<script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></script>
Para habilitar o menu neon
Procure por:
<div class='menu'>
E faça as modificações como se pede, colocando nos locais indicados os endereços que queira linkar
Para deixar os arquivos em forma de menu suspenso, clique sobre o widget e depois selecione