Na aula anterior, começamos a escrever no Gutenberg, o novo editor de texto do WordPress. Na nossa próxima aula, vamos explicar como funciona o bloco de parágrafo do Gutenberg.
No momento, o novo editor de texto está disponível para teste através de um plugin, que você pode obter aqui. O WordPress recomenda que você o use num site de testes e desenvolvimento, ou seja, não ainda no site que você tá mantendo no ar.
Se você perdeu a primeira aula, clique aqui, dá uma conferida e volta para assistir a segunda aula.
Prontos? Vamos começar a segunda aula.
Bloco de parágrafo
Vamos voltar para o menu lateral, onde estão as funcionalidades “Document” e “Block”. Explicada a primeira, vamos para a segunda, que aparece quando você clica em cima do bloco. Como o nosso primeiro bloco foi um parágrafo, o menu em questão traz as funcionalidades extras de parágrafo, aqui ilustradas:
Vamos começar pelas configurações de texto (Text Settings):
- Drop Cap: É a letra capitular, quando a primeira letra de um texto é destacada em tamanho maior, expediente esse bem antigo e muito usado em inícios de capítulos de livros.
A função em questão transforma o primeiro parágrafo do seu texto nisso aí:
- Font Size: é nela que você determina o tamanho do texto que você quer apresentar. Arraste para o lado esquerdo se quiser diminuir o tamanho do texto, e para o lado direito se quiser aumentar. Na caixa ao lado aparece automaticamente o tamanho numérico da fonte, que você também pode alterar manualmente.
- Background Color e Text Color: Onde você determina respectivamente as cores de fundo do parágrafo e da fonte.
São oferecidas 10 cores prontas tanto para um modo quanto para o outro, mas se você quiser utilizar uma cor personalizada, você deve clicar no disco colorido (o último deles).
Você pode determinar a cor personalizada clicando em cima de qualquer parte do espectro. Para ver os outros tons, basta arrastar o círculo da barra do arco-íris para a esquerda ou para a direita.
Nas setinhas, você seleciona o tipo de código de cores que você deseja usar (hexadecimal, RGB ou HSL). Aqui você pode determinar uma cor ainda mais exata.
- Additional CSS Class: É onde você pode adicionar uma classe CSS personalizada para o seu texto.
Bem, terminamos a primeira aula de Gutenberg. Na próxima aula vamos explicar melhor a funcionalidade dos blocos e como você pode “brincar” com eles. Não perca a próxima aula da #escola612!
