Over the past few months we've been hard at work on a new version of Skinr. I'm writing to tell you about the awesome new features, and to request your help in testing them so we can iron out any bugs and release!
First things first.
There are lots of changes in the new version. Backup your entire site before doing anything. It is strongly recommended that you do NOT use this on production sites at this point.
Installation
Download the following modules:
- jQuery UI - 6.x-1.3: You'll need to download jQuery UI manually. At the time of this writing the latest version is 1.7.2, which you can download here. After downloading: unzip, rename the directory to jquery.ui, and place it inside the jquery_ui directory. Make sure you do this before attempting to enable the modules.
- jQuery Update - 6.x-2.x-dev. This gives you jQuery 1.3.2.
- Skinr - 6.x-2.x-dev or DRUPAL-6--2 in CVS.
- Dialog API - 6.x-1.x-dev
What's new?
Modal Skin Configuration
With the help of the jQuery UI, Dialog API module, and Contextual Links (Drupal 7 module), we've implemented a pretty cool way to edit Skinr settings.
Each Skinr-enabled element contains a "cog" icon that triggers a link to edit the current skin. Clicking that link opens a jQuery UI Dialog containing the Skinr settings form. It can be moved, resized, and changes are immediately applied on save without having to reload the page.
Page Rules
Page rules allow you to use Skinr to add body classes to your page(s) based on user role, path, or PHP code, just like the block visibility settings.
They can be used to do things like: set a container width for grids, define sections of a site, change font size/face, background colors, etc.
If you've used the CSS Injector module, you'll notice the UI is very similar. That's no mistake. The idea was shamelessly stolen :D
Improved "features" functionality
Skins can now target more specific subsets of hooks. Instead of restricting a skin to just block, you can specifically target the module name:
skinr[skin_name][features][] = block_menu
skinr[skin_name][features][] = block_menu_blockSee this issue or the documentation for details.
Ability to add JavaScript/CSS files per option
Files can now be specified on a per option basis. This is detailed in the documentation, and shown in the packaging example below.
Package-able Skins
You no longer need to define all of your skins in your theme's .info file. Skins can now live in their own directories (think micro-themes), and can be shared across a multisite installation. An example of what this looks like is as follows:
Directory Structure:
sites/all/skins/dropdown
sites/all/skins/dropdown/dropdown.info
sites/all/skins/dropdown/css
sites/all/skins/dropdown/jsNote: This works just like regular modules and themes do: sites/all/skins, sites/x/skins and sites/x/themes/x/skins are acceptable locations for packaged skins to reside.
dropdown.info:
name = Dropdown Menus
core = 6.x
version = 1
description = This style will apply Dropdown menu styles to blocks containing menus. Choose either vertical or horizontal style.
skinr[dropdowns][title] = Dropdown Menus
skinr[dropdowns][type] = select
skinr[dropdowns][description] = Select a vertical or horizontal dropdown menu.
skinr[dropdowns][features][] = block_menu
skinr[dropdowns][features][] = block_menu_block
skinr[dropdowns][stylesheets][all][] = css/dropdown.css
skinr[dropdowns][scripts][] = js/hoverIntent.js
skinr[dropdowns][options][1][label] = Horizontal
skinr[dropdowns][options][1][class] = dd-vertical
skinr[dropdowns][options][1][stylesheets][all][] = css/dropdown-vertical.css
skinr[dropdowns][options][1][scripts][] = js/dropdown-vertical.js
skinr[dropdowns][options][2][label] = Vertical
skinr[dropdowns][options][2][class] = dd-horizontal
skinr[dropdowns][options][2][stylesheets][all][] = css/dropdown-horizontal.css
skinr[dropdowns][options][2][scripts][] = js/dropdown-horizontal.jsThe .info syntax remains the same, but this allows you to remove some cruft from .info files and easily share them across sites and with the Drupal community!
Administration Listing
In addition to the recently added Import/Export functionality, Skinr now contains a quick listing of where Skinr is in use on your site, with links to edit and delete the skins settings.
Documentation
Documentation is now available in the module thanks to the awesome Advanced Help module. It contains fully updated documentation, so please check it out as opposed to visiting the docs from the project page, as those are only applicable to the 6.x-1.x version.
Skinr & Skinr UI
Skinr has been split into 2 modules: Skinr and Skinr UI. The idea is that once you are done configuring skins for a site, disabling Skinr UI will eliminate some of the UI cruft that is no longer needed.
Storage
In the first version of Skinr, the data was stored in the variables table. Each theme had it's own variable called skinr_themename where all the data was stored. The new version creates two of it's own database tables: skinr & skinr_rules.
So, that's it... and now we need your help to test it all out!
Please jump in wherever you think you can help with (feedback, bug reports, patches, etc). Here are the open issues for the new version: