Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Temas em Drupal

3,265 views

Published on

Apresentação feita por Catarina Clemente e João Belchior durante o DrupalCamp Lisboa 2011.

Published in: Design

Temas em Drupal

  1. 1. Temas em DrupalDrupalCamp Lisboa 2011 - 26 de MarçoCatarina Clemente (cvclemente)João Belchior (Jolidog)
  2. 2. Temas em Drupal 2 | 18 INICIADO INTERMÉDIO AVANÇADO Sistema de camadas / LayersO tema é o último layerantes do utilizador ver osite no seu browser.
  3. 3. Temas em Drupal 3 | 18 INTERMÉDIO AVANÇADO INICIADO
  4. 4. Temas em Drupal 4 | 18 INICIADO INTERMÉDIO AVANÇADO Onde encontrar temas Existem cerca de 702 temas (574 Drupal 6 e 128 Drupal 7) gratuitamente disponibilizados em http://drupal.org/project/themes Poderá ver algumas demos em Theme Garden; Existem Theme Shops: Fusion Drupal Themes - http://fusiondrupalthemes.com Adaptative Themes - http://adaptativetheme.com .... Já tem os layouts? Contrate um themer! Só tem uma ideia? Contrate um webdesigner/themer! 2/8
  5. 5. Temas em Drupal 5 | 18 INICIADO INTERMÉDIO AVANÇADO Temas Contribuidos Podem não ter o código optimizado ou as funcionalidades que servem os seus propósitos. São disponibilizados para a comunidade gratuitamente. Alguns têm suporte pela estrutura drupal.org Alguns têm documentação e/ou demonstração 2/8
  6. 6. Temas em Drupal 6 | 18 INICIADO INTERMÉDIO AVANÇADO Opções básicas de personalização Site logo, slogan, favicon; Esquema de cores, em temas como o Garland ou o Bartik ou outros temas com suporte para o módulo Color. Outras opções Alguns temas, tais como o Acquia Slate, Acquia Marina e Acquia Prosper permitem personalizar outros aspectos: Posicionamento e largura de colunas; Tipo e tamanho de fonte
  7. 7. Temas em Drupal 7 | 18 INICIADO AVANÇADO INTERMÉDIO
  8. 8. Temas em Drupal 8 | 18 INICIADO INTERMÉDIO AVANÇADO Crie o seu tema usando interface gráfico Através de serviços de alojamento Drupal (por exemplo com o Drupal Gardens da Acquia ou o Buzzr da Lullabot), pode fazer upload dos seus elementos gráficos, escolher o layout, o esquema de cores, os elementos de estilo da página e pode mesmo usar o seu próprio CSS. http://drupalgardens.com http://buzzr.com Existem, também, aplicações Wysiwyg ou web design generators. http://www.artisteer.com 2/8
  9. 9. Temas em Drupal 9 | 18 INICIADO INTERMÉDIO AVANÇADO Como criar o seu tema Uma boa forma de aprender é modificando um tema existente. Instale um dos temas mencionados no nível anterior ou faça uma cópia de um dos temas incluídos na diretoria "themes". Usar um tema já existente e modificar: Mude o nome da diretoria para o nome do seu tema Edite os ficheiros nome-do-tema.info; styles.css; scripts.js 2/8
  10. 10. Temas em Drupal 10 | 18 INICIADO INTERMÉDIO AVANÇADO Algumas ferramentas Web Developer (Firefox e Chrome) http://chrispederick.com/work/web-developer/ Firebug (Firefox) e Firebug Lite ( IE6+, Firefox, Opera, Safari and Chrome) http://getfirebug.com/ W3C Validation Service http://www.w3.org/Status.html 2/8
  11. 11. Temas em Drupal 11 | 18 INICIADO INTERMÉDIO AVANÇADO
  12. 12. Temas em Drupal 12 | 18 INICIADO INTERMÉDIO AVANÇADO Temas base / Starter Themes Permitem começar de um ponto avançado. Muitos incluem kit inicial, resets de CSS, grelhas, settings avançados.Zen Fusion Adaptative themehttp://drupal.org/project/zen http://drupal.org/project/fusion http://drupal.org/project/adaptivetheme Outros em drupal.org mothership blueprint zentropy ...Genesis Omegahttp://drupal.org/project/genesis http://drupal. org/project/omega
  13. 13. Temas em Drupal 13 | 18 INICIADO INTERMÉDIO AVANÇADOSubstituir / Override de templates Ficheiros .tpl.php Substituir ficheiros do tema base ou do núcleo. Usar sugestões de template para casos pontuais. http://drupal.org/node/1089662 Modificar funções Usar o template.php Usar funções theme_foobar (); como nomedotema_foobar (); http://drupal.org/node/173880 Criar variáveis Usar o template.php. criar variáveis. Funções preprocess and process. http://drupal.org/node/223430
  14. 14. Temas em Drupal 14 | 18 INICIADO INTERMÉDIO AVANÇADO Gestão de layout Panels Um gestor de layout, com contextos, excelente integração com o views. http://drupal.org/project/panels Context permite expor blocos ou outros elementos de acordo com o contexto da página em questão. Trabalha com os módulos spaces e boxes. http://drupal.org/project/context DisplaySuite Permite modificar os layouts de alguns elementos do drupal, como o node, comments, search results, etc. Simples e uma excelente opção no D7. http:/drupal.org/project/ds Blockify Expõem elementos do drupal core como blocos. http://drupal.org/project/blockify
  15. 15. Temas em Drupal 15 | 18 INICIADO INTERMÉDIO AVANÇADO Markup / CSS Semantic views (integrado no Views3) Permite modificar o markup produzido pelo views directamente no interface gráfico. http://drupal.org/project/semanticviews Semantic CCK Permite modificar o markup produzido pelo módulo CCK. http://drupal.org/project/semantic_cck IE CSS Optimizer (Integrado no D7) Solução para o bug do IE6 -> 8 que não suporta mais de 31 estilos. http://drupal.org/project/ie_css_optimizer Conditional Stylesheets (integrado em alguns temas base) Permite carregar ficheiros CSS exclusivos para o IE. http://drupal.org/project/conditional_styles
  16. 16. Temas em Drupal 16 | 18 INICIADO INTERMÉDIO AVANÇADO Markup / CSS (cont.) @font-your-face Integra serviços externos de fonts, Typekit, Font Squirrel, google fonts e muitos outros. http://drupal.org/project/fontyourface Uniform Integra o jquery.uniform library para estilizar forms de forma coerente nos vários browsers. http://drupal.org/project/uniform Modernizr Integra a biblioteca javascript modernizr, permite usar CSS3 e html5 nos browsers que suportam. http://drupal.org/project/modernizr Typogrify Aplica melhorias a nível tipográfico http://drupal.org/project/typogrify
  17. 17. Temas em Drupal 17 | 18 INICIADO INTERMÉDIO AVANÇADO Criar um tema de Raiz Também é uma opção... Mas tenham em atenção o gráfico ao lado!
  18. 18. Temas em Drupal 18 | 18 INICIADO INTERMÉDIO AVANÇADO OBRIGADO! QUESTÕES? João Belchior | jbelchior@fidibiko.com | twitter @jolidog Catarina Clemente | geral@catarinaclemente.com | twitter @cvclemente

×