Custom styles and scripts

This is part of Docxpresso advanced functionality that it is only thought for the tech savvy.

It is possible within the Docxpresso processing interface to include:

  • Custom CSS styles that override the default general settings.
  • Custom JS scripts that may add interactivity or functionality to a particular template beyond the one offered from Docxpresso out of the box.

Custom CSS styles

By clicking on the "code" button located in the top left corner of the template processing interface a dropdown menu will open offering the "Custom CSS styles" option. By clicking on it a pop up will open in which you could include your custom CSS styles.

For example by simply typing: .h5p_varspan {font-weight: bold} all Docxpresso variables will show up in bold typeface in the end user interface.

You may in principle change any CSS style. In order to do so you may use the developer tools of your favorite browser to play with the styles of the end user interface and incorporate later those changes to the custom CSS of your template.

IMPORTANT: those changes will only apply to the corresponding template.

Custom JS

You may also insert template specific JS code. Do as before but now click on the Custom JavaScript code menu entry.

Just introduce (without the <script> tags) the code that you want to run on "document ready". You may use, besides vanilla JavaScript, JQuery code compatible with the platform version you are using (check with your webmaster or inspect the Docxpresso end user HTML code in your browser).

Beware that you may pass in the template options (by GET or POST) a "custom" JavaScript variable or object that may be accessed by your custom JavaScript code (via the associated hidden field with id “custom” or via the window.customData global variable).

All of this requires a working knowledge of JavaScript that may be beyond the capabilities of a standard Docxpresso user.

Once again that JavaScript code will only be available for that particular template.