Theme: Modifying an Akumina Foundation Theme - akumina/AkuminaTraining GitHub Wiki
Applies to
Akumina Foundation 3.3.0.0 and above
Overview
The Akumina framework includes a number of theme css files, which determine the color of most elements within the site. Modifying the theme of a site is a simple matter of modifying the corresponding theme CSS file.
Walkthrough
In the following example we will modify the theme of a Akumina Foundation Site.
Our current site has a theme that casts most objects in a shade of orange. However, we want to change the top header to black.
First, we need to determine what theme file the site is using. We will need to navigate to the DigispaceConfigurationIDS_AK list and find the Value of the Theme row. In this case the Theme value is orange so we will need to modify the orange.css file.
Next, we will navigate to Style Library/DigitalWorkplace/CSS/themes and download orange.css
Next, open orange.css in an editor and replace the .ak-header block with the following. Then save your file as custom.css. Any custom theme changes should be placed in the custom.css file, as that is an upgrade friendly file.
.ak-header {
background: #000000;
position: relative;
}
Drag and drop custom.css into Style Library/DigitalWorkplace/CSS/themes. Publish it.
Updating Akumina Foundation Configuration Settings
Navigate to the Deployment Manager app within AppManager. Select the Digital Workplace Foundation Site. Select the action Update Configuration Settings. Select the Theme Custom. Click Update.
Navigate back to your home page and press CTRL + F5, which will refresh and clear the cache at the same time. Your customized theme will show.
References
See the following articles for more details on Theming: