Handle several languages in one CSS customization file for PDF output

[plnrlt]

Hello,
I use a customized css file to handle the layout of my PDFs, using the DITA Map PDF - based on HTML5 & CSS scenario in Oxygen XML Editor 23.1. Until now, I created one file for each language we use in our documentation but it is painful to update, so I was wondering if I could define rules so the right string is generated in the PDF depending on the content's xml:lang attribute.
I had a look around and found solutions with selectors like *[lang|="language code"] , :lang(language code) and others, but I can't figure out where to place them. I always get "unrecognized" errors.

Here is an example of content I would like to localize:

Code: Select all

/* Front page customization */
@page front-page {

    /* Add legal info at the bottom of the page */
    @bottom-center {
    content: "Original instructions. Do not distribute without our prior consent."; /* TO LOCALIZE */
    color: rgb(96, 96, 96);
    font-size: 11pt;
    border-top: 0px;   
    }
  }

What could I use here to also define the French and the German translation of the content in the same file?

Thanks a lot for your help and have a nice day!
Pauline

[shudson310]

We use something like this:

Code: Select all

*[class~="front-page/front-page"]:lang(en-US):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "Please read the ServiceNow Website Terms of Use at\awww.servicenow.com/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.com/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }
   *[class~="front-page/front-page"]:lang(de-DE):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "Bitte lesen Sie die Nutzungsbedingungen für die ServiceNow-Website unter www.servicenow.com/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.com/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }
   *[class~="front-page/front-page"]:lang(fr-FR):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "Veuillez lire les Conditions d’utilisation du site Web de ServiceNow à l’adresse www.servicenow.fr/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.fr/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }
   *[class~="front-page/front-page"]:lang(ja-JP):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "下記の ServiceNow ウェブサイト利用規約をお読みください。 www.servicenow.com/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.com/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }
   *[class~="front-page/front-page"]:lang(ko-KR):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "다음 사이트에서 ServiceNow 웹 사이트 이용 약관을 읽어보십시오. www.servicenow.com/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.com/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }
   *[class~="front-page/front-page"]:lang(pt-BR):after(2){
  display:block;
 
  page: copyright-notice-page; /* Moves the synthetic element on a new page. */ 
 
  margin-top: 0.25in; /* use margins to position the text in the page */
  margin-left: 0in;
  margin-right: 5em;

  content: "Leia os Termos de Uso do Site do ServiceNow em www.servicenow.com/terms-of-use.html\a\a";
  -oxy-link: "http://www.servicenow.com/terms-of-use.html";

  text-align:left; /* More styling */
  font-size: 10pt !important;
  color: #949594;
  }

[julien_lacour]

Hello,

You can also use the custom oxy_xpath() function in order to change the headings depending on the language.
Besides that, if you want to change or add new strings you can check this topic.

Regards,
Julien