Abiquo Branding Admin Guide

More detailed instructions about branding

Back up the Abiquo UI

Back up Abiquo system elements: 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 and make a copy of the UI folder

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

Assign branding privileges

If the users managing enterprises are not cloud administrators, assign branding privileges in Abiquo.

In Users View, check that the users have the "Manage enterprises" and "Modify enterprise theme" privileges. See Manage Roles

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 that 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

     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

   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

   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.

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

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

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

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

   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

   service httpd restart

Activate New Themes

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

1. To change the Enterprise logo in the top left-hand corner, enter the relative path from the ui folder to the enterprise logo file, e.g. theme/blue_theme/img/abiquo_gray.png 

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

   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

   

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 you are working with