segunda-feira, 13 de dezembro de 2010

Códigos para complementar suas postagens

Alguns sistemas bem legais do blogger muitas vezes não são adptados por alguns templates. Como templates que não mostram reações. ou templates que não há enviar para um amigo.

Alguns dos códigos abaixo mostram como implantar num template que não há disponibilidade para adicionar categorias, Hora da criação da postagem ou até mesmo o autor.

Veja alguns abaixo

1) Hora da postagem

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span>

2) Dia da postagem

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

3) Número de comentários

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

4) Marcadores usados na postagem

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>
</span>

5) Autor da postagem

<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

6) Icone recomendar postagem para um amigo

<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>

7) Icone editar postagem

<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>

8) Texto explicativo antes do fomulário de comentários

<p style='margin-left: 56px;'><data:blogCommentMessage/></p>

9) Votos de qualificação da postagem

<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'><tr>
<td class='reactions-label-cell' nowrap='nowrap' valign='top' width='1%'>
<span class='reactions-label'>
<data:top.reactionsLabel/></span>&#160;</td>
<td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
</tr></table>
</b:if>
</span>

10) Backlinks

<!-- backlinks -->
<span class='post-backlinks post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.showBacklinks'>
<a class='comment-link' expr:href='data:post.url + &quot;#links&quot;'><data:top.backlinkLabel/></a>
</b:if>
</b:if>
</span>

Para inserir algum código acima, faça login no Blogger, entre em “Design” -> “Editar HTML”. Marque a caixa “Expandir modelos de widgets”.

Você deve usar qualquer código acima entre:


<b:includable id='post' var='post'>

e


</b:includable>





Marcadores: , , ,

Jotform - Criação de Formulários gratuitamente

O Jotform é um criador de formulários muito popular pela sua dinámica e, facilidade a praticidade na criação de formulários completos para blogs e sites.
Ele conta com ferramentas ultra avançadas e todas elas sem anuncios e até mesmo sem nenhum Link que recomenda-o

Como usar o JotForm

Este é um modelo bem fácil de configurar e criar qualquer tipo de formulário como for mais conveniente e adequado para o seu blog, além de ser gratuito e estar em português.



JotForm - http://www.jotform.com/

Ao entrar já fica evidente a facilidade, pois não é preciso fazer cadastro para começar a usar e ele todo já é a plataforma de criação do formulário.

Na barra lateral esquerda estão os componentes e tudo o que você pode colocar no formulário, basta achar o que deseja e arrastar para a área de “Estilo do Formulário”.

Há duas barras de ferramentas no topo, uma para cada aba, que determina a maneira como você irá configurar seu formulário. Se deixar marcada a aba “Estilo do Formulário” verá como escolher temas, fontes, cores e até plano de fundo.



Depois de configurar e criar o formulário como deseja que seja e estiver pronto para publicar em seu blog, então clique na outra aba, “Configurar e compartilhar” para escolher para onde as mensagens serão enviadas e como incorporar em seu blog o código do novo formulário criado.



Clicando no botão “Compartilhar Formulário” você escolhe para qual email os contatos serão enviados. Assim, quando alguém preencher e enviar, você receberá em sua caixa de email o que foi escrito.

O outro passo importante é incorporar isso em seu blog. Para tal existe o botão “Código Fonte”. Na janela que abrir haverá um trecho de código para ser copiado e colado numa página estática.



Feito isso é só testar e ver como ficou em seu blog.

Marcadores: , ,

Como criar uma página de Mapa de Site

Olá pessoal, hoje eu estou aqui para ensinar como criar um página de Mapa de Site para seu Blog
Vamos iniciar o Tutorial:

1º - Acesse o Painel de seu blog e clique na ferramenta nova postagem do blog que você deseja inserir o código.



2º - Já no Painel postagem clique na sub-aba Editar Páginas.

3º - Agora basta clicar em nova página.

4º - Na criação da página clique na aba Editar HTML do editor de páginas do blogger e na caixa de texto adicione:
<script style="text/javascript" src="http://api.ning.com/files/WlQwHE3mCi99z2MFu2FXcodtubTh5Eits318el1-17dmx-y2C2HZFixIruXUPkEe2o8B7daBnShphXGdbvVM0seYq9j6zlKX/blogtocmin1.js"></script> <script src="http://url-no-seu-blog.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

5º - No próprio editor mude o "http://url-no-seu-blog.blogspot.com/" para o endereço de blog

6º - Ficando assim:



7º - Agora clique em Publicar página e Pronto.

Agora visualize a página e veja se está tudo Ok.

Créditos: Blogando com facilidade | http://blogandocomfacilidade.com/2010/12/como-criar-uma-pagina-de-mapa-de-site.html

OBS: Este post não é um plágio apenas "eu", Iago melanias estou disponibilizando meu conteúdo à vocês leitores.

VIDEOAULA:


Marcadores: , , , ,

Como Adiconar o Efeito Reflexo de Imagens

Olá leitores, sou o mais novo postador do códigos blogger e estou aqui disponibilizando meu primeiro tutorial para ampliar o conhecimento dos blogadores.

O meu primeiro tutorial se resume em clarear e escurecer as imagens quando posicionamos o Muse sob elas

Vamos iniciar o Tutorial:

1º - Acesse o Painel de seu blog e clique na ferramenta design do blog que você deseja inserir o Efeito Refelexo



2º - Já no Painel de Design clique na sub-aba Editar HTML.

3º - Procure agora por ]]></b:skin> (ATALHO: CTRL + F)

4º - Agora adicione acima o código abaixo

/*-- (Efeito Reflexo)-- */
a:hover img { opacity:0.80; }

5º - Ficando assim:



6º - Agora clique em SALVAR MODELO e Pronto.

Agora visualize seu Template e veja se está tudo Ok.

Créditos: Blogando com facilidade | http://blogandocomfacilidade.com/2010/12/como-adicionar-o-reflexo-em-imagens-no.html

OBS: Este post não é um plágio apenas "eu", Iago melanias estou disponibilizando meu conteúdo à vocês leitores.

VIDEOAULA:

Marcadores: ,