Before you start..
- Install (and configure) Drupal.
- Install the LESS CSS Preprocessor module
Installation via command line using Drush
- Download Groundwork:
drush dl groundwork
- Clear the cache:
drush cc all
- Create your custom theme. For this example, we name it Philippine Sea with machine name philsea:
drush groundwork 'Philippine Sea' philsea
- Enable and set your new theme philsea as default.
drush en philsea --yes && drush vset theme_default philsea
That’s it! See «drush help groundwork» to view advanced options.
Manual installation
- Download Groundwork from https://drupal.org/project/groundwork
- Extract the downloaded file and place the groundwork folder in your Drupal installation under one of the following locations:
sites/all/themes
sites/default/themes
sites/example.com/themes
Please check Drupal documentation to learn the differences of these folders: https://drupal.org/getting-started/install-contrib/themes - Copy the folder CustomWork (found inside the Groundwork folder) to the same folder as where you extracted Groundwork.
For example:
sites/all/themes/groundwork
sites/all/themes/CustomWork - Rename the folder CustomWork to the desired machine name of your new custom theme. For example: philsea
sites/all/themes/philsea - Inside the ‘philsea’ folder, rename CustomWork.info.txt to the same name of the folder and remove the ‘.txt’.
For example: philsea.info - Edit philsea.info and find name = CustomWork This is the human-friendly name of your theme. Change it to the name of your theme.
For example: name = Philippine Sea - Edit app-settings.css.less found inside the custom directory of your new theme, and define the location of your theme.
For example: @themeDirectory: sites/all/themes/philsea; - In the browser, log in as admin in your Drupal installation and go to Administration > Appearance > List: http://example.com/admin/appearance/list. Click the «Enable and set default» link on your new custom theme.
Note: It is not necessary to enable Groundwork but it must be present.
Alternative Installation
Use an existing sub-theme. Easy design development:
- Look for a Groundwork sub-theme that looks the nearest you want to achieve with your site design. Download and install it.
- Go to the custom folder of the subtheme and rename all 5 files that end with css.less.txt to css.less. For example: app-settings.css.less.txt to app-settings.css.less
- Customize away!
Further Reading
- Learn more about sub-theming: http://drupal.org/node/225125
- Learn more about general Drupal theming in the Drupal theme guide: http://drupal.org/theme-guide
Wrong information?
If there are mistakes in this documentation page, or you think you can make it better, please submit an issue at the Groundwork project page on Drupal.org with component Documentation.
Table of Contents
- Getting started
- Settings
- Variables
- Mixins
- Bundles
- Base
- Layout
- Component
- Gwikons (Icons)
- Changelog
- Sub-themes
- HowTo’s
Inspiration & credits
Groundwork created and maintained by John Noceda.
Special thanks to all the popular CSS, LESS, SCSS frameworks and boilerplates out there for the inspiration and great ideas
Groundwork Front-End Framework Licenses
Released under the GNU General Public License, version 2.
Fonts included with Groundwork are released under the SIL Open Font License (OFL) version 1.1
Documentation License
Documentation is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
Theme powered by Groundwork Front-end Framework for Drupal