It is possible to use a custom CSS file to alter the default Design Studio styling. This is useful for imparting basic branding and identity into the Design Studio.
NOTE: InkSoft does not offer technical support for custom styling due to the variability in CSS file / code structuring. This is an advanced option and should only be used by experienced web designers / developers with advanced working knowledge of CSS who can test and validate their work.
Please take advantage of our clearly commented CSS file as a guide / starting point for custom styling. Download the template here.
Template example located here: https://goo.gl/92HP0q
If you are using custom icons / images, upload these to InkSoft's 'Store Files' area in InkSoft. This feature allows you to upload and manage custom files. Learn more about InkSoft's Store Files feature here. After uploading, you will need to copy the direct URL to the uploaded images and paste these in the custom CSS file.
Loading gif animation. Make sure to update the background image URL,
as well as the height and width of the image that you are using.
After you create your custom CSS file and have mapped the URL for all custom images, upload it to InkSoft's 'Store Files' area in InkSoft. This feature allows you to upload and manage custom files. Learn more about InkSoft's Store Files feature here. After uploading, you will need to copy the direct URL to the uploaded CSS file.
As seen below in line 6 of the Design Studio embed code, insert the URL path below to your uploaded custom CSS file. See this step-by-step guide to learn how to access the Design Studio embed code.
The path is: CssPath: 'Insert your URL to CSS file here',
The intent of this function is to control basic styling such as fonts, colors, images. See a working example here: https://www.inksoft.com/custom-design-studio/
It is possible to style the following elements in the Design Studio: