Contact Us
If you would like to add Media and Cascading Style Sheets (CSS) to your Module UI, you will need to define a place to store the files.
Creating the Aux Directory
Right-click on the Module's name, the Module being the one with the UI. Choose: “Store in own Aux Directory”. This creates a folder with the Module name inside the project folder, right next to the “.avp” file.
To go to the new Directory, Right-click on the Module's name again and choose “Show Aux Directory in Explorer”.
Inside the folder, you will find the “html_root” folder. You will want to drop all your content (Images, Videos, CSS files) into this folder which can then be accessed by Elements in the UI and used for its CSS. The “main.json” inside the folder holds the data of the Module used to help reference what files are used in the "html_root" folder
Example Uses
Here are some examples of how the Aux Directory can be used:
Calendar Element
The Calendar Element requires an Aux Directory to save the Event data input into the Element. This way the information is not reset after refreshing and will remain present until manually changed by the user.
The Element will display if the Module it is on does not have its own Aux Directory:
Image and Video Player
The Image and Video Player Elements allow you to select an image and a video respectively to display in the UI. The dropdown of options in the Element's Settings will populate with all media found in Aux Directory/html folder.
Warning
The Video Player Element has some caveats, it will only display the video in the Browser, not in the Pixera Inspector UI tab. It will also not play back just any Video format, only codecs supported by the web, such as H264, will play back in the Element.
Global Style Sheet
CSS files can be put into the Aux Directory to then be used for changing the styling of the UI Pages and Elements. Please take a look at this article for more information: CSS Styling In Control Module UI's.
PIXERA 2.0.223 | 16. December 2024 | CL