Custom Quote Template

I have designed a custom quote template which looks amazing. The only issue I am facing is when I download it using the Hubspot Action dropdown it does not show page numbers for example Page 1 of 2. I have added the required CSS code as well. Any idea if this issue is Hubspot related?

Hi @MKhan145,

From experience the downloaded version should more or less be a copy of the print version of your quote. This means it’ll be affected by any media print queries you might have in place. It’s possible at the moment the print version of the quote cuts out your footer/other elements depending on how you’d defined the CSS.

A method I use frequently to check the print version of my quote templates is the Emulate CSS media option in the inspect tool. I’d recommend checking your quote template under this lens to assess whether or not the page numbers show up there!

If they do and the download version still doesn’t have the page numbers do feel free to DM me a link to a test quote you’ve generated with this template as well as more detail on how you generate this number for me to look into this further!

@ModuleMaestro I have sent you a message. Please check.

Thanks for the message! Sharing here for transparency, it seems that the use of the following CSS to add the page numbers:

@page{
 @bottom-center {
 content: "Page " counter(page) " of " counter(pages);
 }
}

Isn’t working. I believe this has to do with how the @page at-rule actually operates in most browsers and the fact it’s not widely implemented as seen here. You can set up a basic JS fiddle like this: https://jsfiddle.net/n24hfv7k/ to test this implementation further but from what I can see this wouldn’t display in HubSpot either.

@Jaycee_Lewis - Any help please?