background preloader

Tools for Theming

Facebook Twitter

Dtc. Finally Drupal 7 version is out!! You will need some 3rd party javascript files to use this module. You can download them from our main site: With our module you can design your actual theme on your Drupal site by a point and click method. You can modify almost all of available CSS properties only in a few clicks. jscolor was not supported Chrome so we've updated the plugins package at our main site. Now everything is OK. Please download the update package! Some features of the module: Turn on/off the editor mode without turning of the module. Our first goal was to create a full theme generator, which allows users to download a full theme.

Tipsy. Panels Page Cache. Panels Hash Cache. This module provides a hash-based cache for Panels and other Chaos Tools powered displays. This support caching based on any combination of: Contexts (node, term, user etc)ArgumentsDrupal Path (args) (same as the Panels Page Cache Module)Full URL (including domain and query string) UsersRoles It also supports "simple" caching. If you would like to see it cache based on something I haven't thought of yet, open-up a feature request and I will likely add it.

The main advantage to using a hash-based cache is that the cache is automatically expired* when any of these items change. The other advantage is that you can cache based on the combination of *any* of the above items. . * The disadvantage is that the cache is updated not by a TTL expiration of the cache-object, but by changing the cache-id. Also of note is that it takes approximately 1 millisecond to compute the hashes for the cache (generally between 0.7 and 1.3 ms). Page Load Progress. This module will allow you to set a screen lock showing a spinner when the user clicks on an element that triggers a time consuming task.

The module will work amazingly in cases where, for example, the user submits a form that takes a long time to post and stays in the current page avoiding the submitter the chance to poke around the page while waiting. To configure the behavior of this module go to admin/config/user-interface/page_load_progress. The last field, "Elements that will trigger the throbber", takes HTML elements, classes or ids, separated by commas, and assigns the behavior when they are clicked. CAVEATS: Even though the behavior assignment is configurable, I recommend its usage only for form submits. Poshy Tip. Omega User Interface. Fit Text. About Fit Text Fit Text is a jQuery plugin to make font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element. Fit Text is a perfect choice while developing cross-platform websites (scalable for all those nifty devices and displays).

A jQuery plugin for inflating web type Need for Fit Text Imagine, how your design layout would appear to users on a nifty handheld device and to the person viewing it on a hi-resolution wide screen. Note Before using this module, make sure that Use responsive theme (such as Omega).The text should be larger. Configuration You can enter a list of jQuery selectors. jQuery("#site-name").fitText(0.8); The second configuration of the Fit Text is Compressor. $("#responsive_headline").fitText(1.2); // Turn the compressor up (text shrinks more aggressively)$("#responsive_headline").fitText(0.8); // Turn the compressor down (text shrinks less aggressively) Further info Like this?

Devsaran. BeautyTips. Backstretch. Browser class. Summary This small module helps theme-developers to deal with cross-browser compatibility. It makes easier to handle different types of non-widespread browsers just as much as it helps with using different versions of Internet Explorer. The module extends the $body_classes variable in page.tpl.php based on the enduser's browser, and platform. The module also makes a $browser_classes variable available in page.tpl.php, which stores the data in an array, this way the developer can make use of it as needed, if he does not wish to use the $body_classes variable. Supported browsers ieoperasafarichromenetscapeffkonquerordillochimerabeonexawebamayaicablynxgaleonoperamini Browser version checking The module creates version classes. ie[version]opera[version]chrome[version]safari[version]netscape[version]ff[version]konqueror[version]operamini[version] Supported platforms winipadipodiphonemacandroidlinuxnokiablackberryNetBSDFreeBSDOpenBSD Mobile detecting Token support Currently available tokens Configuration.

Panels Everywhere. Panels Everywhere is an advanced method to completely do away with Drupal's restrictive blocks system and instead use the much more freeing Panels Layout system to control how your pages look. Panels Everywhere modifies the page as it is being rendered to 'wrap' the content in a display and can even take over your page theme to do away with the need for a page.tpl.php. Doing this requires that you set up a few things properly, because Drupal is not really designed for this kind of behavior. Be sure to read the README before trying to use this module. This module requires both the Panels module, and the Page Manager module from the Chaos Tools Suite.

Themes with Panels Everywhere support The following is a non-exhaustive list of themes that are known to have support for Panels Everywhere: Got one you want to add? Project planning An official project plan is being managed via Trello to aid with getting towards a v7.x-1.0 release. Credits Currently maintained by Damien McKenna. Borealis. About Borealis Suite Borealis is a suite of modules designed to assist in the implementation and building of semantic HTML5 and responsive projects in Drupal. The first module, Borealis Responsive Images, is an integrated solution for responsive images in Drupal.

The second module, Borealis Semantic Blocks, adds a basic, more semantic block template and allows the user to choose more semantic, HTML5 block templates for each block. As more modules are needed, they will be added to this project. Borealis A selection of helper functions that come in handy for various small bits and pieces of your site. Currently contains the following functions: Render Array Block Pushes a block onto a supplied render array. AJAX Settings Save Saves the value of the triggering element to a Drupal variable. In Your Form $form['borealis_key'] = array( '#type' => 'hidden', '#value' => 'YOUR_KEY', ); On The Form Item $form['NAME'] = array( … '#ajax' => array( 'callback' => 'borealis_ajax_settings_save', ), …);

Views custom template. Version 7.x-1.0 is deprecated in favor of version 7.x-2.0 What is Views custom template? Views custom template allows you to add a template suggestion for view displays, rows and fields so you can re-use one template for multiple views This allows you to create and reuse a single template. Instead of copying (and duplicating) a template, stay DRY. Version 7.x-2.0 See documentation Version 7.x-1.0 The module extends the Views Fields display, so you can still assign fields and alter them using standard Views options: links, labels, booleans etc. Template function Views resolves which template to use via theme hooks. Template function: event_blockPreprocessors: hook_custom_template and hook_custom_template__event_blockTemplate file: custom-template--event-block.tpl.php Field name mapping Since several Views and Views displays can end up in a single template, it might contain different field names.

Backdrop. Opengrid_ui. Custom Formatters. The Custom Formatters module allows users to easily create custom CCK/Field Formatters without the need to write a custom module. Custom Formatters can then be exported as CTools Exportables/Features or Drupal API Formatters. Custom Formatters was written and is maintained by Stuart Clark (deciphered). - - Important note Changes have been made to the PHP formatters Render Array integration to correctly support multi-field values, this changes the HTML wrappers of the formatter and may affect the theming of your site.

This change will be made in 7.x-2.2 and the upcoming development releases. Features: Two different editor modes: Basic/HTML + Tokens: A HTML based editor with Token support.Advanced/PHP: A PHP based editor with support for multiple fields and multiple values.Support for: CCK/Fields fields. Required Modules: Recommended Modules: [D7] Coder (includes Coder review)Devel (includes Devel generate)[D7] Form BuilderLibraries API[D7] Token.

Simple Field Formatter.

Js

Panels Extras. What is Panels Extras? Panels Extras is a collection of plugins that extends functionality to the Panels module. Does it do x? We are actively maintaining Panels Extras to provide extended functionality for the Panels module. Please add plugin requests to the issue queue. What's inside? Currently Panels Extras includes the following plugins: Configurable Breadcrumbs Configurable Breadcrumbs provides a display pane to override the default breadcrumb. Email Panels Email CCK Field and Panels 3 Integration exposes the CCK Email field to Panels. FAQ Panels FAQ and Panels 3 Integration provides a page override for the display of FAQ terms built by the FAQ module. Menu SEO Title Menu SEO Title provides an SEO version of each menu that uses the menu item titles provided in conjunction with the Menu Attributes module. Region Pane Region Pane provides a display pane for your theme’s Block regions. Menu Node Access Menu Node Access adds a selection rule in the node template Dependencies D7 Development version.

Panels Extra Layouts. Extra Layouts for the Panels Module Panels is one of the most, if not the most, powerful modules for laying out a page in Drupal. Panels builds on CTools which is a swiss army knife for doing all sorts of elaborated things in Drupal without having to hack the drupal core. The Bottom Line This module provides a set of fixed and adaptive layouts for Panels. Fixed layouts are those that have a fixed geometry. Adaptive layouts are layouts that adapt to the content. Note that adaptive layouts differ from the the flexible layouts created via the Panels UI.

This module provides 5 two column layouts, 4 three column layouts and 2 adaptive layouts. Installation Download and install the module as usual.Now when defining a new variant or redefining the layout of an existing one you should see the new layouts in the dropdown, under the Columns: 2, Columns: 3 and a new item Adaptive.Select one of the above layouts.Proceed to add content to your liking.Done. Adaptive layouts Fixed layouts Two columns. Custom Page. Documentation A draft version of the User Documentation is now available for the Custom Page module.

What is it? Custom Page is an advanced theming tool, allowing developers to easily create pages with custom templates and maintain full control over the output (e.g. HTML). Custompage seamlessly integrates with the Context module (both versions 2 and 3) module and while Context is not required, the two work great in tandem. Features Easily attach a theming function and/or tpl.php to a URL path/pattern. How is it different from existing theming templates? Why not just use page-node-nn.tpl.php? If you created page-node-1.tpl.php that would override entire page, whereas Custom Page only overrides the "content" area, inheriting the header, footer and all other regions. The biggest point of all is that even if you created a tpl.php with just PHPTemplate's default tools, it would still fall short of the extensive feature-set Custom Page provides (see above), especially if your site is multilingual.