Skip to the content

How to change skin, logo, and favicon in Aras Innovator

It is relatively easy to customize your Aras Innovator environment. You can insert your company logo, a personal picture, or your favorite favicon. In this written tutorial, I will show you how to change skin, logo, and favicon in Aras Innovator.

 

How to do it on Aras Innovator Version 11

All customization happens in the InnovatorServerConfig.xml

<UI-Tailoring login_splash="../images/aras-innovator.svg" branding_img="../images/aras-innovator.svg" product_name="Aras Innovator" banner_url="../scripts/banner.aspx" banner_height="50"/>

 

How to do it on Aras Innovator Version 12

In V12, graphical customization is slightly more complicated.


The login screen is actually handled by OAuth and not Innovator, and once logged in ARAS, the look and feel are mostly located into CUI.

 

Reminder: As ARAS Upgrade is free for Subscribers, please do not override ARAS Images as during an Upgrade you could lose your changes.

 

 

Create your own Logos and Icons for ARAS Innovator

If you already have your Icons, login picture, and banner ready, you can skip this chapter.


We will use Free tools to create the favicon and then the banner.

 

Free tools installation

InkScape: Simply press next.

ImageMagic: For the installation, the only trick is to tick a box to deploy utilities that we will use

You can also watch the video tutorial here ⇓

Create a favicon:

Start InkScape and open an existing SVG from ARAS (best to get the right size and properties).

For the example, I started from C:\Program Files (x86)\Aras\aras.12sp18_12_DEV\Innovator\Client\images\3DViewerOff.svg

Select all content and remove it.

Design an Icon of your choice or find your company logo as SVG and copy-paste it to make it fit.

Save your design in the location of your choice


Now we need to convert our SVG to an ICO, which is a very specific type of Image. For that purpose, we use the CONVERT utility from ImageMagic

Start a CMD (WINDOWS KEY+ R) and then enter: cmd and press "OK"

Into the command Prompt, enter this command where you will modify the path of your convert.exe (You might have a different version of ImageMagic) SVG and the destination of your ICO

"C:\Program Files\ImageMagick-7.1.0-Q16-HDRI\convert.exe" -background none "C:\temp\MySuperIcon.svg" -define icon:auto-resize "C:\temp\favicon.ico"

then copy the favicon.ico and replace it into 2 folders:

  • \OAuthServer\wwwroot\images\favicon.ico
  • \Innovator\Client\images\favicon.ico

 

Create a login splash:

  1. Open InkSpace, and open the existing SVG used for the splash, you will then inherit all the right sizes and properties.
    • .\OAuthServer\wwwroot\images\arasInnovator.svg
  2. Save As the svg with the name of your choice, and empty the content
  3. You can design your own splash content or open your company logo in svg format and copy the content to yours
  4. Save your svg once the design is done

 

Create an Innovator Banner:

  1. Open InkSpace, and open the existing SVG used for the splash, you will then inherit all the right sizes and properties.
    • .\Innovator\Client\images\aras-innovator.svg
  2. Save As the svg with the name of your choice, and empty the content
  3. You can design your own splash content or open your company logo in svg format and copy the content to yours
  4. Save your svg once the design is done

 

Login Screen:

To change the login screen, you need to manually edit a configuration file.

.\OAuthServer\OAuthServer.config

 

Around lines 20 (content of this file can differs between version) update the path to your splash and background picture.

<add key="ProductName" value="Aras Innovator"></add>

<add key="LocalAuthenticationDisplayName" value="Aras Innovator"></add>

<add key="LogoUrl" value="~/images/arasInnovator.svg"></add>

<add key="BackgroundImageUrl" value="~/images/loginBackground.jpg"></add>

You can also rename the title that will appear in your internet browser by changing the value of ProductName and LocalAuthenticationDisplayName.

 

Innovator banner logo:

  • 1. Login as admin / root
  • 2. In TOC, go in Administration / Configuration / Client Presentation
  • 3. Search without entering any criteria, only one result will appear
  • 4. Open the "Global" and then click on the "Global" link under "Presentation"
  • 5. Into the TAB Command Bar Section, change the Search from Hidden to "Simple"
  • 6. Enter the search critera in column "Name": com.aras.innovator.cui_default.mwh_header
  • 7. Search and open the only result
  • 8. Once com.aras.innovator.cui_default.mwh_header form is opened, in TAB "Command Bar Item" change the Search from Hidden to "Simple"
  • 9. Enter the search critera in column "Name": com.aras.innovator.cui_default.mwh_header_logo
  • 10. Search and open the only result
  • 11. Edit the Item and scroll down into the form to change the "Image" and select the one you prefer

About the author

Damien Destrez

With a passion for PLM solution architecture and by finding the right solution to business-related issues, Damien Destrez has been working as a PLM solution architect for more than 10 years. Always focused on customer needs, Damien blogs about technical solutions and how to optimize your PLM software to fit your environment.

comments powered by Disqus