In this blog we discusses about creating professional looking product catalog / brochure by leveraging web development skills.
You need,
- jQuery (http://jquery.com/) - Cross browser javascript library.
- Blue print CSS (http://www.blueprintcss.org/) - Cross browser CSS Framework with grid based layouts, typography.
- Cufon (http://cufon.shoqolate.com/) - Javascript frame work for displaying visually interesting fonts by replacing existing texts.
- Cufon fonts (http://www.cufonfonts.com/) - Free catalog of fonts to use with Cufon.
- Wkhtmltopdf (http://code.google.com/p/wkhtmltopdf/) - Webpage to PDF converter that uses webkit rendering engine.
To outline steps involved, we will create simple brochure.
if you haven't used Blue print CSS before, have a look at this tutorial
Apply necessary styles
Download and apply Cufon fonts
For this demo, i used vanilla font from Cufon fonts.
Export your webpage as pdf
You can download files associated with this blog entry at github repo : https://github.com/selvan/sample-brochure
update : Brochure we created using above discussed points, for Postoz - SaaS hosted business process system is accessible at https://s3.amazonaws.com/postoz/postoz-brochure.pdf
