Export to HTML and layers to images

Upload Photoshop Scripts, download Photoshop Scripts, Discussion and Support of Photoshop Scripts

Moderators: Tom, Kukurykus

uli

Export to HTML and layers to images

Post by uli »

Hi,

I created a script which exports your images to HTML. The HTML contains text layers with real text styled with CSS. PNG-images are created for normal layers and loaded into the HTML using the background-image CSS property.

For me, this is a very useful tool, as among other thing I'm doing web-development. Sometimes I get a PSD file from a designer and need to create a HTML-template and the CSS. The exported HTML helps me to get measurements, positions and font-styles. It also allows me to use some of the exported images directly as background-images (e.g. for decorations which can't be done with HTML).

The intended purpose of the script is not to genereate HTML which can be directly used as a website. Rather it should be used to support you when creating HTML and CSS. I use Firebug to select and read CSS properties from the respective layers. Moreover, the generated output isn't 100% correct.

The script is hosted on google-code, you can download it here:
http://code.google.com/p/psd-to-html-ex ... loads/list

At the moment I'm working on handling exceptions and providing some options.

Not all font-formatting options are supported at the moment and some can't be implemented at all.

The work is based on
ExportLayerCoordinatesToXML by pattesdoursExport Layers To Files - Fast PNG Version by Naoki Hadasome code from xtools by XBytor
Uli
Jeremy Knudsen

Export to HTML and layers to images

Post by Jeremy Knudsen »

Very interesting concept! Have you made any progress/updates?