Resize image in pdf export CSS

Hi All,

I'm trying to add a logo to our single page pdf exports but I cannot seem to resize the image within the stylesheet.

When I resize that actual image file manually it looks absolutely terrible when rendered in the pdf.

I'm no CSS expert so I was hoping someone might be able to tell me if I'm doing this wrong.

Thanks,

Alicia

@page:first

{

margin-top: 2in;

background-image: url(http://intranet1.aftrs.edu.au/download/attachments/5832706/AFTRS_RED_RGB.png?api=v2);

background-size: 50%;

background-repeat: no-repeat;

background-position:10% 6%;

}

3 answers

1 accepted

1 vote
Accepted answer

@Alicia:

Your reasoning makes sense for normal images. If you include a huge image, make it smaller in the wiki and then export to PDF, the image quality will be better (according to the real size of this image).

For a background image this is different, because you can't resize it. "background-size" would be the way to go but I guess that won't work because a) it is CSS3 which hasn't been supported by confluence and b) I tried it and it didn't work.

Thanks for confirming it doesn't work, was getting very confused!

Do you know if I can use any other css commands to acheive this? Can I only use background-image in the stylesheet?

Thanks,

Alicia

No, I don't know a CSS hack to resize a background image.

Another option to include a header/footer is using the Space Admin > PDF Layout (using HTML here). This will only work for space exports, though (Browse > Adanced > PDF export).

Perhaps there are other options, depending on the kind of logo you use.
If it is a simple "vectorlike" logo without colour gradients, the image quality won't be a topic at all. If you have your own font with that logo you can also include the font and just reference the "letter" that corresponds to the logo.

Hi, yeah unfortunately that's not possible for our logo.
And I need the logo on single page exports, not space exports.

Oh well, I suppose I'll submit a feature request!

Thanks for your help.

Just to get that right:

It is possible to export a single page with Browse > Adanced > PDF export, it is just not exactly what this option was intended for.

Yes, but that would require space admin privileges, correct?

Hey,

What i mean by "manually" is resizing it outside of confluence (eg in photoshop).

What I was tring to test was that if I used a large image and resized it in CSS whether it might improve the image quality (as the pdf rendering in confluence seems awful).

I usually do use relative URL's - this was a lazy test!

Thanks,

Alicia

Hi Alicia,

you do it right, basically. You can achieve that with a combination of background-image and background-repeat.

Two possible problems:

  1. I don't think that confluence supports background-size. So instead you must make sure that the image already has the correct dimensions (resize it in Photoshop or whatever programm you use for that)
  2. Use a relative URL. Attach the image to some confluence page, click on image properties and copy the URL path starting with "/download/attachments/..." and enter that at background-image.

PS: Don't know what you mean with "resize that actual image file manually..."

Hey,

What i mean by "manually" is resizing it outside of confluence (eg in photoshop).

What I was tring to test was that if I used a large image and resized it in CSS whether it might improve the image quality (as the pdf rendering in confluence seems awful).

I usually do use relative URL's - this was a lazy test!

Thanks,

Alicia

Suggest an answer

Log in or Sign up to answer
Community showcase
Posted Oct 24, 2018 in Confluence

Atlassian Research opportunity with Confluence templates

Do you use templates with Confluence? Take part in a remote 1-hr workshop. You'll receive USD $100 for your time!   We're looking for people to participate in a   remote 1-hr workshop...

1,528 views 25 14
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