Viewing posts tagged Theming

Release Day: Our Drupal 8 Theming Guide

Today, we're super excited to publish our Drupal 8 Theming guide, a collection of tutorials that will teach you everything you need to know to create amazing Drupal 8 themes. We've put hundreds of hours into researching, digesting and understanding the Drupal 8 theme system. We've poured over the existing documentation and helped to update it whenever we could. We've read the code that makes it all possible, we've dissected core and contributed themes, and talked with front-end developers at Lullabot about their experiences, in order to learn about best practices and unique challenges. And then we boiled it all down into the ultimate Drupal 8 theming guide.

Release Day: Getting Started with Responsive Web Design in Drupal

Today we kick off a new series design to get you started with responsive web design in Drupal. We'll take a fictitious site to use as our case study, The Anytown Farmers Market. This site was built using the Drupal theme, 960 Robots, a theme based on a 960px grid and designed for the desktop. (You might recognize this theme from our series on theming).

Twig Filters: Modifying Variables in Drupal 8 Template Files

Something that's super fun about my job is that occasionally I get tasked with things like, "Learn how Twig works so you can tell us how it fits into our curriculum plans.". And I get to spend some time exploring various new features in Drupal 8, with an eye towards being able help explain them.

Controlling CSS Classes with the Classy Theme in Drupal 8

You may have heard some news about the fact that a new theme has been added to Drupal, named Classy. But what kind of theme is it exactly? Is it a pretty new look for Drupal 8? Well, no. You will still see Bartik as the default theme on your Drupal 8 site, so why another theme? Classy is a new base theme in core, which Bartik and Seven will then use as their bases. The idea here is to provide more flexibility to themers when it comes to choosing default CSS classes.

Including Image Styles with Your Drupal 8 Theme

One of many new features in Drupal 8, made possible by the configuration management system, is the ability to add a default image style to your theme, instead of needing to use a module in tandem with your theme, or creating the image style by hand. Here's a look at working with this new feature in Drupal 8.

Our Favorite HTML and CSS Resources

You want to learn HTML and CSS, or maybe you just need a refresher on the current state of web technology—where should you start? This is a question we get asked a lot at Drupalize.Me. Our theming and module development videos often assume that you're familiar with basic HTML and CSS, so here is a list of our favorite resources.

Let's Debug Twig in Drupal 8!

When I am theming a Drupal site, I need to know which variables are available on a template file. In Drupal 8, the template engine is Twig, so we’re going to need to know a little bit of Twig to make this work. So, if Twig is totally new to you, don’t worry. Today, you’ll learn some Twig!

Release Day: Finishing Our Theme

This week we wrap up the new theme we've created in the PSD to Drupal Theme series by getting it installed and enabled on our site. We'll double-check our components matching up with our Drupal elements to make sure the theme looks right. Then we spend some time reviewing the work we've done, as well as cover some more topics you may want to look into to take your theme even further.

With this all finished up, next week we'll be taking a look at the Acquia Cloud, before heading into our Working with Media in Drupal 7 series.


Release Day: Create a New Theme

This week in our PSD to Theme series we are getting into the nitty-gritty and creating our new theme in Drupal. We start off by getting the .info file set up properly and then add our style guide stubs to work with. Then we build our page.tpl.php file for the structure and layout of our pages. With all of that in place we'll finish up by adding our site-wide elements, like images we need from when we sliced up our PSD.

Release Day: Prepping Drupal for Your Theme

This week, we continue the journey from PSD to Drupal Theme as Emma Jane Westby shows us how to prepare a Drupal site for our theme by generating sample content, customizing image styles, creating and placing blocks, and creating a useful file structure for our new base theme.

Next week, we'll begin building out theme files by preparing a .info file, incorporating our style guide into the page.tpl.php file, and establishing a page layout structure in page.tpl.php.

Release Day: CSS Prep and Drupal Elements

This week we're chugging along with our PSD to Drupal Theme series, with a look at getting our CSS system setup and figuring out our Drupal elements for theming. Now that we have a style guide, we want to start stubbing out the CSS files we'll use to represent it with our grid framework, and then we'll get our layout rules into place. With the CSS basics in place we're going to run through creating our Drupal element checklist to make sure we know which design components map to which Drupal pieces. This will set us up with a good foundation to begin setting up the site for theming.

Next week we'll continue with the Drupal site-building by getting the elements into place that we'll need. We'll be configurig things like image styles and blocks for the site.

Free PSD to Theme Webinar

In 2008 I started on my big Drupal theming adventure by co-authoring Front End Drupal with Konstantin Käfer. Since that time thousands of people have learned Drupal theming through this book, and my presentations and workshops. My most popular workshop, PSD to Theme, is now available as a video lesson series here at Drupalize.Me. To celebrate the series, I'll be giving a free webinar at Acquia highlighting the techniques covered in this new learning series. This webinar is an update on the extremely popular webinar I gave back in 2011 (over 1800 people registered for that one!). The design is the same, but the underlying technologies and strategies have been updated for today's web.
In this webinar I'll cover: