Introdução ao Editor de Site e ao Editor de Modelos

Este workshop fornece uma visão geral de como acessar e usar o Editor de Site e o Editor de Modelos. O Editor do Site é um novo recurso que permite que os usuários do editor de blocos construam o seu site inteiro com blocos, incluindo o uso de alguns novos blocos de tema e a personalização usando um novo sistema de estilo. O Editor de Modelos é um recurso que permite que os usuários do editor de blocos editem e criem modelos que uma página ou postagem usa.

Resultados de aprendizagem

1. Gerenciando modelos, peças de modelo e estilos globais por meio do Editor do Site.
2. Edição, criação e atribuição de modelos a postagens e páginas individuais por meio do Editor de modelos.

Perguntas de compreensão

1. Você instalou um tema de bloco com o WordPress 5.9 ou um tema clássico que optou por esse recurso?
2. Por que você não precisa mais acessar o Personalizador?
3. Qual é a diferença entre o Editor de Site e o Editor de Modelos?

Transcrição

Olá. Bem vindo ao Learn WordPress. Nesse vídeo a gente vai ter uma introdução ao editor de site e ao editor de modelos. Para esse vídeo nós vamos cobrir os seguintes assuntos o que é o editor de site? Como editar o estilo de seu site com o editor de site, como gerenciar modelos e como gerenciar partes de modelo. Então, agora vamos pular para o nosso navegador. E eu vou demonstrar esses itens dentro de uma instalação WordPress. Então, agora vamos dar uma olhada no editor do site. Dentro de uma instalação WordPress. Se você tem um tema de bloco, como por exemplo, O Twenty Twenty Two, você está pronto para iniciar a nossa jornada. Então, aqui, na nossa tela, vocês podem notar que dentro da seção de aparência, nós não temos a opção de personalizar. Isso porque o tema Twenty Twenty Two é um tema de bloco e para fazer a sua personalização, a gente vai utilizar o editor de Site. Então eu vou clicar em editor. Quando acessamos pela primeira vez, vamos ser redirecionados para a página principal do nosso site. Então, nesse momento já conseguimos editar o nosso site. Então, para a gente entender um pouco o poder dessa ferramenta, eu vou acessar la no ícone do WordPress, no canto superior esquerdo, o menu de adição de site. E dentro desse menu lateral a gente vai ter as opções de edição que a gente consegue fazer neste tema. Então a gente vai ter uma opção de edição de site, adição de modelos e adição de partes de modelos.

Então, se a gente quiser alterar o nosso site, a gente vai ter as seguintes opções. Então eu vou fechar o menu e se eu quiser ter mais opções sobre a configuração do meu site, eu posso clicar no menu superior direito em Configurações e eu vou ver as opções referente a esta página, como também posso ter a opção de adição de estilo. Então, clicando na edição de estilo, se você estiver usando esse recurso pela primeira vez, você vai ter um popup de introdução. Então vamos fechar esse popup e vamos focar nas opções que nós temos aqui. E o que a edição de estilo de site nos permite? A gente consegue editar o esquema de cores do nosso site. Também temos a possibilidade de procurar por mais estilos, de alterar a tipografia do nosso site, alterar as cores de apresentação do nosso site, como também no canto inferior deste menu temos a opção de editar blocos especificamente. Então, clicando nesta opção nós temos a lista de todos os blocos e lá nós conseguimos editar bloco a bloco. Uma outra opção que nós temos dentro da edição de sites é o gerenciamento de modelos de nosso site. Então aqui eu vou voltar ao menu do editor de site. Clicando no ícone do WordPress, vou selecionar a opção Modelos. Dentro dessa seção a gente vai ter a listagem de todos os modelos que esse tema suporta. Então a gente vai ter um nome, uma descrição.

E quem foi que adicionou este elemento? Então, como podemos ver nesse site, particularmente, todos os modelos foram criados pelo tema Twenty Twenty Two, mas também temos a opção de criar o nosso próprio modelo. Então, clicando em Adicionar Novo no canto superior direito, nós vamos ter as opções de modelos disponíveis que podemos criar em nosso site, então vou clicar em um modelo de categoria. Então aqui a gente tem um passo inicial de criar o nosso template para páginas de categoria. E como podemos ver, a gente tem flexibilidade total de criar um modelo para esse site, particularmente, mas para essa aula não vamos fazer essa ação. Vamos voltar e mostrar mais recursos dentro da edição de site. Então vou clicar novamente no menu superior esquerdo, selecionar modelos com agora sim. A gente tem aqui uma sinalização que o usuário admin criou um modelo chamado categoria. Se a gente quiser ver um modelo completo, podemos acessar, por exemplo, o modelo de página clicando no modelo de página. A gente vai ter acesso à edição deste modelo, então aqui a gente tem a parte superior, com o nosso cabeçalho, o título do nosso post, uma imagem de destaque e ao centro. Este é o conteúdo dinâmico do nosso site. Dentro de modelos, a gente vai ter dois tipos de partes a parte dinâmica, que é referente ao conteúdo daquele post ou página, e a parte estática, que vai compor o design da nossa página para a gente ter uma melhor visualização deste template.

A gente pode clicar na opção de visualização e lista e a gente vai ver todos os blocos pertencentes a este modelo. Então, como podemos ver aqui o modelo de página, ele é constituído de vários itens que estão agrupados em cabeçalho o grupo e rodapé. Quando clicamos em cabeçalho, a gente vai visualizar todos os itens pertencentes a aquela parte de modelo. Também podemos acessar dentro de grupo os blocos que são responsáveis por exibir o design de nossa página. Então, a gente vai ter o título do post, uma imagem destacada, um separador, um bloco espaçado e o conteúdo do post. Essa informação, como mencionamos anteriormente, vai depender do conteúdo de nossa página. Então, agora vamos voltar ao nosso menu de edição de site e verificar como funciona o gerenciamento de passe de modelo. Quando acessamos a seção de parte de modelos, nós temos a visualização de todos os modelos que fazem parte desse design. Então aqui a gente tem a parte de cabeçalho escuro, pequeno. A gente tem o modelo de rodapé, o modelo de cabeçalho e o modelo de cabeçalho escuro, um grande. Então, essas parte de modelo são elementos que constituem os nossos modelos de páginas. São partes reutilizáveis que podemos compartilhar entre diferentes modelos. Também temos a opção de adicionar uma nova parte de modelo. Para isso, vamos clicar em Adicionar Novo no canto superior direito. Com isso, temos um popup onde podemos escolher o nome do nosso modelo que iremos criar.

Então, por exemplo, podemos criar um rodapé de página e criar um rodapé especialmente para a página. Além disso, a gente vai ter três tipos de áreas, então pode ser uma parte do modelo geral, onde ela pode ser incluída em qualquer parte do site. Também podemos criar uma parte de modelo de cabeçalho, onde nós vamos incluir geralmente com um título, uma logo e um menu de navegação e uma parte de modelo de rodapé, onde usualmente será incluída ao final de nossa página. Nesse caso, estamos criando um rodapé para uma página. Vamos selecionar a parte de modelo no rodapé, criar este elemento e aqui conseguimos adicionar os nossos elementos para esse modelo. Particularmente, eu vou criar um grupo que adiciona uma linha. O título do nosso site. É a descrição do nosso site. Posso reorganizar os meus elementos? Canto a canto. Selecionar o bloco de grupo e definir uma cor de fundo para esse elemento. É uma cor de teixo. Definindo a estrutura deste rodapé. Uma vez salvo, podemos utilizar esse rodapé em qualquer modelo de página. Então, voltando para minha sessão de parte de modelo, agora a gente tem listado o rodapé de página. Espero que agora você tenha uma melhor compreensão sobre o editor de site e o editor de modelos. Visite o Learn WordPress para mais treinamento como esse. Meu nome é Fellyph. Obrigado por ter assistido esse vídeo até o final e até o próximo treinamento.