Installing Cosmic on your Drupal Website

Prerequisites

Installation Procedure

  • Download the UO Cosmic theme.
  • Extract the archive to your sites/all/themes directory in your Drupal install.
  • Log in as administrator on your Drupal site and go to admin/appearance in your Drupal install. Select enable and set default under the UO Cosmic theme to start using the theme.

Installing the UO Banner and Footer module

If you currently do NOT have the UO Banner and Footer module installed on your server (centrally hosted websites in the UO vanilla platform already have it installed), you can install it by doing the following:

  • Download the UO Banner Module. NOTE: You must be on the campus network or using UO VPN to access the download.
  • Extract the archive to your sites/all/modules directory in your Drupal install.
  • Log in as administrator and go to admin/modules, select the checkbox next to "UO Banner and Footer" and click save.

Using and Modifying Cosmic on Drupal

As with using other Drupal themes, it's very likely that you might want to tweak or modify Cosmic to better fit the needs of your individual site. Cosmic provides a number of techniques to allow you to adjust it for your site's needs.

Add Site-Specific CSS

Cosmic searches for a file called cosmic_overrides/style_overrides.css in the main site directory. You can use this file to create site-specific overrides without modifying or using a nonstandard version of the Cosmic theme.

Subtheme Cosmic

Cosmic can be subthemed, allowing you to make your own theme that uses Cosmic as a base while still maintaining control over full theming capabilities and allowing for easy upgrades.

  1. Setup the location for your new sub-theme.

    Copy the STARTERKIT folder out of the cosmic/ folder and rename it to be your new sub-theme. IMPORTANT: The name of your sub-theme must start with an alphabetic character and can only contain lowercase letters, numbers and underscores.

    For example, copy the sites/all/themes/cosmic/STARTERKIT folder and rename it as sites/all/themes/foo.
     
  2. Setup the basic information for your sub-theme.

    In your new sub-theme folder, rename the STARTERKIT.info.txt file to include the name of your new sub-theme and remove the ".txt" extension. Then edit the .info file by editing the name and description field.

    For example, rename the foo/STARTERKIT.info file to foo/foo.info. Edit the foo.info file and change "name = Cosmic Sub-theme Starter Kit" to "name = Foo" and "description = Read..." to "description = A Cosmic sub-theme".

    Then, visit your site's Appearance page at admin/appearance to refresh Drupal's cache of .info file data.
     
  3. Edit your sub-theme to use the proper function names.

    Edit the template.php and theme-settings.php files in your sub-theme's folder; replace ALL occurrences of "STARTERKIT" with the name of your sub-theme.

    For example, edit foo/template.php and foo/theme-settings.php and replace every occurrence of "STARTERKIT" with "foo".

    It is recommended to use a text editing application with search and "replace all" functionality.
     
  4. Set your website's default theme.

    Log in as an administrator on your Drupal site, go to the Appearance page at admin/appearance and click the "Enable and set default" link next to your new sub-theme.

Known Issues

ISSUE: Black background in WYSIWYG editors (ckeditor etc)
SOLUTION: Edit the WYSIWYG profile. Define CSS Path: %t/css/editor.css if using UOBanner Module additionally add: /sites/all/modules/uobanner/css/uobanner-styles-responsive.css