'External CSS in Flying Saucer

I would like to know how to include the External CSS in Flying-Saucer.Before that THB I checked with all the available links in StackOverflow but they are not helpful.That's the reason why made this one my self.

TestCSS.xhtml renamed version of TestCSS.html.So content of them are same. Below (Image 1 ) is the Structure of my Project in Eclipse IDE.If I run the TestCSS.html it will give the page result as Image 2 in Browser.

Below are Code which are not working as External CSS :

This one Working :
<style>
.redFontClass
{
  color : red;
}
.blueFontClass
{
  color : blue;
}
</style>

This one NOT Working :
<link href="RedCSS.css" rel="stylesheet" type="text/css" />

This one NOT Working :
<link rel="stylesheet" 
href="http://localhost:8888/Fly-Sauccer-Web/css/RedCSS.css" type="text/css" />

This one NOT Working :
<link href="file:///C:/Users/Joseph.M/WorkPlace_Struts2/Fly-Sauccer-Web/WebContent/css/RedCSS.css"  rel="stylesheet" type="text/css" />

I tried with all the ways including absolute path of css inside of the xhtml also.but css is not getting applied.Please help me to fix the problem.

Image 1

enter image description here

Image 2

enter image description here

RedCSS.css 

.fontClass
{
  color : red;
}

TestCSS.html

<html>
<head>
<link href="file:///C:/Users/Joseph.M/WorkPlace_Struts2/Fly-Sauccer-Web/WebContent/css/RedCSS.css"  rel="stylesheet" type="text/css" />
</head>
<body>
<b>This Should come assss <span class = "fontClass" >Red</span> </b>
</body>
</html>

Java Code :

public static void main(String[] args) throws Exception{

    // Path of Input File 
    String inputFile = "C:\\Users\\Joseph.M\\WorkPlace_Struts2\\Fly-Sauccer-Web\\WebContent\\TestCSS.xhtml";
    // Path of Output File 
    String outputFile = "C:\\Users\\Joseph.M\\WorkPlace_Struts2\\Fly-Sauccer-Web\\output.pdf";
    OutputStream os = new FileOutputStream(outputFile);             
    ITextRenderer renderer = new ITextRenderer();

    DocumentBuilder builder = DocumentBuilderFactory.newInstance().newDocumentBuilder();
    InputStream is = new ByteArrayInputStream(FileUtils.readFileToByteArray(new File(inputFile)));
    Document doc = builder.parse(is);
    is.close();
    renderer.setDocument(doc,null);        
    renderer.layout();
    renderer.createPDF(os);             
    os.close();
}
javacssflying-saucer


Solution 1:[1]

Given the structure of the project, <link href="css/RedCSS.css" rel="stylesheet" type="text/css" /> should definitely work.

Here is a working sample :

File struct :

enter image description here

File 1 : testRed.html

<html>
<head>
    <link href="css/testRed.css" rel="stylesheet" type="text/css" />
</head>
<body>
    Should be <b class="redFontClass">red</b>
</body>
</html>

File 2 : css/testRed.css

.redFontClass {color : red;}

Java code :

  String inputFile = "testRed.html";
  String outputFile = "testRed.pdf";
  OutputStream os = new FileOutputStream(outputFile);
  ITextRenderer renderer = new ITextRenderer();

  DocumentBuilder builder = DocumentBuilderFactory.newInstance().newDocumentBuilder();
  InputStream is = new ByteArrayInputStream(FileUtils.readFileToByteArray(new File(inputFile)));
  Document doc = builder.parse(is);
  is.close();
  renderer.setDocument(doc, null);
  renderer.layout();
  renderer.createPDF(os);
  os.close();

Solution 2:[2]

I tried an similar thing on my localmachine and i tried it with the solution of obourgain <link href="css/testRed.css" rel="stylesheet" type="text/css" /> The response for this way was 302 which means that the resource was found with redirecting but the result of this get was empty. When i add a / before css all works fine. <link href="/css/testRed.css" rel="stylesheet" type="text/css" />

Solution 3:[3]

I use the "classpath" keyword in a Spring Boot environment. 

<link rel="stylesheet" type="text/css" media="all" th:href="@{classpath:templates/style.css}"/>

worked for me.

I hope this helps someone with a Spring Boot + Thymeleaf + Flying Saucer setup.

Solution 4:[4]

Recently I faced a similar problem: it turned out that the CSS file was in a different encoding. You may have the same problem. First, you need to find out the encoding of the file:

file -i <my css file>

And then convert it into UTF-8:

iconv -f <my css file enconding> -t UTF-8 <my css file> > <my css file in utf-8>

In my case, after converting from UTF-16 to UTF-8, a PDF file has been generated.

Solution 5:[5]

Please refer this link. https://web.archive.org/web/20150905173204/http://today.java.net/pub/a/today/2007/06/26/generating-pdfs-with-flying-saucer-and-itext.html

Its mentioned that when you want to use an external css file, you should have a media="print" attribute on the link tag.

link href="file:///C:/Users/Joseph.M/WorkPlace_Struts2/Fly-Sauccer-Web/WebContent/css/RedCSS.css" rel="stylesheet" type="text/css" media="print"

Solution 6:[6]

For me, I just did exactly what Wolf359 did:

A lil bit of detail, this is my html template:

<link th:href="@{classpath:/css/styles.css}" rel="stylesheet" type="text/css" />

And in the Spring Boot project under the src/main/resources folder, I have

src/main/resources
|
|?? css/
|   |?? styles.css
|   |
. . . . .

It works like a charm!

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 user
Solution 3
Solution 4 Adrian Mole
Solution 5 Swaprks
Solution 6 Juan Diego

Related Questions