Templates e Plugins

Origin: tema responsivo grátis para WordPress

Anúncios Google

Têm ficado cada vez mais escassos os temas de boa qualidade e grátis para WordPress. Mas nem tudo está perdido: vez por outra pipocam alguns muito bons, e o meu novo xodó é o Origin, sem dúvida um dos melhores gratuitos que já encontrei — pelo menos pro “paladar” de quem curte temas simples, arejados e bonitos.

Limpo, organizado, com código simplificado para quem gosta de fazer personalizações, design responsivo e melhorias como trilha de navegação (breadcrumbs) e paginação sem precisar de plugin, o tema pode ser tranquilamente usado no estado, mas adapta-se facilmente às suas mudanças. Nada daqueles temas com códigos e estrutura super complexa, ou de temas-filho. A não ser que você queira um tema-filho.

Entre suas principais características:

  • Layout responsivo;
  • Imagem de fundo no cabeçalho facilmente configurável pelo seu painel no WordPress, assim como favicon;
  • Tipografia usando de fontes do Google Fonts, com ajuste incluído no painel, só escolher e usar;
  • Caixa para inserir CSS personalizado e conteúdo no rodapé;
  • Menus dropdown suaves e elegantes;
  • Miniaturas dos posts;
  • Linha de tags e categorias em destaque;
  • Diversas áreas de widget, incluindo posições na barra lateral, abaixo das páginas de postagem e no rodapé;
  • Fancybox (efeito especial para galerias de imagem);
  • Otimizado para motores de busca (SEO);
  • Tem estilos prontos para plugins de formulário (Gravity Forms e Contact Form 7);
  • Arquivos para tradução no formato .po/.mo;

Opções de fonte do Google Fonts incluídas no tema Origin

O design é limpo e elegante, com fundo branco e tons de cinza.
A cor dos links pode ser mudada no painel visto acima. As imagens com link tem um efeito suave ao rolar o mouse, por um script carregado no footer.

Para quem gosta de widgets, o Origin tem muitos, incluindo calendários, tags, arquivos e outros bem configuráveis. O widget de pesquisa também permite usar o sistema nativo ou um externo.

Widgets do Origin

Feito a partir do framework Hybrid Core, ele também conta com alguns shortcodes, como para galerias. Mas claro que nem tudo é perfeito,  afinal, ainda é um tema grátis: apesar de ter fórum oficial para sanar dúvidas gerais (em inglês), ele só é acessível para assinantes — ou procurando links diretos pela pesquisa do Google. Assim, você terá que se virar ou perguntar por aí se tiver algum problema. Pra quem tem algum conhecimento de design web, vai tirar de letra.

Aparência do tema Origin em janela cheia
Aparência do tema Origin em janela cheia.
Aparência do tema Origin em dispositivos móveis
Aparência do tema Origin em dispositivos móveis.

A estrutura dele não é aquela complexidade vista em temas pagos e frameworks, então editar o tema é molezinha pra quem tem conhecimentos básicos de PHP. Se preferir, pode criar child themes (abrigando uma nova folha de estilos, funções e arquivos em uma pasta separada) ou editar o próprio tema; claro que nesse caso não poderá atualizá-lo, ou vai perder as alterações feitas.

Eu já migrei meus outros blogs pra ele, tirando inclusive um template pago que usava em um e estava apresentando problemas. Talvez eu faça o mesmo aqui no futuro, veremos…

Atualização 13/08/2012 – já migrei, veja o Origin (bem modificado, é verdade) em ação aqui mesmo no Tutoriart.

Atualização 10/06/2015 – faz tempo isso né, gente? O site já trocou de tema, hoje uso um premium, mas o Origin ainda está firme na gratuidade.

Por enquanto, recomendo muito o Origin para quem procura beleza, modernidade e simplicidade unidos num único tema.

Se vai fazer alterações no tema, não recomendo colocar muito enfeite, ou a graça da simplicidade, que é seu forte, vai se perder — tente apenas dar um toque pessoal ao seu novo tema.

Esse é o Origin, uma boa opção de tema responsivo grátis no WordPress. Aproveite!

Author

Fundador do Tutoriart em 2010, é ex-instrutor de Photoshop, design web e gráfico. Em quase uma década de redação online, tem cerca de 1500 artigos publicados. Gerencia também o Memória BIT.

19 Comments

    • Tranquilo, Alessandro!
      Está falando do post grande, marcado como “Sticky Post”? Na guia “Publicar” do editor de artigos, altere a “Visibilidade” para “Fixar este post na página inicial”.

  1. Olá Daniel!

    Você sabe como tira a data,autor e categoria deste tema para não ser exibido? Já tentei display:none mas não resolveu.

    Abraço!

    • DanielLemes Reply

      Já tentou isso?

      .byline { display:none }

      Pra mim funciona.

      • Já tentei isso,coloquei em vários desse tipo:

        .sticky .byline
        .byline
        .singular .byline

        E em todos que tinha o .byline,limpei cache e nada..esquisito.

        • DanielLemes

          Tente também com !important, tipo:

          .byline { display:none !important }

          Se não funcionar e estiver online, me passa o link pra eu dar uma olhada.

  2. Daniel, obrigado pelas respostas, eu já resolvi a maioria das dúvidas graças a você, e estava tentando mostrar uma linha que eu queria acrescentar ainda referente aos links para comentários, mas não consigo publicá-la inteira por aqui, só aparece a parte #comments, quando posto os comentários. É um código para mostrar “deixe seu comentário” e número de comentários na byline de cada postagem na página principal. Eu gostaria de saber como você fez isso no Blog Aprendiz.

    • Achei na internet uma função para filtrar o byline, não testei pois modifiquei muito meu tema e o byline original praticamente nem existe mais…

      Tente isso na functions.php:

      add_filter( 'origin_byline', 'my_byline' );
      function my_byline( $byline ) {
       
      $byline = '<div class="byline">' . __( 'Article by [entry-author] - [entry-comments-link]', 'origin' ) . '</div>';
      return $byline;	}
      

      O byline original usa uns shortcodes do tema para exibir o autor [entry-author] e outros detalhes, aí você poderia tirar os shortcodes e refazer em PHP. No meu tema, o byline ficou mais ou menos assim:

      <div class="byline">
      Em <span class="date updated"><?php the_date(); ?></span>&bull; Por <span class="vcard author"><span class="fn"><?php the_author_posts_link(); ?></span></span> &bull; <?php comments_popup_link('Seja o primeiro a comentar!', '(1) Comentário', '(%) Comentários'); ?>
      </span>
      </div>
      
  3. Oi, Daniel, obrigado de novo, eu me expressei mal na primeira dúvida, o que eu queria na verdade era modificar a posição dos menus, mas consegui solucionar isso e inseri uma barra de navegação paras versões mobile.

    Em relação à segunda dúvida, eu queria saber se estaria correto acrescentar uma linha mais ou menos assim:

    <a href="#comments”>

    E em qual ficheiro php eu deveria acrescentá-la pra que apareça o link para comentários na byline de cada postagem.

  4. Oi, Daniel, mais uma vez obrigado por suas dicas! Eu usei o Origin pra customizar um blog no qual eu trabalho. Eu gostaria de tirar mais duas dúvidas, se possível: qual ficheiro preciso editar para deixar a estrutura do template inalterada para smartphones, e como inserir um link nos posts para ir aos comentários?

  5. Olá, Daniel, você já tirou uma dúvida minha antes, mas queria lhe aperrear de novo. Eu queria saber se você poderia, por favor, me explicar como remover a função de posts resumidos na página principal, pelo tema Origin, para que as postagens apareçam inteiras. Acredito que isso esteja relacionado à função excerpt ending, no functions.php, mas não consegui entender o que é preciso modificar.

  6. Muito obrigado pelo retorno, Daniel. Eu estou treinando no CSS e você foi de grande ajuda.

  7. Olá, Daniel, minha dúvida é sobre coo você estilizou o cabeçalho pra que os menus ficassem em baixo, centralizados, e com a altura do header maior.

    • Oi Johnny

      Foi com estilização nas divs #branding (que segura o título e descrição do blog) e na #menu-primary (que abriga o menu), especialmente usando a propriedade top com posicionamento relative.

      Se você manja de CSS, dê uma olhada no meu arquivo style.css para pegar a base, aí você muda o seu conforme a necessidade do seu blog.

  8. Achei muito bacana este tema Daniel, leve, simples de personalizar.
    Gostei da largura do corpo dos artigos, é bem larga.

    Já baixei e pretendo testar em alguns blogs meus.

    Abraço!

    • Acho que a coluna de conteúdo (na resolução normal) tem 650 px, bem mais largo que alguns outros. Bem espaçoso mesmo, sem embolar com a sidebar.
      Boa sorte!

Write A Comment

Pin