Design and Prototyping for Drupal
Format: PDF / Kindle (mobi) / ePub
Itching to build interesting projects with Drupal, but confused by the way it handles design challenges? This concise guide helps small teams and solo website designers understand how Drupal works by demonstrating the ways it outputs content. You’ll learn how to manage Drupal’s output, design around it, and then turn your design into a theme.
In the second of three volumes on Drupal design, award-winning designer Dani Nordin takes you beyond basic site planning and teaches you key strategies for working with themes, layouts, and wireframes. Discover how to use Drupal to make your vision a reality, instead of getting distracted by the system’s project and code management details.
* Learn strategies for sketching, wireframing, and designing effective layouts
* Break down a Drupal layout to understand its basic components
* Understand Drupal’s theme layer, and what to look for in a base theme
* Work with the 960 grid system to facilitate efficient wireframing and theming
* Manage Drupal markup, including the code generated by the powerful Views module
* Use LessCSS to organize CSS and help you theme your site more efficiently
that it’s a first decision that’s kind of already made for you; you don’t have to feel like, “Oh, did I screw up?” You’re rarely going to say, “I picked a width of 920 pixels for my website. I hope I don’t regret this in a year.” Typesetting is a really good analogy for this kind of thing, because it’s why grids were developed back in the day. You had to create grids to set your type, because you couldn’t build actual typesetting machines for each book. You had to develop something that you
there, we go back into the Manage Display screen for our Event content type, and click on the gear button to the right of the Image field. Select our new image style from the Image Style drop-down menu and hit Update (see Figure 12-13). Figure 12-13. Selecting our new image style Now, if we refresh the page, we can see our results (Figure 12-14). Now it’s time to start styling this puppy. After updating the styles for field labels, moving stuff around with page titles, and removing
to set up a view of Content/Nodes of the Event content type, NOT a view of Users or Profiles. This is where I got stuck; intuitively, you would think that Users and Profiles would be basically the same thing, that both would be available to a View, and that you could somehow use the User Reference field as a way to pull that data into your view. As it turns out, that’s sort of what happens, but you have to go about it in an odd way. So, we start by setting up a View, of Content of the type
things just work better if you go with the system rather than against it. Understanding the system by actually creating stuff within Drupal is one of the best ways to figure out how to work with it. This doesn’t mean that you can’t innovate or create design that is truly beautiful. But the point of good design isn’t reinventing the wheel; it’s partially about incorporating design patterns that have been shown to work well, and partially about finding areas where you can improve an experience
replace other text. So, for example, I can create a custom class for each instance of the Taxonomy Term Name field, by inserting a token for the name into the CSS class for that field. Creating the token was a little bit tricky. The first step is find the actual token; to do this, I had to pretend I was rewriting the field. If you click on the name of any field in your Views settings, you’ll see a few drop-down areas that let you set up different parameters for the field. With the Image field,