Page Comparison

This section describes how to manage themes in Abiquo.

...

Preparing branding

1. Prepare themes as described in Abiquo Branding Guide

2. Back up Abiquo system elements

...

Abiquo recommends that you perform regular backups of the whole Abiquo platform. However, it may be useful to perform the following quick backup before enabling branding.

Back up the client UI folder

1. : In addition to regular backups, we recommend that you make a quick backup of the UI before enabling branding
   Log in to a shell on the Abiquo server with a user with root permissions

   Make and make a backup copy of the UI folder

   Divclasstinycode widecode

   Code Block
   mkdir /opt/abiquo/quick_ui_backup tar cvfz /opt/abiquo/quick_ui_backup/ui_`date +%Y%m%d`.tar.gz /var/www/html/ui/

   
   

2. Optionally assign branding privileges in

...

1. Abiquo

...

In the Abiquo UI you will see the "Modify enterprise theme" privilege in the Users category on the Privileges screen. This privilege is automatically assigned to a cloud administrator, but you can also assign it to another user that can manage enterprises.

1. Log in to the Abiquo UI as a cloud administrator
2. Go to Users View
3. Click the role of a user with

   , if the users managing enterprises are not cloud administrators.
   In Users View, check that the users have the "Manage enterprises"

   privilegeCheck the box to assign the

   and "Modify enterprise theme"

   privilege to the user 

   privileges.

   Expand
   Image Modified

Edit Images

You can use these images as a guideline for the image size and type. See Abiquo Style Guide and Sample Theme Image Reference

Upload themes and logos to the Abiquo UI   

Upload

...

...

an optional default theme to style the login screen and your enterprise themes, including the image files.

Note: the abicloudDefault folder contains the predefined default theme; do not overwrite this folder or the login screen will not display

...

correctly.

1. Compress your theme folder
2. Log in to the Abiquo Server and copy your theme to theme folder
   
   • The theme folder is /var/www/html/ui/theme

   • For example, using wget from the Abiquo Server to a Linux machine

     Code Block
     wget myuser@mymachine:~/Downloads/mytheme_base_theme.tar.gz /var/www/html/ui/theme

     
     

3. Move or copy any existing theme with this name to another folder name

   Code Block
   cd /var/www/html/ui/theme mv my_custom_theme my_custom_theme_backup

   
   

4. Extract the theme (which will OVERWRITE any theme with the same name). For example, when the theme was compressed with tar and gzip

   Code Block
   tar -zxvf my_custom_theme.tar.gz

   Remember to check the file ownership and access settings, because the Abiquo Tomcat server will need to access the branding files.

Set a default theme

You can set a default theme that Abiquo will use to style the login zone and enterprises when no other theme is selected. You cannot select the default theme directly. , as well as the enterprises without themes.

• When you set a default theme, Abiquo still requires the abicloudDefault theme as before because it is the base theme. 
• You do not need to add the default theme to the list of themes in client-config-custom.json

...

• unless it will be used by tenants

To set a default theme that will persist after upgrades you can , do one of the following steps:

...

Remember to check the file ownership and access settings, because the Abiquo Tomcat server will need to access the branding files.

Edit

...

UI configuration to add new themes to Enterprise menu

1. Log in to a shell on the Abiquo server as a user with the appropriate permissions (e.g. root or sudo user)

2. Edit the client-config-custom.json file to add new enterprise themes

   Code Block
   cd /var/www/html/ui/config vi client-config-custom.json

   
   

3. Edit the file and add the default base theme and the custom themes as an element within the brackets { and }. 

   Code Block
   "client.themes": [ "abicloudDefault", "my_custom_theme" ]

   
   

   Note
   You must add abicloudDefault or the user interface will not load properly. Check your JSON file format with a JSON checker to ensure that the UI will load properly

   
   

4. Restart the Apache daemon to load files into the cache

   Code Block
   service httpd restart

   
   

Activate New Themes

To activate new themes, when you create or edit an enterprise, do these steps.

1. Log To change the Enterprise logo in to the Abiquo GUI as the user with the "Modify enterprise themes" privilege
2. Create or Edit an enterprise
3. In the Enterprise Logo fieldthe top left-hand corner, enter the relative path from the theme ui folder and name of to the enterprise logo file. For example, "rose_console, e.g. theme/blue_theme/img/abiquo_gray.png".Select a Theme
   only themes specified in the ui/config/png 

4. To change the Default theme, select a theme. Only themes configured in the client-config-custom.json file are shown

5. Click Save
6. Log out

7. .

   Tip
   If you didn't restart the Apache daemon when you copied the logo file to the server, restart it now to ensure the new logo is visible

   Image Modified

...

Users clear browser cache

...

to display new themes

All users should clear the browser cache on their machines before logging in to Abiquo again.

...

To test the new logo and theme, log in again as a user of the enterprise

...

Image Removedyou are working with