Se você desenvolve sites WordPress com construtores de páginas, provavelmente já se deparou com o OceanWP. Juntamente com GeneratePress e Astra, ele forma o “Top 3” dos temas populares que são combinados com construtores de páginas WordPress. Caso não esteja familiarizado com o mundo de construtores de páginas WordPress, o OceanWP é um tema WordPress polivalente gratuito que oferece a você muito controle para personalizar o design do seu site em tempo real através do WordPress Customizer. E não só isso, ele também é extremamente rápido!

O núcleo do tema OceanWP é gratuito e está listado no WordPress.org. Além disso, também inclui uma variedade de extensões gratuitas e premium que podem inserir funcionalidades adicionais.

Em nossa análise do OceanWP, compartilharemos mais sobre o que torna este tema tão único e popular.

Por Que o OceanWP é Tão Popular?

Ao invés de expor uma única opinião, decidimos que seria mais útil compartilhar alguns pensamentos dos usuários da Elementor Community no Facebook. Você deverá identificar um ponto em comum em todos eles:

Dois comentários no grupo Facebook da Elementor Community

Dois comentários no grupo Facebook da Elementor Community

Outro comentário na Elementor Community no grupo do Facebook

Outro comentário na Elementor Community no grupo do Facebook

Basicamente, o principal atrativo do OceanWP é que ele proporciona a você o poder de personalizar seu tema de uma forma muito amigável e intuitiva através do WordPress Customizer, incluindo suporte profundo para WooCommerce.

Através desta personalização, você pode criar o framework para o conteúdo desenvolvido com um construtor de páginas ou assumir maior controle sobre seu tema de forma geral.

Além desses controles, o OceanWP também inclui uma variedade de sites de demonstração gratuitos e premium que permitem que você importe rapidamente um design pronto, incluindo configurações do WordPress Customizer e um modelo Elementor para a landing page.

Através dessas demonstrações, você pode deixar o OceanWP com essa aparência rapidamente:

Demonstração Sports Coach no OceanWP

Demonstração Sports Coach no OceanWP

Ou com essa:

Demonstração Store no OceanWP para eCommerce

Demonstração Store no OceanWP para eCommerce

Ou como qualquer uma das outras demonstrações:

Todas as demonstrações OceanWP

Todas as demonstrações OceanWP

Para ter ainda mais poder, o OceanWP também possui extensões gratuitas e premium para fatores como:

  • Pop-up para login
  • Instagram
  • Marca própria (white labeling)
  • Portfólio
  • Pop-up para WooCommerce
  • Rodapé fixo
  • Janela modal
  • Slider de posts
  • Ocean hooks (ganchos)
  • Importar demonstrações
  • Barra lateral personalizada
  • Widgets do Elementor
  • Painel lateral responsiva (com widgets inclusos)
  • Cabeçalho fixo
  • Frase de destaque no rodapé
  • Compartilhamento de produtos no WooCommerce
  • Compartilhamento em redes sociais

E tudo isso vem incluso em um pacote que é muito leve quando comparado à maioria dos temas WordPress. Isso significa que ele é excelente em termos de desempenho.

Como Importar um Site de Demonstração com o OceanWP

É mais fácil mostrar como o Customizer funciona com um tema já desenvolvido, por isso começaremos com uma visão rápida do quão fácil é importar um site de demonstração com o OceanWP.

Uma vez instalados os complementos gratuitos  Ocean Demo Import e Ocean Extras do WordPress.org, você poderá importar conteúdo de demonstração diretamente pelo seu painel WordPress:

Como importar uma demonstração OceanWP

Como importar uma demonstração OceanWP

Após finalizar o processo, seu site deverá ter a mesma aparência da versão de demonstração.

Para personalizar o design da página inicial da sua demonstração, você pode usar o Elementor:

OceanWP usa o Elementor nas landing pages de suas demonstrações

OceanWP usa o Elementor nas landing pages de suas demonstrações

E para personalizar o restante do seu tema, você utilizará o WordPress Customizer.

Falando nisso…

Configurações do WordPress Customizer para OceanWP

É no WordPress Customizer onde o OceanWP realmente brilha. Mesmo com pouquíssimas extensões instaladas, aqui está um longo conjunto de opções que você dispõe:

Lista completa das configurações no Customizer

Lista completa das configurações no Customizer

A profundidade dessas opções vai muito além do que a maioria dos temas normais do WordPress têm a oferecer.

Vejamos alguns exemplos:

Controlando o Cabeçalho

Uma das áreas que muitos construtores de páginas ainda não conseguem cuidar é o cabeçalho… e é por isso que é conveniente que o OceanWP dê a você uma grande variedade de opções para controlar seu cabeçalho (e a “Barra Superior” sobre ele – que contém as informações de contato e perfis nas redes sociais nesta demonstração):

Configurações do cabeçalho no Customizer

Configurações do cabeçalho no Customizer

Not only can you choose from premade styles, you also got lots of nitty-gritty settings to control how it looks…down to the actual padding that you add to your header for different devices:

Estilo e posicionamento do cabeçalho

Estilo e posicionamento do cabeçalho

Controlando Seu Blog

Não podemos cobrir cada uma das configurações, mas vamos dar uma olhada em mais duas…

Na área Blog, você pode controlar de tudo. Desde o layout geral…

Opções de layout do blog

Opções de layout do blog

… até a organização/visibilidade específica de diversos elementos e informações meta:

Configurações de detalhes do blog no Customizer

Configurações de detalhes do blog no Customizer

Controlando a Tipografia do Seu Site

Deseja alterar as fontes e cores em seu site? Sem problemas, basta ir até a seção Tipografia, onde você será recebido por outra longa lista de opções:

Configurações de tipografia

Configurações de tipografia

Você Também Recebe Esse Tipo de Aprofundamento em Outras Áreas

O objetivo desta seção não é exibir cada configuração disponível (ainda há muitas outras!). Ao invés disso, é oferecer a você uma compreensão da profundidade dos controles que você pode esperar obter no WordPress Customizer e no OceanWP.

Embora leve tempo para explorar todas as configurações, você tem o poder de controlar basicamente cada aspecto importante do seu site sem precisar lidar com qualquer código/CSS diretamente.

5 Recursos Úteis do OceanWP que Facilitam Sua Vida

Além das demonstrações e funcionalidades do WordPress Customizer, aqui estão alguns outros recursos do OceanWP que facilitam sua vida e proporcionam maior flexibilidade quando você trabalha em seu site.

1. Controle de Posts Individuais

Com o complemento gratuito OceanWP Extras, você recebe acesso a uma nova meta box detalhada para partes individuais de conteúdo:

Meta box em posts individuais

Meta box em posts individuais

Através destas opções, você pode controlar (em parte) as seguintes configurações em cada post ou página:

  • Alterar o layout do conteúdo ou da barra lateral
  • Desabilitar o cabeçalho ou barra superior
  • Alterar o logo ou as cores do menu
  • Desabilitar o título do post/página
  • Desabilitar o rodapé
  • Outros recursos menores

Embora esses controles possam ser úteis em diversas situações de nicho, eles são especialmente bons se você estiver usando o OceanWP com um construtor de páginas, pois poderá desabilitar elementos que, do contrário, ficariam no caminho entre você e o construtor.

2. Opção para Habilitar/Desabilitar Scripts/CSS Específicos

Se você estiver preocupado com o quão rápido seu website carrega, vai adorar a opção do OceanWP que permite que habilite ou desabilite scripts de JavaScript ou fragmentos de CSS individualmente:

Como desabilitar scripts específicos no OceanWP

Como desabilitar scripts específicos no OceanWP

Basicamente, esta área permite que você desabilite o que não estiver usando, para acelerar seu site.

3. Um Grande Número de Ganchos (Hooks) + Condicionais

Os ganchos (hooks) facilitam a inserção do conteúdo em diferentes áreas do seu site sem a necessidade de editar o código do tema diretamente. Por exemplo, você pode usar ganchos para incluir um anúncio abaixo do título do post ou simplesmente adicionar conteúdo complementar em qualquer outro local.

Uma vez que você domina os ganchos, eles se tornam muito úteis.

Lutando com tempo de inatividade e problemas no WordPress? Kinsta é a solução de hospedagem projetada para economizar seu tempo! Confira nossos recursos

E quando se trata desses ganchos, o complemento premium OceanWP Hooks não desaponta.

Ele oferece uma grande variedade de ganchos. E um detalhe muito legal é que eles permitem que você:

  • Habilite o conteúdo do gancho somente em locais específicos (apenas na página inicial, por exemplo)
  • Habilite o conteúdo do gancho somente para funções específicas de usuários
Opções de ganchos no OceanWP

Opções de ganchos no OceanWP

Embora os ganchos em si não sejam exclusivos em temas que miram este nicho, a lógica condicional e a segmentação por função de usuário são.

4. Integração Profunda com WooCommerce

Outro dos pontos de destaque do OceanWP é sua integração profunda com WooCommerce. Se você possui o WooCommerce instalado em seu site, receberá uma nova área sobre ele no WordPress Customizer:

Configurações do WooCommerce no OceanWP

Configurações do WooCommerce no OceanWP

E não se trata de apenas algumas configurações de token. Elas são muito profundas – por exemplo, você pode até mesmo personalizar o número de upsells ou cross-sells na página do carrinho de compras, assim como habilitar a opção de carrinho/conclusão de compras sem distrações:

Configurações detalhadas de carrinho/conclusão de compras

Configurações detalhadas de carrinho/conclusão de compras

5. Muitas Outras Extensões

Até aqui, sequer falamos sobre muitas outras extensões gratuitas e premium. Mas lembre-se: o OceanWP também permite que você adicione diversas outras funções úteis.

Veja a lista completa de extensões aqui.

Caso você esteja se perguntando por que existem tantas extensões, saiba que esta é uma boa abordagem, pois mantém as coisas de forma modular.

Ao invés de empurrar tudo em um único tema, do qual você pode querer ou não ter determinadas utilidades, o OceanWP permite que você selecione e escolha a funcionalidade exata que deseja, mantendo assim o site leve.

Testes de Velocidade do OceanWP

Estávamos curiosos para ver o desempenho do OceanWP, por isso realizamos alguns testes de velocidade. Importamos o conteúdo da demonstração Sports Coach em nosso site de desenvolvedor (que fica hospedado aqui na Kinsta) e fizemos pequenas modificações. O Elementor também foi instalado, conforme recomendado pelo OceanWP.

  1. Desabilitamos o Google Maps no rodapé. Ele é famoso por prejudicar o desempenho e jamais deve estar em sua página inicial!
  2. Habilitamos a CDN Kinsta para que os ativos carregassem o mais rápido possível onde quer que realizássemos os testes.
  3. Adicionamos Google Analytics para imitar realmente um site de produção.

Em seguida, executamos cinco testes de velocidade e retiramos a média.

Teste de velocidade do OceanWP

Teste de velocidade do OceanWP (fonte: Pingdom)

Uau, 744 ms? Isso é muito bom para, literalmente, ter importado o conteúdo de demonstração com apenas um clique e ter realizado três pequenas mudanças. Lembre-se: com o Painel de Scripts e Estilos, você pode facilmente fazer uma otimização ainda maior. Mas é ótimo saber que, logo de cara, você pode esperar um ótimo desempenho com o OceanWP!

Quanto Custa o OceanWP?

O núcleo do tema OceanWP é 100% gratuito. E também há sete extensões gratuitas que podem ser encontradas no WordPress.org.

Se você quiser as extensões premium, pode adquiri-las individualmente a partir de US$9,99 para serem utilizadas em um único site.

Ou, se quiser acesso às 11 extensões premium, além das Demonstrações Pro, é possível comprar o pacote de Extensões Principais a partir de US$39 com licença de utilização para um único site.

Se você quiser saber mais sobre por que o Nicolas, desenvolvedor do tema, decidiu adotar este modelo de pagamento, veja o post dele na Freemius para conhecer um pouco dessa história.

Experimente o OceanWP – É Grátis

Como a maioria das funcionalidades do núcleo do OceanWP é gratuita, você pode fazer o download do OceanWP no WordPress.org e experimentá-lo sem precisar abrir a carteira.

Apesar das extensões premium adicionarem funcionalidades muito úteis, você será capaz de ter uma boa compreensão do tema mesmo utilizando apenas com a versão gratuita. Assim, se você gostar, poderá adicionar as extensões premium posteriormente.

Agora é com você – já utilizou o OceanWP alguma vez? Como você acha que ele se compara aos outros temas WordPress polivalentes?