Mostrando postagens com marcador Tutoriais. Mostrar todas as postagens
teste do eddy
Vamos lá:
Painel - Designer - Editar HTML
Expandir modelos de Widgets
agora de um (Ctrl + F) e procure por:
</head>
e logo acima dele ponha esse código:
agora de um (Ctrl + F) e procure por:
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Quando achar troque por esse código:
visualize!
Agora vamos personalizar os códigos:
no 1° Código podemos aumentar ou diminuir o tamanho da imagem e a quantidade de letras mostrada, para isso basta alterar essas linhas:
img_thumb_height → Indique a altura da imagem.
img_thumb_width → Indique a largura da imagem.
agora vamos por a imagem nesse link
(leia mais
basta fazer o seguinte;
troque essa linha:
<span id='showlink'><a expr:href='data:post.url'>Leia Mais ►
por essa e acrescente a sua imagem:
visualize! se tiver tudo certo salve!
Caso queira dar um efeito nesse link basta adicionar esse estilo CSS no template.
de um (Ctrl + F) e procure por:
]]></b:skin>
e logo acima dele e ponha esse código:
e edite-o !
Peça sua imagem de (leia mais) personalizada
clique aqui!
Painel - Designer - Editar HTML
Expandir modelos de Widgets
agora de um (Ctrl + F) e procure por:
</head>
e logo acima dele ponha esse código:
agora de um (Ctrl + F) e procure por:
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Quando achar troque por esse código:
visualize!
Agora vamos personalizar os códigos:
no 1° Código podemos aumentar ou diminuir o tamanho da imagem e a quantidade de letras mostrada, para isso basta alterar essas linhas:
img_thumb_height → Indique a altura da imagem.
img_thumb_width → Indique a largura da imagem.
summary_noimg → é aqui que você vai indicar a quantidade de caracteres para os resumos se o texto não contiver imagem.
summary_img → Indique o número de caracteres do resumo para o texto que contiver imagens.
agora vamos por a imagem nesse link
(leia mais
►
), basta fazer o seguinte;
troque essa linha:
<span id='showlink'><a expr:href='data:post.url'>Leia Mais ►
por essa e acrescente a sua imagem:
visualize! se tiver tudo certo salve!
Caso queira dar um efeito nesse link basta adicionar esse estilo CSS no template.
de um (Ctrl + F) e procure por:
]]></b:skin>
e logo acima dele e ponha esse código:
e edite-o !
Peça sua imagem de (leia mais) personalizada
clique aqui!
Gostou ? Comente não custa nada.
Entre no painel do blogger, vá em Design/Editar HTML aperte CTRL+F e procure pela seguinte tag:
]]></b:skin>
Após encontrar esta tag, cole o seguinte código imediatamente ACIMA:
#gb {
position:fixed;
bottom:-340px;
z-index:+1000;
right:160px;
}
* html #gb {
position:relative;
}
.gbtab {
height:48px;
width:677px;
margin-left: 45px;
cursor:pointer;
background:url('http://dl.dropbox.com/u/32586820/Xtreme%20Evollution%20v30/xat-abrir.png') no-repeat;
margin-top:0px; }
.gbcontent { float:left; border:7px solid #000; background:#fff; -webkit-border-radius: 20px; border-radius: 20px; -khtml-border-radius: 20px; padding:8px; }
Agora procure pela seguinte tag:
</body>
E cole o seguinte código imediatamente ACIMA dela:
<script type='text/javascript'> function showHideGB(){ var gb = document.getElementById("gb");var w = gb.offsetWidth; gb.opened ? moveGB(0, 425-w) : moveGB(425-w, 0); gb.opened = !gb.opened; } function moveGB(x0, xf){ var gb = document.getElementById("gb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; gb.style.bottom = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id='gb'> <div class='gbtab' onclick='showHideGB()'> </div> <div class='gbcontent'> <div style='line-height:0;background-position:center;width:735px;height:310px;'> <embed align='middle' allowscriptaccess='sameDomain' flashvars='id=171618027' height='310' name='chat' pluginspage='http://xat.com/update_flash.shtml' quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf' type='application/x-shockwave-flash' width='735' wmode='transparent'/> </div> </div> </div>Substitua a parte em vermelho pelo código do seu Xat.
Gostou ? Comente não custa nada.
1º - Com CTRL + F Procure por:
]]></b:skin>
#cboxLoadedContent {overflow: hidden !important;}#gb { position:fixed; top:150px; z-index:+1000; left:-610px; } * html #gb { position:relative; } .gbtab { height:161px; width:47px; float:right; cursor:pointer; background:url('http://dl.dropbox.com/u/15489916/HD%20Create%20%28novo%29/Open%20Box.png') no-repeat; margin-top:20px; } .gbcontent { float:left; border:2px solid #8c00c1; background:#fff; opacity:0.80; -moz-opacity: 0.80; filter: alpha(opacity=80); -webkit-border-radius: 20px; border-radius: 20px; -khtml-border-radius: 20px; padding:8px; }<br /> <br />
3º - Novamente com as teclas CTRL + F Procure por:
</body>
4º - Acima dessa tag adicione o codigo:
<script type='text/javascript'> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 47-w) : moveGB(20-w, 0); gb.opened = !gb.opened; } function moveGB(x0, xf){ var gb = document.getElementById("gb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; gb.style.left = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id='gb'><div class='gbtab' onclick='showHideGB()'/><div class='gbcontent'><div style='line-height:0;background-position:center;width:590px;height:310px;'><embed align='middle' allowscriptaccess='sameDomain' flashvars='id=166842942' height='310' name='chat' pluginspage='http://xat.com/update_flash.shtml' quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf' type='application/x-shockwave-flash' width='590' wmode='transparent'/> </div></div></div>
Gostou ? Comente não custa nada.
Vamos lá galera botões de Redes Sociais Exclusivo da Nice Design
1° - Vá em Design/Editar HTML,
2° - Adicione o Código onde quiser,
3° - Visualize e Salve.
Código:
<div align="right">
<table border="0" cellpadding="2" cellspacing="0" style="width: 260px;"><tbody>
<tr> <td width="65"><a href="SEU FEED" title="Assine nosso Feed"><img height="50" src="http://3.bp.blogspot.com/-vCgCYIMj_ag/T4QxmvxAS1I/AAAAAAAAA7E/AzVZOPc5v9U/s200/Feed-By+Filipe.png" width="50" /></a>
</td>
<td width="65"><a href="SEU TWITTER" title="Para seguir no Twitter"><img height="50" src="http://1.bp.blogspot.com/-o59Zde8eP2o/T4QxnXybKJI/AAAAAAAAA7M/UbCMAFqkahU/s200/Twitter-By+Filipe.png" width="50" /></a>
</td>
<td width="65"><a href="SEU FACEBOOK" title="Amigos do FaceBook"><img height="50" src="http://1.bp.blogspot.com/-44YIIwxj68I/T4QxlnPKzrI/AAAAAAAAA68/_E6GqOkZVW0/s200/Facebook-By+Filipe.png" width="50" /></a>
</td>
</tr>
</tbody></table>
</div>
<div align="right">
<table border="0" cellpadding="2" cellspacing="0" style="width: 260px;"><tbody>
<tr> <td width="65"><a href="SEU FEED" title="Assine nosso Feed"><img height="50" src="http://3.bp.blogspot.com/-vCgCYIMj_ag/T4QxmvxAS1I/AAAAAAAAA7E/AzVZOPc5v9U/s200/Feed-By+Filipe.png" width="50" /></a>
</td>
<td width="65"><a href="SEU TWITTER" title="Para seguir no Twitter"><img height="50" src="http://1.bp.blogspot.com/-o59Zde8eP2o/T4QxnXybKJI/AAAAAAAAA7M/UbCMAFqkahU/s200/Twitter-By+Filipe.png" width="50" /></a>
</td>
<td width="65"><a href="SEU FACEBOOK" title="Amigos do FaceBook"><img height="50" src="http://1.bp.blogspot.com/-44YIIwxj68I/T4QxlnPKzrI/AAAAAAAAA68/_E6GqOkZVW0/s200/Facebook-By+Filipe.png" width="50" /></a>
</td>
</tr>
</tbody></table>
</div>
Gostou ? Comente não custa nada.
]]></b:skin>
2º - Antes dela Coloque o código abaixo:
.status-msg-wrap, .status-msg-body, .status-msg-border, .status-msg-bg, .status-msg-hidden {
display: none;
}
Gostou ? Comente não custa nada.
1º:Entre na pagina "Editar HTML" Faça um backup do blog e nao marque a caixa para expandir o modelo.
2º:Procure por este código:
3º: Apague esse codigo e tome cuidado para não tirar ou deixar nenhum sinal no inicio ou fim do código e coloque esse no lugar:
Gostou ? Comente não custa nada.
Aqui você encontra as imagens utilizadas neste tutorial.
Para salvar a imagem clique com o botão direito do mouse e escolha “Salvar imagem como…”
Passo 1 - Crie um novo documento em seu Photoshop(Crtl+N) com 1024x700px.
Passo 2 – Insira a imagem Tv.png(Menu Arquivo>Inserir…) e a redimensione usando Transformação Livre(Ctrl+T).
Passo 3 – Insira agora a imagem cobra.jpg deixando-a acima da camada Tv. Tecle Ctrl+T ou vá ao menu Editar>Transformação Livre, diminua a opacidade da camada para 36% e a posicione como a seguir e ao final tecle Enter em seu teclado:
Passo 4 - Agora com a ferramenta Laço Poligonal(L) ou outra de sua preferência faça uma seleção como na imagem a seguir. Clique com o botão direito do mouse sobre a camada e escolha a opção “Rasterizar Camada”.
Passo 5 - Agora vá ao menu Selecionar>Inverter ou tecle Ctrl+Shift+I e em seguida tecle Backspace em seu teclado. Aumente a opacidade para 100%. Sua imagem deverá está assim:
Passo 6 – Ainda na camada cobra tecle Ctrl+L ou vá ao menu Imagem>Ajustes>Níveis
Passo 7 - Crie uma nova camada abaixo da camada cobra e chame-a de sombra. Escolha a ferramenta Pincel(B) e pinte, com uma ponta suave, de preto nos locais indicados abaixo e em seguida diminua a opacidade desta camada para 85%.
Passo 8 – Insira agora a imagem rã.png tecle Ctrl+T e redimensione esta imagem e a posicione como abaixo:
Passo 9 – Na camada rã tecle Ctrl+T e clique com o botão direito do mouse dentro da seleção e escolha a opção “Perspectiva” e proceda como na imagem abaixo:
Passo 10 - Duplique a camada rã(Ctrl+J). Agora você tem a camada rã e a camada rã cópia. Com a tecla Ctrl pressionada, clica na miniatura da camada rã. Tecle D em seu teclado para resetar as cores de plano de fundo e tecle Alt+Backspace pra preencher a seleção de preto em seguida tecle Ctrl+D para desfazer a seleção. Agora vá ao menu Filtro>Desfoque>Desfoque Gaussiano e coloque 1,6 px para o valor raio. Ao final, diminua a opacidade para 75%.
Passo 10 – Agora na camada rã cópia tecle Ctrl+N e configure os níveis para esta camada assim:
Sua imagem deverá estar assim:
Passo 11 - Crie uma nova camada(Ctrl+Shift+N) acima das demais e chame-a de Luz. Coma ferramenta de seleção de sua preferência faça uma seleção como na imagem abaixo:
Passo 11 – Verifique se as cores de plano de fundo estão em preto e braco e, na camada Luz, tecle Ctrl+Backspace para preencher de branco a seleção. Agora vá ao menu Filtro>Desfoque>Desfoque Gaussiano e coloque 4,6 px para o valor raio. Tecle Ctrl+D para desfazer a seleção e diminua a opacidade para 26%. Veja:
Passo 11 – Agora com a ferramenta Borracha(E) apague alguns pontos da camada Luz: as costas e cabeça da rã e a cabeça da cobra. Veja na imagem:
Pronto tudo acabado! Eu ainda usei as ferramentas Superexposição e Subexposição(O) para acrescentar luz e sombra em algumas áreas da imagem. Usei também a ferramenta Desfoque(fica bem acima das ferramentas anteriormente citadas) para desfocar algumas áreas da cobra. Por fim, criei uma camada de ajuste “Equilibrio de Cores” acima das demais camadas.
Veja o resultado final:
Gostou ? Comente não custa nada.
