CSS formatting added to a DITA topic is not appearing in the generated PDF

[jekehu]

Hi,

I wanted to change the colors of some columns in a table in a DITA topic file, so I followed the directions here to make a CSS file:topic16194.html. I then associated the CSS file with that DITA file.

The formatting appeared in Oxygen:


But when I generated a PDF, the formatting didn't appear. The table just looked like all the other tables in the DITA map. The table in the PDF looks like this:


Something in the transformation from DITA map is making the CSS formatting not be applied. How can I get the generated PDF table to have the colors?

Thank you

[julien_lacour]

Hello,

If you want your CSS applied on your PDF output, you have to duplicate the default "DITA Map PDF - based on HTML5 & CSS" transformation scenario and set the 'args.css' parameter.
You will find more information about how to customize PDF with CSS here.

Next, if you want to use the same CSS in both Author Mode and PDF, you have to add a selector to your style-sheet:

Code: Select all

entry[outputclass = "test"],
*[class ~= "topic/entry"][outputclass = "test"] {
    background-color: blue;
}

In our transformation the CSS file is applied over an HTML5 document, so the rules must be defined for the HTML elements (<td>, <div>, etc...).
To help you in your customizing process, you can use the ".merged.html" file inside your browser to see what rules are applied and why some of them are not applied sometimes.
You will find more details about the CSS debugging here.

You may also find some webinars about CSS customization on our website: https://www.oxygenxml.com/videos.html?category=Webinars

Regards,
Julien

[jekehu]

Thanks for your reply. Is customizing PDF with CSS only possible in Oxygen version 20.1 and higher? I have 18.1 and I don't see the "DITA Map PDF - based on HTML5 & CSS" transformation scenario, or the

Code: Select all

args.css

parameter in my existing transformation scenarios. Is there a way to customize PDF with CSS on 18.1?

Thank you

[julien_lacour]

Hello,

If you are using Oxygen 18.1, you need to do the following:

• Download Prince XML or Antenna House processor and install it
• Duplicate the "DITA Map PDF - WYSIWYG - Experimental" transformation scenario
• Set the 'css.processor.type' to your processor, then set the 'css.processor.path.prince' (resp. 'css.processor.path.antenna-house') accordingly
• Create a CSS style-sheet containing the following selector:

  Code: Select all

  entry[outputclass = "blue"]{
      background-color: blue;
  }
  

• Set the 'args.css' parameter in your transformation to the CSS style-sheet

The indications I gave you before are only working starting with Oxygen 20.1.
If in the future you want to transform a lot of DITA documents, I highly recommend an upgrade to the last Oxygen version.

Note: Oxygen 23.0 release is planned for this end-year

Regards,
Julien

[chrispitude]

jekehu, if you want to make CSS-formatted PDF files, I strongly urge you to use the latest release of Oxygen.

PDF Chemistry has improved quite a bit just in from v21 to v22 (stability, features, consistency and predictability). I am sure v23 will be even better. It has been one of the most impressive parts of our move to DITA.

[jekehu]

I only have access up to Oxygen 21. In 21.1 when I tried transforming, it failed with this message:

Code: Select all

[DOTA001F][FATAL] "pdf-css-html5" is not a recognized transformation type. 

[jekehu]

In DITA Map PDF - WYSIWYG - Experimental, I don't see args.css in the parameters. Do you have to add it?

[julien_lacour]

Hello,

If you are using Oxygen 21.1, make sure the Options > Preferences... > DITA > DITA Open Toolkit option is set on "Built-in DITA-OT 3.x"
The DITA Map PDF - WYSIWYG - Experimental must have the 'args.css' parameter.

If you still have problems, you can try to reinstall Oxygen in a separate folder and check if the new instance works better.

Regards,
Julien