O novo tema do RBtech em detalhes

Hoje, como anunciado em nossa página do Facebook, fiz a mudança do tema aqui do site. Já fazia algum tempo que um novo tema estava nos planos, mas por razões diversas e adversas ele sempre era deixado de lado.

Porém durante o feriadão, os planos sairam do papel e se transformaram em código fonte :) e aí está nosso novo tema (ainda com pequenos bugs) instalado e configurado. Neste post, assim como fiz há 2 anos atrás, vou explicar um pouco sobre o que eu queria com tudo que foi modificado no site.

Explicando o multisite

Pra quem não sabe, o RBtech não é apenas um blog, mas uma rede que roda na plataforma do WordPress. Isso é bom e ruim: bom para gerenciar vários sites em um mesmo painel e com dados centralizados, mas péssimo para desenvolver (principamentel temas).

Não que seja difícil fazer um tema para multisite, mas é preciso muito mais trabalho para chegar ao mesmo resultado de um simples tema para um blog. Em virtude disso, temos um tema para o site principal (RBtech.info) e outro para cada site da rede (Criação, Consultoria, Developer e Hardware). Acho que deu pra entender porque ficamos dois anos sem mudar de tema, ou não??

Objetivo do novo tema

Quando comecei a planejar o tema, eu queria basicamente duas coias: um tema responsivo e que destacasse o conteúdo recente.

Responsivo pois o número de acessos via dispositivos móveis está aumentando exponencialmente. Destaque para o contéudo pois eu tenho poucos segundos para convencer o leitor a abrir um post, e as imagens ajudam muito neste ponto.

A partir desses dois objetivos básicos, outras coisas foram surgindo e sendo adicionadas ao projeto, vejamos as principais a seguir

Topo e menu de navegação

No topo do site, além do menu principal de navegação que permaneceu muito semelhante ao anterior, foi criado um menu dropdown ao lado do logo para facilitar o acesso aos demais sites e setores da rede RBtech. Ao clicar no sinal de + ao lado do logo, as opções são mostradas:

Destaques da rede

Na página principal do site, os três posts mais recentes de toda rede são mostrados com o devido destaque. É praticamente impossível alguém acessar o site e simplesmente ignorar o conteúdo exibido no início da página.

Logo abaixo das novidades, foi incluído um formulário de inscrição na newsletter do site. Quem vive de internet sabe a importância de ter uma boa lista de emails, com pessoas interessadas no que você produz.

Como a seção de novidades chama bastante atenção, o formulário indiretamente acaba ficando em evidência também.

Mais atualizações

Logo abaixo do formulário, temos uma seção com mais 4 posts recentes da rede toda e também um anúncio publicitário, afinal de contas eu preciso garantir o leite das crianaças...

Logo abaixo foram inseridos ícones que ilustram cada site da rede, fazendo com que a pessoa que rolou a página sinta-se estimulada a visitar um site de seu interesse após ver as principais novidades mostradas até então.

Pra fechar a parte central da página, temos os tópicos mais recentes do fórum e outro anúncio na lateral.

Rodapé

Pra finalizar a página principal temos o rodapé (que é padrão para todos os sites), nele são exibidos um menu de navegação secundário com algumas páginas básicas e ícones para as redes sociais das quais fazemos parte.

Os sites da rede

A home dos sites muda um pouco em relação à página principal, pois ao invés de mostrar três destaques, apenas um post é colocado em evidência. Logo abaixo o formulário da newsletter se repete assim como na página principal.

Depois desta seção, a listagem de posts segue um padrão que todos já estão acostumados a ver nos blogs, incluindo uma paginação para facilitar a navegação. Se você navegar para uma página seguinte ou uma categoria, por exemplo, verá que o post destacado não é mais exibido, deixando assim que o padrão dos blogs persista.

Sidebar

A barra lateral é constantemente modificada para exibir conteúdo relevante em cada situação. O único widget fixo é o formulário de busca, no mais, o conteúdo é sensível ao contexto.

Quando você está na home de um blog, são mostrados os dez posts mais populares da rede, mas quando você navega para outra página são mostradas as últimas atualizações. Nas páginas estáticas nenhuma publicidade é mostrada, enquanto nas demais são vinculados anúncios que podem inclusive ser fixados ao rolar a página para baixo.

O formulário para inscrever-se na newsletter também não é mostrado na home para não haver duplicidade de conteúdo.

A exibição dos posts

A página de posts sofreu grandes alterações, desde o título do post até a seção de comentários. Pra começar, logo abaixo do título um anúncio divide espaço com as informações do post, como data, categoria, etc, para somente depois o conteúdo propriamente dito ter início.

Os textos ficaram mais espaçados e com fonte mais suave, facilitando a leitura. Os vídeos embutidos são responsivos, bem como as imagens (ao menos na teoria era assim).

Depois do post temos botões de compartilhamento em redes sociais, mais um anúncio e posts relacionados. Mais abaixo as informações do autor e a seção de comentários com exibição personalizada e bem diferente da antiga.

Pra finalizar

Bom, se você leu até aqui, primeiro deixe-me dizer: MUITO OBRIGADO. Mas talvez você está se perguntando: por que falar tudo isso sobre um tema novo, não é só mais um tema?

Tudo isso pra que você entenda o seguinte:

• Se você é nosso leitor: eu não fiz "mais um tema", eu fiz um tema pensando em tornar sua experiência melhor e mais satisfatória.
• Se você é desenvolvedor: tente entender porque cada coisa foi colocada onde está, e use isso como experiência em seus próximos projetos.
• Se você é blogueiro: tente entender as estratégias que se escondem por traz de cada seção do blog e use-as a seu favor.

Caso tenha sugestões, basta comentar este post. Abraço!