Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Atahualpa 3 Wordpress theme (http://forum.bytesforall.com/forumdisplay.php?f=2)
-   -   Printing entire page including sidebars, header, etc. (http://forum.bytesforall.com/showthread.php?t=1474)

peterf Apr 29, 2009 12:17 PM

Printing entire page including sidebars, header, etc.
 
I see some guidance for printing just a post or for using wp-print to do that, but is it possible to print the entire web page as it appears with both sidebars and header? Using "print" from the browser just stuffs the center column into a narrow left justified column. The site I'm using relies heavily on pages; so I would want "pages" web pages to print in addition to posts.

Flynn Apr 29, 2009 07:14 PM

The "stuffing into narrow column" issue was fixed in 3.3.2

In 3.3.2 the print section in style.css looks like this:
HTML Code:

/* ------------------------------------------------------------------
---------- PRINT STYLE ----------------------------------------------
------------------------------------------------------------------ */

@media print {

body {
    background: white;
    color: black;
    margin: 0;
    font-size: 10pt !important;
    font-family: arial, sans-serif;
    }

div.post-footer {
    line-height: normal !important;
    color: #555 !important;
    font-size: 9pt !important;
    }

a:link,
a:visited,
a:active,
a:hover {
    text-decoration: underline !important;
    color: #000;
    }
   
h2 {
    color: #000;
    font-size: 14pt !important;
    font-weight: normal !important;
    }
   
h3 {
    color: #000;
    font-size: 12pt !important;
    }
   
#header,
#footer,
.colone,
.colthree,
.navigation,
.navigation-top,
.navigation-middle,
.navigation-bottom,
.wp-pagenavi-navigation,
#comment,
#respond,
.remove-for-print {
    display: none;
    }

td#left, td#right {
    width: 0;
}

td#middle {
    width: 100%;
}

/* 4 hacks for display:none for td#left and td#right for all all browsers except IE. */

*:lang(en) td#left{
    display: none;
}
   
*:lang(en) td#right{
    display: none;
}

td#left:empty {
    display: none;
}

td#right:empty {
    display: none;
}

}

To print the page as is try this print CSS instead of the one above:

HTML Code:

/* ------------------------------------------------------------------
---------- PRINT STYLE ----------------------------------------------
------------------------------------------------------------------ */

@media print {

body {
    background: white;
    color: black;
    margin: 0;
    font-size: 10pt !important;
    font-family: arial, sans-serif;
    }

div.post-footer {
    line-height: normal !important;
    color: #555 !important;
    font-size: 9pt !important;
    }

a:link,
a:visited,
a:active,
a:hover {
    text-decoration: underline !important;
    color: #000;
    }
   
h2 {
    color: #000;
    font-size: 14pt !important;
    font-weight: normal !important;
    }
   
h3 {
    color: #000;
    font-size: 12pt !important;
    }
   
 }   


peterf Apr 30, 2009 12:33 PM

Thank you. I updated to 3.3.2 and tried your suggested "as is" code in the css inserts box, but still got only the center column (although it is now nice and wide). Let me know if you can think of any other way to print a wysiwyg version of the site pages.

Flynn Apr 30, 2009 03:24 PM

Replace the existing Print Style section in style.css with this new Print Style section posted above, by actually editing style.css in this case. Do not put it into CSS Inserts.

I am adding this to the Todo list, an option to print the whole page. Won't be included in 3.3.3 though

linkomatic Jan 4, 2010 11:24 AM

I've made the changes to the Print Style section in the css.php file and it seems to work fine, except that the logo image does not print on the page. Is there any way to address this? (I am suppressing displaying the header text, and am instead displaying a large logo image in its place.) Thanks!

jnelson1000 Nov 3, 2010 05:11 PM

Hi,

I've been reading this set of threads trying to solve my problem. I have Atahualpa 3.5.3 and can't get the entire page to print...even after putting the second set of code in the style css file in the atahualpa/styles folder location. what am I doing wrong.

Site is http://new.directchassis.com but I have others that may have this problem.
Thanks,
John

cob-web Nov 13, 2010 03:37 AM

In Atahualpa 3.5.3 I just added
HTML Code:

display: none;
to all the sidebars in the PRINT STYLE area in the css.php like this:

HTML Code:

        td#left, td#right, td#left-inner, td#right-inner {
                width: 0;
                display: none;
                }

And also to clean it up a little bit
HTML Code:

div.navigation-bottom {display: none;}
div.navigation-top  {display: none;}
div.older {display: none;}
div.newer  {display: none;}

This worked to me!
Greets, Tomas

LunaLibby Dec 20, 2011 07:14 PM

Thanks for this solution. I spent hours trying to find a solution by searching "How do I print the sidebars and how do I print a full page". I couldn't find what I needed. I finally rewrote the print.css using instructions on wordpress.org to print just the sidebars but it presented a problem when returning to the URL. It scrambled the page layout and didn't work if you tried to change the print %.

So thanks again for this solution... it worked perfectly.

My question is why does it work? Since all my searches turned up instructions to rewrite the css print file using display:block on everything you wanted to print, why does excluding any mention of it work? Is there a default that assumes display:block on everything if nothing exists?

Just curious...I'd like to think I can start from a logical place if this happens again under different circumstances.

LunaLibby Dec 20, 2011 07:18 PM

Is there any code for printing just the sidebars that doesn't create more problems? This is the code I wrote. I'm sure there is a lot in it that isn't needed as I was doing a lot of guessing trying to hit the correct markers! (Try not to laugh or groan too much...)
@charset "UTF-8";
/* CSS Document */

/* Print Style Sheet */
@media print {

body {
background:white;
color:black;
margin:0;
font-size:12pt;
line-height:1.4;
font-family: arial, sans-serif;
}
h2 {
color: black;
font-size: 14pt !important;
font-weight: bold !important;
display:block;
}

h3 {
color: black;
font-size: 12pt !important;
font-weight: bold;
}

hr {display:block;
color:black;
}

.pagebreak { line-height:2pt;
page-break-after:always;
}


p {
color: black;
font-size: 12pt !important;
font-weight: normal;
}

a:link,
a:visited,
a:active,
a:hover {
text-decoration: underline !important;
color: black;
font-size:12pt;
}

#wrapper {display:block; width: 540pt;}
#header { display:none; }

#content {
display:none;
}

#comments {
display:none;
}

#black-studio-tinymce-10 {display:none;}
#black-studio-tinymce-11 {display:none;}


#sidebar {
background:white;
color:black;
font-size:12pt;
margin-left: 0;
float:none;
width:270pt;
display:block;
}

#rightSidebar{
background:white;
color:black;
font-size:12pt;
margin-left: 0;
float:right;
width:270pt;
display:block;
}
#leftSidebar {
background:white;
color:black;
font-size:12pt;
margin-left: 0;
float:left;
width:270pt;
display:block;
}

#footer { display:none; }

#menu { display:none; }

.colone {
color:black;
font-size:12pt;
display:block;
}

.coltwo {
color:black;
font-size:12pt;
display:block;
}

.colthree {
color:black;
font-size:12pt;
display:block;
}

.navigation,
.navigation-top,
.navigation-middle,
.navigation-bottom,
.wp-pagenavi-navigation,
.wp-pagenavi a:link,
.wp-pagenavi a:active,
.wp-pagenavi a:visited,
.wp-pagenavi a:hover,
#comment,
#respond,
.remove-for-print {
display: none;
}

div.widget_nav_menu ul li a:link,
div.widget_nav_menu ul li a:active,
div.widget_nav_menu ul li a:visited,
div.widget_nav_menu ul li a:hover,
div.widget_pages ul li a:link,
div.widget_pages ul li a:active,
div.widget_pages ul li a:visited,
div.widget_pages ul li a:hover {
display: none !important;
}


td#left, td#right {
margin-left: 0;
float:none;
width:270pt;
color:black;
background:white;
font-size:12pt;
display:block;
}



td#middle {
margin-left:0;
float:none;
width:60%;
color:black;
font-size:12pt;
display:none;
}



/* 4 hacks for display:none for td#left and td#right for all all browsers except IE. */

*:lang(en) td#left{
display:block;
}

*:lang(en) td#right{
display: block;
}

td#left:empty {
display: none;
}

td#right:empty {
display: none;
}



}


All times are GMT -6. The time now is 11:32 PM.

Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.