How-to wrap your CSS Injector files into a new Zen sub-theme

I frequently use a 3rd party designer to help with the tedious task of going from PSD to final theme. If you haven't realized it yet, but alot of designers have problems setting up a local MAMP install w/ drupal in which to fuck with css. To deal with this without giving the designer any command-line access, my shop uses what we call CZI on all drupal installs. This stands for CSS Injector, Zen theme, IMCE, and allows a designer to upload images and apply css rules to a development site they have been given permissions for on the theme, Zen, that provides all the classes and ids anyone would need.

After my shop, the designer, and the client are satisfied, CSS Injector and it's external files become a weight and need to be removed. Below I detail the process of using Zenophile (http://drupal.org/project/zenophile) to create a zen subtheme in which to wrap up all your CSS Injector files:

Create a subtheme using Zenophile

  1. Enable module Zenophile
  2. create a new zen subtheme (site building > themes > create zen subtheme)
    • name appropriately according to site url
    • set site directory to installs folder unless you want it available to other installs
    • create a fresh css file
    • Submit (you may need to chown the target directory to have appropriate permissions)
  3. disable module zenophile
  4. manage blocks for new theme (site building > blocks > list > newtheme)
    • save each block individually to have titles set appropriately
  5. Duplicate theme settings (site building > themes > configure > zen & newtheme)
    • make sure your newtheme has the exact same settings as zen
    • pay special attention to logo and favicon paths
    • save theme settings

pack up and move css injector files

  1. merge all css injector files ( site configuration > css injector )
    • copy all css injector files into single file
    • delete originals, leaving you with one merged file
  2. copy content of merged file into newtheme-fresh.css
    • search and replace any filepaths in css code

switch themes

  1. set newtheme as primary (site building > themes)
  2. remove last css_injector file (site configuration > css injector)
  3. test site

cleanup

  1. disable module css_injector
  2. uninstall modules zenophile and css_injector

Peace out and remember to get a good lunch.

Comments

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

Thanks for the CZI post, I

Thanks for the CZI post, I dig the acronym. Cleaning up after CSS injector and wrapping your work into a Zen theme is a process I have found messy. Your post is my new process.

Post new comment

  • Allowed HTML tags: <em> <strong>
  • Lines and paragraphs break automatically.

More information about formatting options

Image CAPTCHA
Enter the characters shown in the image.