The Journal Blog Kit for Divi Overview and Review

O Journal Blog Kit for Divi é um layout de terceiros da Divi Soup com recursos como um tema infantil. O layout em si é feito com o edifício Divi e inclui um controle deslizante, categorias e um feed de blog com efeitos de foco para criar uma página de blog elegante. Ele também apresenta uma barra lateral estilizada e um design de postagem de blog personalizado padrão que você adiciona ao seu tema filho. Os novos recursos são adicionados ao seu tema filho importando-os ou simplesmente copiando e colando.

O kit de blog inclui três layouts diferentes de blog e página de arquivo. Você pode alterar o layout entre largura total, grade ou embutido colando o CSS incluído nas opções de tema ou no editor de CSS do tema filho. O arquivo, a categoria, a tag, o autor e as páginas de resultados da pesquisa seguem o mesmo layout da página do blog. Também inclui integração com o Font Awesome.

O kit do blog vem com todos os arquivos e instruções sobre como usá-lo. Neste artigo, irei instalar o Journal Blog Kit e ver como é fácil de usar e dar uma olhada em seus recursos.

Instalando o Journal Blog Kit for Divi

Descompacte o arquivo baixado. Dentro, você encontrará vários arquivos, incluindo arquivos JSON para o layout da página do blog e configurações do personalizador, um arquivo leia-me, CSS, PHP, JS e arquivos de widget (esses são os tipos de arquivos que você encontrará em um tema filho) .

Recomendo seguir as instruções para ver como instalar os arquivos, pois isso será feito manualmente. Felizmente, as instruções são bem escritas e o processo não é difícil. Você precisará usar um tema filho (mesmo se estiver em branco). O arquivo PHP será sobrescrito quando o tema for atualizado, se você adicioná-lo ao tema pai.

A vantagem de ser um layout e instalar os arquivos manualmente é que funciona com o seu tema filho atual. Você não terá que substituir o seu tema filho para adicionar esses novos recursos.

The Journal Blog Kit for Divi Documentation

Um link para a documentação é fornecido no arquivo de download. Clicar no arquivo leva você à página de suporte do kit de blog, onde encontrará um recurso de pesquisa, instruções de instalação, instruções de personalização e um link para suporte. As instruções de personalização mostram como alterar as cores, o número de colunas nos layouts e o comprimento do trecho.

Clique nas instruções de instalação e siga as etapas. Isso inclui copiar e colar o código em determinados locais, enviar arquivos por FTP e importar arquivos por meio de um plugin. Cada uma das etapas é detalhada. A execução das etapas levará alguns minutos.

The Journal Blog Kit para a página do Divi Blog

O kit do blog inclui o layout da página do blog como um arquivo JSON. Este layout deve ser importado para a própria página, e não para a biblioteca Divi. A própria página usa um controle deslizante de postagem, seis módulos de apelo à ação e uma linha com um blog e uma barra lateral. Isso será exibido de forma diferente dependendo do CSS que você usar. Vejamos os recursos e o layout de cada layout.

The Journal Blog Kit para Divi Slider e Categorias

O controle deslizante de postagem posiciona a navegação por pontos verticais à esquerda e exibe um trecho à direita. O trecho centraliza o texto e tem uma opacidade mais baixa para que a imagem em destaque do controle deslizante apareça. Ele também inclui um botão de visualização de postagem. Quando ela desliza, a imagem aparece gradualmente e o trecho desliza para cima a partir da parte inferior.

Os módulos de apelo à ação funcionam como links para arquivar páginas de categorias específicas. Passar o mouse sobre o módulo muda a cor do botão de um fundo preto com texto branco para um fundo branco com texto preto e adiciona uma borda preta. Eu amo o amarelo forte. Esta é uma maneira interessante de adicionar navegação por categoria à página.

As cores vêm da importação do estilo do personalizador. Você não precisa usá-lo e pode alterar as cores facilmente. Se quiser ter acesso ao estilo do personalizador original, você precisará exportá-lo primeiro.

The Journal Blog Kit para Divi Fullwidth Layout

Aqui está o layout do blog usando CSS de largura total. A imagem apresentada aumenta ao passar o mouse. Ele adiciona uma capitulação à primeira palavra do trecho. A categoria e a capitulação são estilizadas em amarelo. O botão ler mais é estilizado para combinar com o layout.

The Journal Blog Kit para Divi Grid Layout

O layout da grade exibe duas postagens em uma única linha nas categorias. Inclui o mesmo estilo do layout de largura total, como zoom ao focalizar a imagem apresentada, categoria amarela e capitulação e estilo do botão.

The Journal Blog Kit para Divi Inline Layout

O CSS embutido mostra as postagens do blog com a imagem à esquerda e o texto à direita. Inclui o estilo e os recursos de outros layouts. Neste exemplo, tirei uma captura de tela na parte inferior da lista para mostrar o botão com estilo Entradas mais antigas. Este mesmo botão aparece em todos os layouts.

The Journal Blog Kit for Divi Sidebar

Se você importar as configurações do widget, será criada uma barra lateral com vários widgets estilizados. A barra lateral inclui uma seção sobre mim com título, foto e descrição, e seções para pesquisa, categorias, arquivos, tags e postagens recentes. Cada seção é estilizada para combinar com o layout. Gosto das linhas amarelas de cada lado dos títulos. Categorias e arquivos são caixas suspensas. Tags são links estilizados.

The Journal Blog Kit for Divi Individual Post Layout

Se você carregar o arquivo de postagem via FTP para os arquivos do seu tema, as postagens de blog individuais que são criadas com o WordPress em vez do Divi builder também são estilizadas e têm muitos recursos novos adicionados a elas. Os recursos incluem a categoria, título, data, número de comentários e marcas acima da postagem. A postagem tem uma capitulação estilizada.

Após a postagem, há uma caixa de autor estilizada, navegação de postagem, postagens relacionadas e uma caixa de comentário estilizada. Os comentários são colocados em cascata e incluem um ícone estilizado para mostrar que uma resposta é uma resposta a outro comentário. As seções individuais incluem as linhas amarelas estilizadas com os títulos.

The Journal Blog Kit for Divi Price

O Journal Blog Kit para Divi custa £ 49,00. Inclui todos os arquivos e instruções de que você precisa para usá-lo.

• Você pode comprar o Journal Blog Kit no site do desenvolvedor.

The Journal Blog Kit for Divi

O Journal Blog Kit for Divi adiciona muitos recursos de estilo às páginas e postagens do seu blog. Eu gosto que estiliza os posts do blog sem que eles tenham que ter sido construídos com o Divi builder. Também estou feliz em ver um kit focado apenas no blog. Os blogs nem sempre recebem atenção suficiente.

Os arquivos devem ser instalados manualmente, mas acho que este é um bom exercício porque mostra para onde vão certos tipos de arquivos e fornece algumas informações sobre como o WordPress funciona. Adicionar os arquivos é realmente mais fácil do que parece. Não tive problemas em adicionar qualquer parte do código.

Eu adicionei CSS ao arquivo de tema filho para um dos layouts e, em seguida, excluí esse código e adicionei o CSS às opções de tema para os outros. Ambos funcionaram conforme o esperado. O CSS, JS, PHP e todos os arquivos importados funcionaram perfeitamente na primeira tentativa. Para voltar ao design original ou a um design diferente, basta alterar o tema filho e remover o CSS.

É interessante ter recursos de estilo de tema filho em um layout. Gosto disso porque pode ser usado com qualquer layout ou tema filho. Se você estiver interessado em adicionar alguns novos recursos de blog ao Divi, recomendo fortemente que você dê uma olhada no Journal Blog Kit.

Nós queremos ouvir de você. Já experimentou o Journal Blog Kit for Divi? Deixe-nos saber o que você pensa sobre isso nos comentários abaixo.

Imagem em destaque via M.Stasy / shutterstock.com