Check your version

This video covers a topic in Drupal 7 which may or may not be the version you're using. We're keeping this tutorial online as a courtesy to users of Drupal 7, but we consider it archived.

Translating a design into a Drupal theme

Video loading...

Join Drupalize.Me to watch this video

Join today and gain instant access to our entire video library.

Log in Sign up
  • 0:08
    Hi, my name is Michelle Lauer,
  • 0:09
    and in this chapter we're going to talk about
  • 0:12
    design to theme strategies.
  • 0:13
    There are really 2 ways that you can approach this.
  • 0:17
    The first one is to utilize a base theme
  • 0:20
    and adjust the HTML and CSS where needed
  • 0:24
    to match your PSD or your mockups that your designer has given you.
  • 0:28
    The other way is to have your design team
  • 0:31
    go ahead and create the HTML, CSS, and JavaScript
  • 0:35
    necessary to render their designs.

Translating a Design into a Drupal Theme


This video goes through some of the strategies for translating a design into a Drupal theme. We talk about the two approaches of adding the HTML to an existing Drupal theme template vs. inserting dynamic variables into the HTML provided by our designer. Throughout this video, we're going to be assuming that our designer has delivered the full HTML, CSS and JavaScript to us, and we'll be adding in the dynamic variables. In this process we start to look at the design and start to break it up into it's component Drupal parts and start to strategize for how to build out the site and implement the design..

Log in or sign up to download companion files.
Additional resources: