How to make a page printable? Using latest v of c5
Permalink
HI,
I have a page with song lyrics. I'd like to have a button where perople can print out the lyrics directly.
I'd like to enable printing only for that content block.
I don't need nav or sidebar contents printed. The only thing that would be nice is having the site URL printed at the bottom by default.
I could of course resort to having a print button that opens a pdf in a new browser window, but I'd like to avoid this if possible.
Any ideas how I can manage this?
I looked for add ons but "print page" or "print block" or only "print" don't pull any relevant add os or don't pull any add ons at all.
All help with this will be greatly appreciated!
I have a page with song lyrics. I'd like to have a button where perople can print out the lyrics directly.
I'd like to enable printing only for that content block.
I don't need nav or sidebar contents printed. The only thing that would be nice is having the site URL printed at the bottom by default.
I could of course resort to having a print button that opens a pdf in a new browser window, but I'd like to avoid this if possible.
Any ideas how I can manage this?
I looked for add ons but "print page" or "print block" or only "print" don't pull any relevant add os or don't pull any add ons at all.
All help with this will be greatly appreciated!
And some simple code will give you the button and command to print:
https://www.concrete5.org/community/forums/5-7-discussion/print-butt...
https://www.concrete5.org/community/forums/5-7-discussion/print-butt...
Thank you both!
I'll look into this. Feeliing a bit overwhelmed with c5.8, css is organised very different from c5.6
can't really find my way round yet.
I'll look into this. Feeliing a bit overwhelmed with c5.8, css is organised very different from c5.6
can't really find my way round yet.
Hi JohntheFish, how do I get rid of sidebars, headers, footers, menus, etc. using css? It beats me
Something like
There are plenty of references if you google css @media print. This one looks like a good introhttps://www.smashingmagazine.com/2011/11/how-to-set-up-a-print-style...
You will need to insert css selectors for any area you want to hide from the printed version.
There are probably some standard print stylesheets available that will do things like eliminate all backgrounds and make it black text on white.
@media print { /* this selector would need to be adjusted to match your theme */ .sidebar { display:none } }
There are plenty of references if you google css @media print. This one looks like a good introhttps://www.smashingmagazine.com/2011/11/how-to-set-up-a-print-style...
You will need to insert css selectors for any area you want to hide from the printed version.
There are probably some standard print stylesheets available that will do things like eliminate all backgrounds and make it black text on white.
Thank you for replying so promptly!
Alas, this is exactly what I am doing, but it doesn't work.
All the page parts are still shown in print preview despite my display:none settings.
I was hoping this was old deprecated method and someone would tell me I need to use a different method.
The background and font color settings work alright, but the non-print areas do not obey my commands ... ok I#ll keep on trying
Alas, this is exactly what I am doing, but it doesn't work.
All the page parts are still shown in print preview despite my display:none settings.
I was hoping this was old deprecated method and someone would tell me I need to use a different method.
The background and font color settings work alright, but the non-print areas do not obey my commands ... ok I#ll keep on trying
A couple of possibilities:
- You have the wrong selectors
- You have the right selectors, but other rules are stronger. For example, a theme contains a @media all part that provides a background property with !important.
A look at the developer console on the print preview may provide some clues.
- You have the wrong selectors
- You have the right selectors, but other rules are stronger. For example, a theme contains a @media all part that provides a background property with !important.
A look at the developer console on the print preview may provide some clues.
I have an addon that I developed for 5.7 that does pretty much this very thing. It never did get approved for the marketplace. You can take a look at a live demo here:
http://c57.pinecreativelabs.com/ez-series/ez-print...
EZ Print allows you to create a printable block.
Let me know if you are interested.
http://c57.pinecreativelabs.com/ez-series/ez-print...
EZ Print allows you to create a printable block.
Let me know if you are interested.
sorry for late reply ... yes I'm interested! :-)
Just why was it not approved for marketplace?
Just why was it not approved for marketplace?
Basic overview athttps://www.w3schools.com/css/css3_mediaqueries.asp...