1.1 Software requirements for custom styling
To change the theme colors (i.e. the styling) of your Digizuite™ Media Manager (MM), some requirements need to be met.
The requirements are as follows:
- NodeJS LTS v6.9 or higher (https://nodejs.org/en/download/)
- Yarn v0.19 or higher (https://yarnpkg.com/en/docs/install)
Once these have been installed, you should be able to start building your new custom CSS files.
1.2 Enabling live editing
...
To enable editing for your MM, you have to live up to the following requirements
- The software requirements above must be in place
- The source files must have the postfix "include source" and be a running web site
When these things are in place, access your MM's site files and locate web.config.
...
(i.e. live reload) (optional)
Some prefer to see their changes to the color variables appear in an MM when editing the colors.
Please be advised. that this is not strictly necessary, and that you can entirely skip this step, if you want to do it manually instead. Doing ti manually, will take 1 minute longer every time you have to build → Find the CSS → Upload the MM.
By following the following steps, you enable a local MM on your computer, to automatically receive the colors you choose for your MM.
- First off, you need to have a MM with the "include source" postfix in an unzipped state.
- Have an available DC - possibly a client's DC (remember, uploading something to it will appear in the customer's DC and MM)
- Host the "include source" MM from your computer via IIS, and hook it up to the DC mentioned in the previous step (you hook it up via the MM's web.config file).
- Edit the MM's web.config as shown below:
Change
Code Block | ||
---|---|---|
| ||
<add key="UseDist" value="true" /> |
...
Now all your changes to the files "style_overwrites" and the "variables.less" (found in the "MP2" folder), will instantly show up in your local MM upon saving the files. (Meaning that you'll not have to build the entire thing manually)
Info | ||
---|---|---|
| ||
The original variables file is located in ..\[your site's name]\MP2\src\app\mp2\layout\less. Configuring in this will overwrite the default colors supplied to you by Digizuite. It is not recommended to never edit this original file! | ||
Info | ||
| ||
When you're done live editing, you may choose to "flip back the switch" on the UseDist value you changed to be "false" when you started editing. It is, however, not recommended to use the "include source" of a MM, as it can be considered to be more "bulky". Therefore, just copy the main.css file you've generated into a non-"include source" build of the MM. |