Viewing Printable website

  1. Portal Home
  2. Forum
  3. EverWeb
  4. How do I...?

Printable website



User: Ana F. 8 years ago
Hello,

well I tried to make a printable website and thank god I found an HTML snippet I can use in Everweb but I do have a question, anyone an idea how I can input what I do not want to print from site?

the HTML snippet code ( http://iwebunlimited.com/iweb-tips/print-page-button/ ) that works fine for website - but in my case let print to much -

<a href="java script:parent.window.print()"><IMG SRC="http://www.my.website.com/ewExternalFiles/print_btn2.png"; width="49" height="50" alt="Print this page" border="0"></a> - with printer image of choice

or

<script Language="java script">
function printit(){
if (parent.window.print) {
parent.window.print() ;
} else {
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
WebBrowser1.ExecWB(6, 2);//Use a 1 vs. a 2 for a prompting dialog box WebBrowser1.outerHTML = "";
}
}
</script>
<SCRIPT Language="java script">
var NS = (navigator.appName == "Netscape");
var VERSION = parseInt(navigator.appVersion);
if (VERSION > 3) {
document.write('<form><input type=button value="Print" name="Print" onClick="printit()"></form>');
}
</script>

- that's with Text Button

Well I would like to implement that the h1, h2, h3, in the back of the page should not be printed... Anyone an idea?

Or that i can somehow go and print the website with background...
Thank you
Ana

Last edit 8 years ago
User: Ozzy S. 8 years ago
To hide the h1's, h2's, and h3's when printing, add the following CSS code to the head code.

<style type="text/css">
@media print {
h1, h2, h3 {
display: none;
}
}
</style>

As for printing the website with background, I'm not 100% sure what you mean. In Safari, when printing, there is an option to Print Backgrounds, if that's what you're talking about.

Last edit 8 years ago

-------------------------------
Ozzy Simpson | Oznorts
-------------------------------
EverWeb users get a 10% discount on our hosting services! Just use promo code EVERWEB10 to receive the discount!
-------------------------------
Facebook | Twitter | Instagram
User: Roddy 8 years ago
Use something like this to get rid of items like headings, navigation etc and change the background to white and the text to black if needed...

<style type="text/css">
@media print{
body {background:#FFFFFF;color:#000000 !important}
h1, h2 {display:none !important}
#navmenu_menu0 {display:none !important}
}
</style>

Insert it into the Head Code box in the Page inspector.

NOTE the use of the !important declaration to make sure these styles will overwrite any that come after them in the order of the HTML doc.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Ana F. 8 years ago
.... thank you... somehow its not working for me... i have to figure out something...
User: Roddy 8 years ago
Post the CSS you are using if you are unsure about about what selectors to use.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Ana F. 8 years ago
basically I put it in the css - but I leave the h1 out and say that i don't want to print h2, h3, h4 - then i try it and print the page - but it shows everything so, I guess the h1 has to be listed also(?)
User: Roddy 8 years ago
You should post the styles you are using in case they aren't correct.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Ana F. 6 years ago
Hallo, I totally forgot that I asked that before... How can I make my website printable? Obviously the code wasn't good - my page still isn't printable...


Post Reply
You must login or signup to post.