Criar notas no final da postagem
Para criar links dentro de uma postagem, como notas no rodapé do artigo é preciso criar uma âncora para determinado trecho, como neste exemplo:
Veja que ao clicar no número 1 você será direcionado automaticamente para o final da postagem onde encontrará a explicação sobre o que é HTML.
Para isso, primeiramente, no modo Editar HTML da sua postagem, coloque desta maneira:
HTML<a href='#HTML'><sup> 1 </ sup></ a>
O código <sup></sup> deixa o número 1 sobrescrito e o <a href='#HTML'></a> é a âncora usada, no caso, a sigla HTML.
Depois, na explicação do rodapé, coloque:
<a name='HTML'> HTML </a>: aqui a explicação.
Este sistema é bastante útil também quando se deseja dividir uma mesma postagem em categorias, desta maneira:
Fontes
Background
No começo do post você cria uma lista e o leitor, ao clicar em um dos links é automaticamente direcionado para o texto correspondente.
Resumindo:
<a href='#âncora'>âncora</a>
<a name='âncora'>âncora</a>: aqui o texto explicativo.
O código HTML 1 organiza os elementos em uma página....
Veja que ao clicar no número 1 você será direcionado automaticamente para o final da postagem onde encontrará a explicação sobre o que é HTML.
Para isso, primeiramente, no modo Editar HTML da sua postagem, coloque desta maneira:
HTML<a href='#HTML'><sup> 1 </ sup></ a>
O código <sup></sup> deixa o número 1 sobrescrito e o <a href='#HTML'></a> é a âncora usada, no caso, a sigla HTML.
Depois, na explicação do rodapé, coloque:
<a name='HTML'> HTML </a>: aqui a explicação.
Este sistema é bastante útil também quando se deseja dividir uma mesma postagem em categorias, desta maneira:
Fontes
Background
No começo do post você cria uma lista e o leitor, ao clicar em um dos links é automaticamente direcionado para o texto correspondente.
Resumindo:
<a href='#âncora'>âncora</a>
<a name='âncora'>âncora</a>: aqui o texto explicativo.
Fontes: as propriedades básicas para fontes são as listadas abaixo:
- color:...................cor da fonte
- font-family:..........tipo de fonte
- font-size:.............tamanho de fonte
- font-style:............estilo de fonte
- font-variant:.........fontes maiúsculas de menor altura
- font-weight:.........quanto mais escura a fonte é (negrito)
- font:....................maneira abreviada para todas as propriedades
Background: as propriedades background são as listadas abaixo:
- background-color............... cor do fundo;
- background-image............. imagem de fundo;
- background-repeat............. maneira como a imagem de fundo é posicionada;
- background-attachment.......se a imagem de fundo "rola" ou não com a tela;
- background-position............como e onde a imagem de fundo é posicionada;
- background........................maneira abreviada para todas as propriedades;
Importante! Edite todo o texto no modo Editar HTML, pois se você passar para o modo Escrever, a âncora acaba sendo substituída por um link para a própria edição da postagem e nada funciona.
Obs: os textos explicativos sobre Fontes e Background foram retirados do site do Maujor
Visto no Tips for Blogger
HTML:Hypertext Markup Language.
5 comentários:
Ariane
Estava louco atrás desse código. Brigadu!!!
cidão, um comentário como este é que me motiva para caçar dicas e truques. Abraços!
Ariane, tentei usar os códigos na postagem de hoje e não funcionoui. Fiz tudo no Editar HTML, na visualização os links apontavam certinhos mas na hora de salvar e publicar, o blogger convertia tudo e apóntava os links para a criação de postagem. Repeti o processo e mas a coisa continuava o mesmo.
Li em algum lugar que como o Blogger está passando por transformações em seus códigos, e certos hacks poderiam não funcionar direito.
como eu posso botar minhas postagens em ordem eu mesmo escolher para ficar no topo no meio essas coisas?
obrigado..
Muito bom!Estou començando meu blog e isso vai ser de muita ajuda... até peguei um template aki seu..Muito obrigado!
Postar um comentário
Os comentários são moderados.