Tipografia e Códigos

A maioria desses recursos só podem ser usados no modo Visualização em HTML, nem você pode alternar para o modo Visualização 'Escrever" ao usar alguns desses recursos.

  • Na visualização do editor de postagem, clique no ícone no canto inferior direito do título
  • Duas opções aparecerão: exibição HTML e exibição de escrita
  • Selecione <> Visualização HTML
vtrick-criativo-blogger-template

Dica: Use <p>Seu_Paragráfo_Aqui</p> a tag para adicionar parágrafos ao artigo.

Tipografia

Tipografia & Códigos Personalizados

Por que usamos Lorem Ipsum?

É um fato há muito estabelecido que um leitor será distraído pelo texto legível conteúdo de uma página ao observar seu layout.

O ponto de usar Lorem Ipsum é que tem uma distribuição de letras mais ou menos normal, em oposição a usando 'Conteúdo aqui, conteúdo aqui', fazendo com que pareça um inglês legível.

Muitos pacotes de editoração eletrônica e editores de páginas da web agora usam Lorem Ipsum como seu texto de modelo padrão e uma pesquisa por 'lorem ipsum' revelará muitos sites ainda na infância. Várias versões evoluíram ao longo dos anos, às vezes por acidente, às vezes de propósito (humor injetado e coisas do gênero).

De onde vem Lorem Ipsum?

Ao contrário da crença popular, Lorem Ipsum não é simplesmente um texto aleatório. Tem raízes em um pedaço de literatura latina clássica de 45 aC anos.

Richard McClintock, professor de latim no Hampden-Sydney College Virginia, procurou uma das palavras latinas mais obscuras, consectetur, de um Passagem de Lorem Ipsum, e percorrendo as citações da palavra no clássico literatura, descobriu a fonte indubitável.

Lorem Ipsum vem de seções 1.10.32 e 1.10.33 do "Finibus Bonorum et Malorum" (Os Extremos do Bem). e Mal) de Cícero, escrito em 45 AC.

Este livro é um tratado sobre a teoria de ética, muito popular durante o Renascimento. A primeira linha de Lorem Ipsum, "Lorem Ipsum Dolor Sit Amet..", vem de uma linha na seção

Tabela de Conteúdo

Sintaxe do índice manual:

<b>{tocify} $title={Título personalizado}</b>

Lista de marcadores

  • Lorem Ipsum
  • Lorem Ipsum
    • Lorem Ipsum
    • Lorem Ipsum
  • Lorem Ipsum
    • Lorem Ipsum

Escrita

<ul>
  <li>Lorem Ipsum</li>
  <li>Lorem Ipsum</li>
  <ul>
    <li>Lorem Ipsum</li>
    <li>Lorem Ipsum</li>
  </ul>
  <li>Lorem Ipsum</li>
  <ul>
    <li>Lorem Ipsum</li>
  </ul>
</ul>

lista numerada

    1. Lorem Ipsum
    2. Lorem Ipsum
    3. Lorem Ipsum
    4. Lorem Ipsum

    Escrita

    <ul></ul>
<ol>
  <li>Lorem Ipsum</li>
  <li>Lorem Ipsum</li>
  <li>Lorem Ipsum</li>
  <li>Lorem Ipsum</li>
</ol>

    Título

    Título H2

    Um título Cabeçalho H3

    Este é um título Cabeçalho H4

    Um parágrafo: Lorem Ipsum é simplesmente um texto fictício da impressão e composição indústria. Lorem Ipsum tem sido o texto fictício padrão da indústria desde nos anos 1500, quando um impressor desconhecido pegou uma galera de tipos e os embaralhou para fazer um livro de amostra de tipo.


    Blockquote

    "Esta é uma citação: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde os anos 1500..."

    - Vtrick

    Escrita

    <blockquote>
  "Esta é uma citação: Lorem Ipsum é simplesmente um texto fictício da impressão e
   indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria
   desde os anos 1500..."<br /><br /><b>- Vtrick</b>
</blockquote>

    Estilos de texto

    Um parágrafo com um <span>code();</span> dentro: Lorem Ipsum é simplesmente um texto fictício da indústria tipográfica e de impressão. Lorem Ipsum tem sido o texto fictício padrão da indústria desde o 1500...

    Este é um texto normal: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde 1500...

    Este é um texto em negrito: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde 1500...
    Este é um texto itálico: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde os anos 1500...

    Este é um sublinhado de texto: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde 1500...

    Este é um texto tachado: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o manequim padrão da indústria texto desde os anos 1500...

    Este é um texto colorido: Lorem Ipsum é simplesmente um texto fictício da impressão e indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria desde 1500...

    Este é um texto de fundo colorido: Lorem Ipsum é simplesmente um texto fictício do indústria de impressão e composição tipográfica. Lorem Ipsum tem sido o líder da indústria texto fictício padrão desde os anos 1500...

    Escrita

    <p>
   Um parágrafo com um <code>&lt;span&gt;code();&lt;/span&gt;</code> dentro:
   Lorem Ipsum é simplesmente um texto fictício da indústria tipográfica e de impressão.
   Lorem Ipsum tem sido o texto fictício padrão da indústria desde o
   1500...
</p>


<p><b>Este é um texto em negrito: Lorem Ipsum é simplesmente um texto fictício da impressão e
   indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria
   desde 1500...</b></p>


<i>Este é um texto itálico: Lorem Ipsum é simplesmente um texto fictício da impressão e
   indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria
   desde os anos 1500...</i>


<p><u>Este é um sublinhado de texto: Lorem Ipsum é simplesmente um texto fictício da impressão e
   indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria
   desde 1500...</u></p>


<strike>Este é um texto tachado: Lorem Ipsum é simplesmente um texto fictício da impressão
   e indústria tipográfica. Lorem Ipsum tem sido o manequim padrão da indústria
   texto desde os anos 1500...</strike>


<span color="var(--main-color)">Este é um texto colorido: Lorem Ipsum é simplesmente um texto fictício da impressão e
   indústria tipográfica. Lorem Ipsum tem sido o texto fictício padrão da indústria
   desde 1500...</span>


<span style="background-color: var(--main-color);">
  <span style="color: white;">Este é um texto de fundo colorido: Lorem Ipsum é simplesmente um texto fictício do indústria de impressão e composição tipográfica. Lorem Ipsum tem sido o líder da indústria texto fictício padrão desde os anos 1500...</span></span>

    Tamanho do texto

    Este é um texto pequeno

    Este é um Texto Normal

    Este é um texto grande
    Este é um texto maior

    Escrita

    <span style="font-size: x-small;">Este é um texto pequeno</span><br /><br /><span
  style="font-size: small;">Este é um Texto Normal</span>

<br />

<span style="font-size: large;">Este é um texto grande</span><br /><span style="font-size:: x-large;"><br/></span>

<span style="font-size: x-large;">Este é um texto maior</span>

    Postagem Relacionada ao Manual

    É importante observar que esse recurso é escrito manualmente, não aparece automaticamente em todas as páginas.

    Você pode querer ler estas postagens:

    Escrita

    <div class='pRelate'>
  <!--[ Título relacionado ]-->
  <b>Você pode querer ler estas postagens:</b>

  <ul>
    <li><a href='#'>Seu_post_título_aqui</a></li>
    <li><a href='#'>Seu_post_título_aqui</a></li>
    <li><a href='#'>Seu_post_título_aqui</a></li>
  </ul>
</div>

    Sitema de FAQ

    Define o conteúdo adicional que os usuários podem abrir e fechar sob demanda em grupos, geralmente usado para uma lista de perguntas ou FAQs (Frequently Asked Questions).

    Primeiro_titulo

    Epcot é um parque temático no Walt Disney World Resort com atrações emocionantes, pavilhões internacionais, fogos de artifício premiados e eventos especiais sazonais.

    Segundo titulo

    Epcot é um parque temático no Walt Disney World Resort com atrações emocionantes, pavilhões internacionais, fogos de artifício premiados e eventos especiais sazonais.

    Terceiro titulo

    Epcot é um parque temático no Walt Disney World Resort com atrações emocionantes, pavilhões internacionais, fogos de artifício premiados e eventos especiais sazonais.

    Quarto titulo

    Epcot é um parque temático no Walt Disney World Resort com atrações emocionantes, pavilhões internacionais, fogos de artifício premiados e eventos especiais sazonais.

    Formato de Escrita

    <!--[ Accordion start ]-->
<div class='showH'>
  <!--[ Accordion line 1 ]-->
  <details class='ac'>
    <summary>Titulo_aqui</summary>
    <div class='aC'>
      <p>Seu_texto_aqui.</p>
    </div>
  </details>
  
  <!--[ Accordion line 2 ]-->
  <details class='ac alt'>
    <summary>Titulo_aqui</summary>
    <div class='aC'>
      <p>Seu_texto_aqui.</p>
    </div>
  </details>
  
  <!--[ Accordion start ]-->
<div class='showH'>
  <!--[ Accordion line 3 ]-->
  <details class='ac'>
    <summary>Titulo_aqui</summary>
    <div class='aC'>
      <p>Seu_texto_aqui.</p>
    </div>
  </details>
  
  <!--[ Accordion line 4 ]-->
  <details class='ac alt'>
    <summary>Titulo_aqui</summary>
    <div class='aC'>
      <p>Seu_texto_aqui.</p>
    </div>
  </details>

  ...
  
  ...
</div>
</div>
    • Use o nome da classe alt(marcado no código acima) para alterar o estilo do ícone.
    • O número de widgets sanfonados que você pode adicionar é ilimitado.

    Esquema de FAQ em Microdata

    Os dados estruturados são um formato padronizado para fornecer informações sobre uma página e classificar o conteúdo dela. Ou seja, este formato de FAQ aparecerá nas pesquisas do Google abaixo da postagem.

    <!--[ Accordion start ]-->
<div class='showH' itemscope='' itemtype='https://schema.org/FAQPage'>
  <!--[ Accordion line 1 ]-->
  <details class='ac' itemscope='' itemprop='mainEntity' itemtype='https://schema.org/Question'>
    <summary itemprop='name'>Seu_titulo</summary>
    <div class='aC' itemscope='' itemprop='acceptedAnswer' itemtype='https://schema.org/Answer'>
      <p itemprop='text'>Seu_texto.</p>
    </div>
  </details>
  
  <!--[ Accordion line 2 ]-->
  <details class='ac alt' itemscope='' itemprop='mainEntity' itemtype='https://schema.org/Question'>
    <summary itemprop='name'>Seu_titulo</summary>
    <div class='aC' itemscope='' itemprop='acceptedAnswer' itemtype='https://schema.org/Answer'>
      <p itemprop='text'>Seu_texto.</p>
    </div>
  </details>
  
  <!--[ Accordion line 3 ]-->
  <details class='ac alt' itemscope='' itemprop='mainEntity' itemtype='https://schema.org/Question'>
    <summary itemprop='name'>Seu_titulo</summary>
    <div class='aC' itemscope='' itemprop='acceptedAnswer' itemtype='https://schema.org/Answer'>
      <p itemprop='text'>Seu_texto.</p>
    </div>
  </details>
  
  <!--[ Accordion line 4 ]-->
  <details class='ac alt' itemscope='' itemprop='mainEntity' itemtype='https://schema.org/Question'>
    <summary itemprop='name'>Seu_titulo</summary>
    <div class='aC' itemscope='' itemprop='acceptedAnswer' itemtype='https://schema.org/Answer'>
      <p itemprop='text'>Seu_texto.</p>
    </div>
  </details>

  ...
  
  ...
</div>

    Postar um comentário

    Por favor, não compartilhe nenhum dado sensível ou pessoal aqui.

    Atualizar