| Login
en-USnl-NL
You are here: Weblogs & News > Weblogs

Information, Opinions & Ideas

  Minimize

Adding a Print stylesheet to your Dotnetnuke Skin

Thursday, January 19, 2012 - Timo Breumelhof
Adding a Print stylesheet to your Dotnetnuke Skin

As you can read in my previous blog, there's an issue with the DotNetNuke core print skin object in DotNetNuke 6.1.

I'm sure this will be solved in a future version, but there is a workaround for it as you can read in the blog post.

Another solution is something that's part of the HTML recommendation.
Include a print.css file, which allows you to style the printed page.

The HTML for this would be:

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

Because the Media attribute is set to "print" this stylesheet will only be loaded when printing the page.
Using this print.css stylesheet you can  hide certain parts of the page you don't want to print, or change font-szie, content width etc.

Example CSS:
#HorMenuDropDown{display:none;}
#Skin{width:99%;}
.Normal{font-size:12pt;}

Including a Print.css is not difficult but some people are asking for a solution in the DotNetNuke Forums, which is why I decided to write this blog.

How to include Print.css on you page for printing

The easiest way to include this is to use our DotNetNuke Stylehelper Skin Object.
You can download it here.

Then add this to your skins ascx file:

<%@ Register TagPrefix="fortyfingers" TagName="STYLEHELPER" Src="~/DesktopModules/40Fingers/SkinObjects/StyleHelper/StyleHelper.ascx" %>

<fortyfingers:STYLEHELPER ID="STYLEHELPER1" AddCssFile='Print.css' CssMedia="print" runat="server" />

And add a Print.css file to the root of your skin package and your done.
Now you only have to create print styles and test.

BTW, you can test the result by using the print preview option of your browser.

On this page there are some good tips on how to create a good print.css file:
http://www.webdesignerdepot.com/2010/01/10-tips-for-better-print-style-sheets/
 

Our latest news

  Minimize
Arnhem, 22-04-11
Stefan Kamphuis of 40Fingers has been asked by Microsoft to attend the Microsoft DevDays in The Netherlands for the Ask The Expert area on the Visual ... [read more...]
Contact 40Fingers

40Fingers can best be reached by email: info@40fingers.net.

Office address:

40Fingers

Willemsplein 27
6811 KC Arnhem
The Netherlands

Phone: + 31-26-3653322

Our office hours are: 08:30 - 17:00 GMT+1