1 of 19

Slide Notes

DownloadGo Live

Drupal Theming Tips and Tricks

Published on Nov 20, 2015

No Description

PRESENTATION OUTLINE

DRUPAL THEMING TIPS AND TRICKS

What should i use?

Zen, Omega or new theme?
Photo by Stéfan

Zen

  • Sass/Compass
  • Mobile-first grid design
  • HTML5
  • Respond.js
  • Zen Grids, 960.gs

Should I use OMEGA 3 or 4?

  • Omega 3 if you want to create layout in backend
  • Omega 3 if you like 960.gs
  • Omega 4 if you like SASS
  • Omega 4 will work in Drupal 8
Photo by Leo Reynolds

MY CHOICE IS NEW THEME FROM SCRATCH

Photo by JD Hancock

How Can i start?

  • Manually
  • Use yeoman generator - "Generator-drupaltheme" or other available
  • Or create your own generator
Photo by Louis Abate

What's Yeoman? (yeoman.io)

  • yo scaffolds out a new application, writing your configuration
  • Grunt and Gulp are two popular build systems
  • Bower and npm are two popular package Managers
Photo by JD Hancock

gruntjs.com

  • Compiling (SASS/LESS/STYLUS ....)
  • Linting (JS/CoffeeScript)
  • Uglyfying (JS/CSS...)
  • Optimization (Images, SVG)
  • Live reloading

Bower.IO

  • html5shiv
  • Grids
  • Normalize
  • Sliders

Preprocess Grids better than Twitter Bootstrap and other frameworks

Photo by markkilner

My suggestion in susy grid

Photo by JD Hancock

Contact info