fpafi/tl open source^ Drupal 6 Theming Cookbook great-looking Drupal themes Over 100 clear, step-by-step recipes to create powerful,

Size: px

Start display at page:

Download "fpafi/tl open source^ Drupal 6 Theming Cookbook great-looking Drupal themes Over 100 clear, step-by-step recipes to create powerful,"

Lindsey James
6 years ago
Views:

1 Drupal 6 Theming Cookbook Over 100 clear, step-by-step recipes to create powerful, great-looking Drupal themes Karthik Kumar fpafi/tl open source^ I I MV 1 X I I community experience distilled PUBLISHING BIRMINGHAM - MUMBAI

2 Preface 1 Chapter 1: Drupal Theme Basics 7 Introduction 7 Installing and enabling a theme 10 Uploading a new logo 12 Uploading a new favicon 14 Adding a slogan to the theme 16 Allowing users to choose from multiple themes 18 Displaying a different theme for administration 20 Adding an existing block to the theme 21 Adding a custom block to the theme 23 Displaying a block only on the front page 25 Controlling block visibility based on user role 27 Controlling block visibility based on node type 28 Chapter 2: Beyond the Basics 31 Introduction 31 Understanding the anatomy of a theme 32 Creating a sub-theme based on a core theme 34 Overriding base theme elements in a sub-theme 36 Changing the screenshot image of a theme 40 Including a CSS file in a theme 41 Enabling CSS optimization 43 Creating the mysite module to hold our tweaks 46 Adding a CSS file from a module 47 Displaying a different theme for each day of the week 50 Creating a fresh look using the color module 52

3 Chapter 3: Custom Themes and Zen 55 Introduction 55 Clearing the theme registry 57 Creating a theme from scratch 59 Creating myzen, a Zen-based theme 61 Choosing a CSS layout for myzen 65 Overriding Zen template files with myzen 66 Adding a custom region to myzen 69 Adding a background image to the theme 71 Adding a conditional stylesheet in Zen 74 Modifying myzen's theme settings 76 Chapter 4: Templating Basics 81 Introduction 81 Changing the layout of a page using page.tpl.php 83 Customizing the appearance of a particular node type 87 Customizing the appearance of a specific node 90 Theming made easy using the Devel module 93 Theme overrides using the Theme developer module 95 Listing all available variables in a template file 99 Displaying the profile name instead of a username 101 Styling the site maintenance page 107 Chapter 5: Development and Debugging Tools 109 Introduction 109 Finding the right function to use to theme an object 111 Analyzing variables using the Devel module 114 Generating sample content using the Devel generate module 117 Resetting the default theme manually 120 Live preview with Web Developer 122 Validating HTML and CSS using Web Developer 124 Turning off JavaScript in the browser 127 Disabling CSS in the browser 130 Inspecting elements and debugging CSS using Firebug 132 Diagnostic logging of JavaScript using Firebug 135 Chapter 6: Advanced Templating 139 Introduction 139 Adding a variable to all node templates 141 Deleting a variable from the page template 144 Adding a custom theme setting 146 Hiding all regions on a page 148 Displaying the last updated date instead of the submitted date 151 -DD

4 Module-based variable manipulation 154 Optimizing using hook_preprocess() 157 Displaying the date field in calendar form 161 Chapter 7: JavaScript in Themes 165 Introduction 165 Including JavaScript files from a theme 167 Including a JavaScript file only for certain pages 169 Giving the username textfield keyboard focus 172 Exporting a variable from PHP to JavaScript 175 Adding default text to the search textfield 177 Displaying comments in compact form 180 Adding column-sort functionality to tables 183 Minimizing and maximizing blocks using JavaScript 187 Chapter 8: Navigation 191 Introduction 191 Adding a menu to our theme 192 Adding content pages to the menu 195 Styling the primary links menu 196 Contextual submenus using the Menu module 199 Adding a drop-down navigation menu 202 Customizing breadcrumbs in Zen-based themes 206 Hiding node links using CSS 208 Styling all external links in a page 210 Styling the Drupal pager 212 Chapter 9: Form Design 217 Introduction 217 Finding the form ID of a form 218 Changing the height of a textarea 221 Turning off the resize feature for textareas 223 Replacing Drupal's textareas with a WYSIWYG HTML editor 226 Reordering fields In a form 228 Replacing a standard submit button with an image button 232 Styling the comment form 235 Using a fieldset to group fields 238 Theming form elements 243 Adding class attributes to form elements 246 Chapter 10: Customizing CCK 251 Introduction 251 Creating a custom node type 252 Hiding fields and labels during display 257 rnn-

5 Displaying fields together using field groups 260 Theming CCK content using hook_nodeapi() 263 Theming a CCK field using a template file 266 Adding image support using the ImageField module 271 Using ImageCache to scale and crop images on the fly 273 Adding lightbox support for images 277 Chapter 11: Views Theming 281 Introduction 281 Creating a simple view 283 Styling a node listing using a grid display 289 Merging columns with the Views table style plugin 295 Embedding a view inside a node template 301 Overriding the Views table style plugin 305 Adding a class to a Views style 313 Creating a custom Views style plugin 317 Chanter 12: Rapid Layouts with Panels 325 Introduction 325 Using Panels to create a front-page layout 327 Embedding content in a panel 331 Styling a panel with rounded corners 335 Creating custom styles with the Panel stylizer module 338 Changing the layout of a panel 344 Creating a custom panel layout 347 Replacing the site contact page with a panel 353 Embedding tabbed panels in blocks 356 Index 361 -QD

Xerte. Guide to making responsive webpages with Bootstrap

Xerte. Guide to making responsive webpages with Bootstrap Xerte Guide to making responsive webpages with Bootstrap Introduction The Xerte Bootstrap Template provides a quick way to create dynamic, responsive webpages that will work well on any device. Tip: Webpages