Live HTML Preview

Posted by netbeanstips on Oracle Blogs See other posts from Oracle Blogs or by netbeanstips
Published on Thu, 31 Oct 2013 15:08:53 +0000 Indexed on 2013/10/31 16:06 UTC
Read the original article Hit count: 143

Filed under:

When you need to edit an HTML document in NetBeans you may find useful this little plugin that adds a Preview tab to HTML editor window. The plugin works with some small issues in NetBeans 7.4 but I recommend using development builds instead.

So install the plugin, restart NetBeans and open any HTML document. Notice there's a Preview button in editor's toolbar (see the red rectangle in the picture below). Now split the editor window by dragging the split button at top right corner. You can also use menu View - Split - Vertically.

split editor

 Then in the bottom split part toggle Preview button.

HTML preview

You will get a live preview of your HTML source code. The preview pane will auto-refresh as you edit the HTML code. There are even some handy tools in Preview toolbar, for example you can resize the preview browser to match the screen dimensions of various device types.

I know there is full-blown HTML5 support in NetBeans 7.4. But if you need to edit a single document or when you're running Java-only NetBeans distribution this plugin may come handy...

Note: The plugin is built on top of embedded WebKit browser which is based on JavaFX WebView component. So there might be some issue when using the plugin on some flavors of Linux.

© Oracle Blogs or respective owner

Related posts about /Oracle