PDF Export with both title and image in header possible?

[Caroline Busse]

Hi,

I added an image to the header of my PDF Export in Confluence via the HTML PDF Layout.

Everything worked.

Additionally I added the page title as dynamic title of my header via CSS in the PDF Stylesheet.

And now only the title is visible.

Note: I placed the title on the left side of my header and the image on the right.

How can I have both displayed in my header?

My idea was to maybe place the image in the Stylesheet too. But I couldn't find a suiting code therefore.

Thanks. :)

[thomas.ohrbom]

Hi, I'm late to the party, but I had the same issue and have found a solution. The following works on Confluence Cloud for single page "Export to pdf".

Go to Settings | PDF Stylesheet and add the following:

Cheers!

PS! Apologies for posting the solution as an image. I am not allowed to post the code on this forum as it states the code is illegal!

[Nils Bier _K15t_]

Hi Caroline,

As an alternative to the default PDF Exporter you could also have a look at our Scroll PDF Exporter.

Scroll PDF Exporter comes with a graphical template designer, allowing you to fully control the output without any CSS or HTML knowledge.

Additionally it supports placeholders for certain elements (e.g. page title) that can be used in the header or footer of the export.

In your case you could use the "Chapter Heading" placeholder in order to dynamically display the heading of the exported page.

Scroll PDF Exporter - as all Marketplace apps - can be tested for free using a 30 day trial license from the Atlassian Marketplace. Please feel free to have a closer look, or reach out to us via support@k15t.com, if you have any further questions, or want to set up a demo to discuss your requirements.

Cheers,
Nils

[Caroline Busse]

Thanks, but I'd prefer a free solution. :)

[thais]

Hi, Caroline,

Can you please share the codes you used so we can test on our test instance?

Thanks!

[Caroline Busse]

Hi Thais,

this is the HTML Code I placed in the header space of the PDF Layout (for the image):

<div style="margin-top: 10.0mm; text-align:right">
<img src="https://insight.eqs.com/download/attachments/89305057/EQS_GROUP_dark_RGB.jpg?api=v2" height ="50px" width="80px" />
</div>

and here's the CSS code i put in the PDF Stylesheet;

@page
{
@top-left
{
content: element(runningheader);
}
@bottom-right
{
content: counter(page) " / " counter(pages);
}
}

.pagetitle h1 {
position: running(runningheader);
font-size: 10pt;
}

Thanks. :)

[Caroline Busse]

Hi, do you have an idea? :)

[thais]

Hi, Caroline,

Right now, I'm not being able to export the PDF when adding the codes:
"There was an error in the export. Please check your log files." 

I'm still testing, though, and I'll let you know as soon as I can export.

Are you trying to export a page or a Space?

[thais]

Hi, Caroline,

Single page exports don't support adding HTML headers and footers via the PDF Layout page, but you can use CSS rules in the PDF Stylesheet page to produce headers and/or footers for a single page export.

Also, at this moment, it's not possible adding dynamic content in headers and/or footers of PDF exports, although we do have the following open feature requests to allow this functionality at: 
- Cloud: CONFCLOUD-16733 
- Server: CONFSERVER-16733

We suggest you add yourself as a watcher on the feature request regarding your instance (Cloud or Server), voting to increase its popularity. More information about how Atlassian implements New Features can be found in this page. 

We also suggest checking the following articles: 
- Customize Exports to PDF: Cloud / Server 
- Advanced PDF Export Customizations: Cloud / Server: 

Please let me know if this could clarify your question. :)

[Caroline Busse]

Hi Thais,

I'm exporting the whole space, but also for single pages it's working...

[Caroline Busse]

Again, by itself I can export the page title and the image in the header.

Just when bundling both features, only the title shows up.

Can maybe someone else help me?

Could someone maybe propose a code where both title and image are either in CSS or HTML?

Thanks!

[Nanda Kops-Assendelft]

Hi Caroline,  

How can you export the image in the header?

If I use your example of HTML Code in the header space of the PDF Layout (of course with my own image link), it does not reacts if I export the single page to pdf:

<div style="margin-top: 10.0mm;">

        <img src="/download/attachments/3506317/FQS-logo2.png?version=1&modificationDate=1507885823393&api=v2" height ="50px" width="80px" />

</div>

I deleted everyting before 'download'. Also tried the entire link:

      <div style="margin-top: 10.0mm;">

        <img src=" http://confluence.next:8090/download/attachments/3506317/FQS-logo2.png?version=1&modificationDate=1507885823393&api=v2" height ="50px" width="80px" />

      </div>