►alojablogger

 Como inserir uma quebra de linha? 
[como postar a opção '' Leia mais'' ]   
ou  
'' Continue lendo''... 
(quebra de linha no blogger)

Esse tutorial ,  
mostra  somente
como postar a opção '' Leia mais''  
ou
'' Continue lendo''. 


Isso não é automatizado, 
e recomendo-se , 
desde que 
você 
escolha 
o texto a ser exibido.






 
Embora muitos não saibam,

a quebra de linha no Blogger 

atende a essa opção, 

...escolha 
um texto a ser exibido, 
e nesse você adicionará 
"a quebra de página".



Na barra de ferramentas do Blogger, 

encontramos muitas opções, 

incluindo a quebra de linha é:

______________________________vide imagem a seguir:


Necessário:

Simplesmente clicar
sobre o botão, aonde está , nessa imagem, contornada em cor vermelha,
e ,
um limitador representada como uma barra aparecerá,




E, isso vai limitar o post para essa área, 
sendo  na primeira página do seu blog irá mostrar apenas o texto desejado do que a entrada. 

Falha?
... não aparecem como'' Ler '', 
mas como '' Mais informações'' ...


Então, poderá você,  personalizar o "link", 

"leia Mais"...

conforme descrição a seguir:
  

Personalize'' Leia mais'' no Blogger

No tutorial acima, foi mostrado como
ativar 
"Continue Lendo" ou "Leia mais" no Blogger. 

Agora, veremos como dar estilo esse "link" = "Leia mais" ou "Continue Lendo"?

Por padrão, ele será algo como:

Personalizando um pouco: 

Passo 1: 

Alterar a mensagem: 
Você pode usar um '' Ler mais '','' Ler '', ou o que você quer mudar esta mensagem, você deve ir para'' / Design Elements Página '' procurar'' e do Blog '' clicar em'' Editar '':





Na configuração top, uma seção em que você deve mudar a mensagem:




Salve as alterações e pronto!



Passo 2:   aplicar estilos para o "link":

Agora que temos a mensagem que queremos, vamos aplicar estilos para que ele se pareça com um botão:


Primeiro vamos'' Projeto / HTML Edição '' 
e  encontrar o seguinte código:]]> </ B: skin>
Antes deste código, cole o seguinte:

.jump-link {
float:right;
background: #04B4AE; /* Color de fondo del botón */
border: 1px solid #000;
font-weight: bold;
padding: 1px 2px;
margin-left:20px;
}
.jump-link a {
color: #FFF; /* Color del texto */
text-decoration: none;
font-weight: bold;
}
.jump-link:hover {
background: #045FB4; /* Color de fondo al pasar el cursor */
border: 1px solid #000;
text-decoration:none;
}

Alterar os códigos de cores para o desejado e salvar o modelo.


Se você não sabe como conseguir as cores em hexadecimal, 
você pode usar a  tabela dinâmica (Esta tabela permite cores dinâmicas para criar uma cor personalizada, então, comprar o código hexadecimal.)
ou se você quiser, 
pode usar a tabela de cores estática (Biblioteca com centenas de cores em formato hexadecimal
Estes códigos são muito úteis para webmasters ou usuários que querem modificar as cores das páginas, comentários, etc.) 

...tabela de cores estática:



Alteração: Mudança'' Leia mais'' por uma imagem:

Se o que você quer é usar uma imagem em vez de este botão, você deve fazer o seguinte: Primeiro vá a '' Projeto / HTML Edição '' . Procurar o seguinte código:

<data:post.jumpText/>

Você substituí-lo por:<Img src = " URL da imagem "/>

Onde você substituir a URL da imagem no endereço da imagem a ser usada, salve as alterações e pronto!