Single Page PDF Export with Custom Background Edited

Hello,

I have an image I would like to use globally as background for each PDF Export of a single page.

I put the following code under the Admin Settings Page "Look and Feel > Global PDF Stylesheet" (https://website.com/admin/flyingpdf/viewpdfstyleconfig.action)

 

@page {
  background-image: url('/download/attachments/16351356/background.jpg');  
  background-repeat: no-repeat;  
  background-position: center;  
}

 

Unfortunately, when exporting, it doesn't do anything.

Btw, I know of the Support Page (https://confluence.atlassian.com/conf510/customize-exports-to-pdf-829077163.html) which mentiones the following: 

  • PDF customization only applies to space exports (not single page exports via Tools > Export to PDF)


Does someone know how to solve this?

Thanks

My Confluence Version is 5.10

2 answers

1 accepted

1 vote
Christoph Thomas Community Champion Jul 07, 2017

Hi Stefan,

from the documentation you should put it in the space adminstration under "Look and Feel -> PDF Stylesheet": https://confluence.atlassian.com/conf510/advanced-pdf-export-customizations-829077165.html

Have you tried putting it there?

Cheers

Christoph

Hey Christoph,

thanks for your answer.

I already tried putting it directly into a space

pdfexport.png

The image is reachable.

Could the issue be the dimensions of the image? It is 2480x3508 and should cover the whole DIN A4 background (we use it in a Word template aswell).

Best regards

Christoph Thomas Community Champion Jul 07, 2017

Hi Stefan, don't think so. Have you tried other CSS if it works in general? Then I could imagine that the path is wrong as for the export Confluence might work in another path then you expect - is there some broken image in the pdf? 

Hey Christoph,

there is no broken image. I just tried 

@page {
  background-color: #ccc;
}

to see if the PDF would have an gray background. And in fact it did. But i was thinking the whole page would have a changed color. It's only at the borders. Guess I have to fiddle with some other settings and maybe split my image into sections(header, footer)

Thanks for your help

Screenshot_14.png

Christoph Thomas Community Champion Jul 07, 2017

Hey Stefan, you're welcome - I guess that the page is mostly hidden by other elements (the content of the page) so splitting it up sounds like a good way to try - good luck! 

Christoph 

 @Stefan Remer

Go to Look and Feel > PDF Stylesheet and enter

@page {
background-image: url('/download/attachments/252249415/image1.jpg');  
margin: 50px;
}

.wiki-content  {
background-image: url('/download/attachments/252249415/image2.jpg');  
padding: 30px;
margin: 20px;
}

 

The result will look like this:

2017-12-19 14_36_31-Steffen.Heller-Backgroundimagetest-191217-1435-96.pdf - Adobe Acrobat Pro.png

Your example don't work because you defined a background image for @page (which is the border area around the page) but then positioned it in the center of the page (where it is covered by the .wiki-content container).

Playing around with the different elements and settings should give you the solution you are looking for.

Suggest an answer

Log in or Sign up to answer
Atlassian Community Anniversary

Happy Anniversary, Atlassian Community!

This community is celebrating its one-year anniversary and Atlassian co-founder Mike Cannon-Brookes has all the feels.

Read more
Community showcase
Kesha Thillainayagam
Posted Apr 13, 2018 in Confluence

We want to hear how your non-technical teams are using Confluence!

Hi Community! Kesha (kay-sha) from the Confluence marketing team here! Can you share stories with us on how your non-technical (think Marketing, Sales, HR, legal, etc.) teams are using Confluen...

372 views 20 10
Join discussion

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you