sábado, 12 de novembro de 2011

Efeitos no texto das postagens: negrito, itálico, sublinhado entre outros (blogspot)



4 Comentário(s)

Não sei se vocês perceberam mais o blog está de visual novo haha *-* (impossível não perceber só novos leitores kkk). Quando eu estava configurando o blog, procurei alguns tutoriais, dentre os que eu achei, encontrei um bem legal no Material Extra que dá efeitos no links do blog. 

Confira:

underline  /* sublinhado /*
italic  /* italico /*
bold  /* negrito /*
line-through /* tachado /*
overline /* sobrelinha /*
underline overline /* sobrelinha e sublinhado /*


você pode usar esse efeitos em:

h3.post-title {  (apenas o link normal)
margin-top: 03px;
text-decoration: none;
}

h3.post-title a {  (apenas o link normal)
font: $(post.title.font);  
color: $(post.title.text.color);
text-decoration: none;
}

h3.post-title a:hover {  (só mostrará o efeito ao passar o mouse por cima do link)
text-decoration: none;
}

ou

a:link {  (efeito do link em estado normal)
text-decoration:none;   
color: $(link.color);
}

a:visited {  (efeito do link depois de clicado)
text-decoration:none;  
color: $(link.visited.color);
}

a:hover { (efeito quando o mouse passa sobre ele)
background-color: #E0EEEE ;
text-decoration:underline;  
color: $(link.hover.color);
}

ou em qualquer outro código que seja aceito é claro.

coloque o nome do efeito onde está marcado de vermelho.

Beijinhos e obrigada pelo segundo código Candy Reis.

quarta-feira, 9 de novembro de 2011

Como colocar o link-me das parcerias no blog?



7 Comentário(s)

Tumblr_lu6u43mm1w1qcjclio1_500_large

Para quem não entendeu vou explicar... Sabe aquela página de parcerias? Pois é, sei que há pessoas que tem dúvidas de como colocar aqueles banner's no blog. Então vou fazer esse tutorial explicando direitinho passo a passo.

Vá na caixinha do link-me e copie o que tem dentro;
Vá na página desejada ou das parcerias clique em html e cole o que você copiou, depois clique em escrever e faça com os demais banner's.

Olá! Aqui já foi um post bem atrativo, porem, infelizmente com a perda das imagens hospedadas no Tinypic.com, não tenho mais os prints em tempo real.

(Post atualizado em 05/07/2021) 

Beijinhos.

terça-feira, 8 de novembro de 2011

Com colocar link em uma imagem para a postagem do blog?



4 Comentário(s)

Poderia ser mais especifica no titulo, mas creio que muitos blogueiros(as) procuram mais ou menos assim. Lembro da minha pessoa bem no comecinho do blog não achava os tutoriais porque não ia direto ao ponto Rsrs :) 

Sabe aquelas postagens em que você quer recomendar algum blog ou falar de algo que precise de imagens de sites ou print e que eles possuem links. Pois bem. ensinnarei a voc~e como colocar links em imagem. Gente é muito fácil! quer vê só?

Adicione o código a seguir em algum gadget de Html/java Script ou de texto.

<a href="link de algum blog ou site aqui"><img alt="título do que a imagem se refere" src="url da imagem" / /></a>

Azul: coloque o link do blog a ser redirecionado, ou seja, a ser visitado
Roxo: coloque algum nome do que se refere ao blog
Vermelho: url da imagem (endereço/código). Recomendo que acesse o site Tinypic e faça upload da imagem a ser utilizada.

Ou se preferir, caso tenha carregado a imagem já em seu blog, apenas selecione e clique em Link.
Beijos.

sábado, 5 de novembro de 2011

Dica para que o seu blogger carregue mais rápido!



6 Comentário(s)

Há pessoas que deixam de ler o seu blog por vários motivos, dentre um deles é quando vai carregar e demora muito :/ isso faz com que saiam antes de vê o que o seu blog tem para mostrar. Estava lendo um post do suporte da Google (muito obrigada) que fala sobre isso.Vou postar aqui as dicas que irá atrair mais leitores ao seu blog. Leia com bastante atenção!


1 O tempo de carregamento do seu blog pode estar sendo afetado pelo número de postagens que aparecem na sua página principal. Você pode editar facilmente o número de postagens exibidas na página principal na guia Configurações > Formatação. Dessa forma, será possível selecionar o número de postagens que serão mostradas na página principal. 


2 Para obter a melhor velocidade de carregamento do blog, recomendamos o uso de widgets, JavaScript e links do Google/Blogger. No entanto, se for necessário usar JavaScript e links de terceiros, o seu blog carregará mais rápido se eles forem colocados na parte inferior do seu blog. Se houver JavaScript e links de terceiros na sua barra lateral, coloque-os na parte inferior dela. (opcional)


3 Quanto mais imagens, vídeos e outras mídias estiverem no seu blog, mais tempo levará para carregar. No entanto, para atrair usuários ao seu blog, é importante otimizar a velocidade de carregamento de imagens e outras mídias. Veja a seguir algumas dicas para aumentar a velocidade de carregamento das suas mídias.
  • Diminua o tamanho das suas imagens ou use miniaturas vinculadas às imagens em tamanho grande.
  • Se você usar imagens de terceiros, tente fazer upload delas nos Álbuns da web do Picasa através do editor de postagens do Blogger ou pegando as Urls carregando as imagens no Tinypic
  • Se você tem muitas imagens para mostrar (de uma viagem ou outro evento), faça upload de todas elas em um Álbum da web do Picasa e crie um link para o álbum na postagem ou na barra lateral.
4 Se você adicionou algum CSS personalizado ao seu blog, coloque-o na parte superior da página.

5 O conteúdo mais importante do seu blog (aquele que chama a atenção dos leitores) deve ser o mais rápido para carregar. Para ajudar você a identificar quais itens levam mais tempo para carregar, use o Stopwatch (em inglês). Para usar o Stopwatch, digite o URL do seu blog na caixa de texto e clique em "Start StopWatch". Em seguida, o Stopwatch abrirá o seu blog em um quadro e gravará o tempo que leva até ele carregar por completo, incluindo imagens, vídeos, widgets etc. Observe os itens que levam mais tempo para carregar e modifique-os adequadamente usando nossas sugestões.

Beijinhos.

quinta-feira, 3 de novembro de 2011

Como adicionar páginas no blogger?



6 Comentário(s)

32b83fd11b6c_large


Na sua página de Html aperte as teclas Ctrl+F ou F3 e pesquiser por:
]]></b:skin>


acima dele coloque esse código:

.paginator {
 margin-top:60px;
 font-size:1em;
}
.paginator table {
 border-collapse:collapse;
 table-layout:fixed;
 width:100%;
}
.paginator table td {
 padding:0;
 white-space:nowrap;
 text-align:center;
}
.paginator span {
 display:block;
 padding:3px 0;
 color:#fff;
}
.paginator span strong,
.paginator span a {
 padding:2px 6px;
}
.paginator span strong {
 background:#ff6c24; /* Cor do fundo não selecionado
 font-style:normal;
 font-weight:normal;
}
.paginator .scroll_bar {
 width:100%; height:20px;
 position:relative;
 margin-top:10px;
}
.paginator .scroll_trough {
 width:100%; height:3px;
 background:#ccc;
 overflow:hidden;
}
.paginator .scroll_thumb {
 position:absolute;
 z-index:2;
 width:0; height:3px;
 top:0; left:0;
 font-size:1px;
 background:#363636;
}
.paginator .scroll_knob {
 position:absolute;
 top:-5px; left:50%;
 margin-left:-10px;
 width:20px; height:20px;
 overflow:hidden;
 background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3oLNsaXNl-BWWKyyaRE8bDITcqfp2FhoCUZ9hMMQpqUl9fQ4lOEUw9i3JeDTmaPkutzula_S2QFeG9YVhYpOjx5-07arD2f7LFrj-eGlVofTk04wT1qqTUCnLX5JTwXX3ioEdt5073PA/s1600/slider_knob.gif) no-repeat 50% 50%;
 cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
 position:absolute;
 z-index:1;
 top:0; left:0;
 width:0; height:3px;
 overflow:hidden;
 background:#ff6c24;
}

.fullsize .scroll_thumb {
 display:none;
}

.paginator_pages {
 width:600px;
 text-align:right;
 font-size:0.8em;
 color:#808080;
 margin-top:-10px;
}


novamente pressione as teclas Ctrl+F ou F3 e pesquiser :

</body>

e em cima dele coloque o código abaixo :

<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7; /* Número de páginas
var numshowpage=6;
</script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000-forblogger-v1.0.0.js' type='text/javascript'/>


Infelizmente os números são grandes ainda não descobri como diminuir :/ caso descubra falo para você :)

Confira também:

Como adicionar páginas no blog 1
Como colocar páginas numeradas no blog 2
Como colocar numeração nas páginas do blog 3

Beijinhos .

quarta-feira, 2 de novembro de 2011

Como colocar o gadget dos marcadores do blogger em meu blog?



2 Comentário(s)

Fiz essa postagem porque é uma das pequenas dúvida que certos blogueiros tem. O marcador que irei ensinar aqui neste tutorial é do próprio blogger. Recomendo bastante e é ótimo! 


Você terá 2 opções: 

Cloud e Lista 

Dica: se "Lista" for sua opção, recomendo que você não coloque muitos marcadores. Apenas os necessários.

Beijinhos.
Subir