Documentation on Prince + CSS

[EvaJ]

Hi Team,

I figured that the learning curve for XSLT is much higher than for CSS, hence I was very happy to find out that Oxygen provides a transformation scenario based on CSS + Prince.

My question is if it is possible to customize the CSS without using the WYSIWIG Feature?

The folder /dita/css/print provides additional CSS files for customizing the PDF output. Unfortunately, I can find no further instruction on how to plug these files into the transformation scenario "PDF CSS (experimental)". I am pretty new to CSS so it is highly probable that I miss some dependecies between the provided CSS files.

I would really appreciate any help on how to customize the PDF output using CSS + Prince without the editor's WYSIWIG function .

Cheers,
Eva

[Dan]

You can modify this behavior by changing the "dita.css.list" parameter of the "DITA Map PDF - WYSIWYG" transformation scenario.
The documentation for this parameter states the following:

The files must have URL syntax and be separated using semicolons. If the value is empty, then the DITA topics/maps CSS files (currently selected from the oXygen Styles dropdown) are used.

So, to use a fixed CSS, not depending on the selected CSS for authoring, you must set as value to this parameter the URI path of the CSS file (It should start with the "file:" protocol, for example "file:/D:/my_folder/my_css.css"). It could be one of the CSS files we bundle with oxygen. You may find them in the folder: OXYGNE_INSTALL_DIR/frameworks/dita/css/edit

See also:
https://www.oxygenxml.com/doc/versions/ ... rio-dialog
https://www.oxygenxml.com/doc/versions/ ... parameters
https://www.oxygenxml.com/doc/versions/ ... f-css.html

Many regards,
Dan

[EvaJ]

Hi Dan,

thanks for the quick reply.

Is there any documentation on how to customize the provided oxygen CSS files?

Say I want to customize headers, footers and page layout. Is there any help on how I can achieve with this?

Thank you very much in advance!

Cheers,
Eva

[Dan]

Hello,

We do not have yet such a documentation, but here are some hints:

I would start by creating a CSS file that imports two other CSS files:

1. the one from the Oxygen installation that gives styling for common DITA elements, for example:
OXYGEN_INSTALL_DIR/frameworks/dita/css/edit/dita.css
2. the one from the Oxygen installation that adds page level formatting:
OXYGEN_INSTALL_DIR/frameworks/dita/css/print/p-dita.css
This is used to style different aspects of the print output like index page, front page, TOC, page breakcs, titles and numbers. Look in the CSS files from the same folder for more details.

This main CSS file should be set as "dita.css.list" parameter in the transformation scenario.

Then I would add in this main CSS file the rules that change the page layout and the formatting. Putting them after the imports makes them more important, so you can override built-in formatting.

Also, try watching this recording:
https://www.oxygenxml.com/events/2016/w ... _dita.html
At some point there (I think after the minute 42) is explained how to change the formatting of the DITA elements in a WYSIWYG transformation with Prince.

Many regards,
Dan

[EvaJ]

Hi Dan,

thanks a lot for you input! I will try it out.

Cheers,

Eva