Sketch plugin for creating a click-through HTML prototype
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
Sketch to HTML.sketchplugin/Contents/Sketch Update html.js May 12, 2017
demo Add files via upload Jan 24, 2017
README.md updating license to MIT Sep 20, 2017

README.md

Tested with Sketch version 42

Sketch to Click-through HTML

Create HTML pages with images of artboards, and add hotspots on top.

Installation
  1. Download the plugin.
  2. Double click "Sketch to HTML.sketchplugin" to install it.

How it works

Link a layer to an artboard

link layer

Fix layers

You can also fix layers to one of the four positions. If you got a fixed nav, this can be handy. link layer

Export to HTML

link layer

Full Command List

Command Description
Link selected layer to... Link a layer to an artboard in the current page
Fix selected layer to... Fix a layer to one of the four positions: top, right, bottom, left
Export to HTML Export current page artboards into html files, in a folder named after the Sketch file
Clear selected layer's HTML Clear the HTML options set for the selected layer
Clear current page Clear all the HTML options set in the current page
Show HTML config for selected artboard Get an alert message listing HTML options set for current artboard

Limitations

  1. Only the artboards of the current page will be exported.
  2. A layer you wish to link or fix has to be a top-level layer, meaning it cannot be nested inside another layer.
  3. Make sure each artboard in the page has a unique name.

What's next?

  • Remove limitation #1 - perhaps user selects which pages
  • Remove limitation #2 - Link or fix nested layers
  • Open folder after export

Feedback & pull requests

All are welcome :)

License

MIT