blob: 88c96c8cdfc2a91c121f396a6cac8d4c6e99f8e7 [file] [log] [blame]
<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>NetBeans Code Template Module Tutorial</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="NetBeans Code Template Module Tutorial - Apache NetBeans">
<meta name="author" content="Apache NetBeans">
<meta name="description" content="NetBeans Code Template Module Tutorial - Apache NetBeans">
<meta name="keywords" content="Apache NetBeans Platform, Platform Tutorials, NetBeans Code Template Module Tutorial">
<meta name="generator" content="Apache NetBeans">
<link rel="stylesheet" href="../../../../_/css/font-awesome.min.css">
<link rel="alternate" type="application/atom+xml" title="Apache NetBeans Blog" href="https://netbeans.apache.org/blogs/atom" />
<link rel="stylesheet" href="../../../../_/css/highlightjs/default.min.css">
<link rel="stylesheet" href="../../../../_/css/netbeans.css">
<link rel="apple-touch-icon" sizes="180x180" href="../../../../_/images/fav/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="../../../../_/images/fav/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="../../../../_/images/fav/favicon-16x16.png">
<link rel="manifest" href="../../../../_/images/fav/site.webmanifest">
<link rel="mask-icon" href="../../../../_/images/fav/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#ffc40d">
<meta name="theme-color" content="#ffffff">
<link href="../../../../_/css/font-open-sans.css" rel="stylesheet">
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
</head>
<body>
<div class="title-bar" data-responsive-toggle="responsive-menu" data-hide-for="medium">
<button type="button" data-toggle="responsive-menu"><i style='font-size: 32px; color: #fff; padding: 8px' class='fa fa-bars'></i></button>
<div class="title-bar-title">Apache NetBeans</div>
</div>
<div class="top-bar" id="responsive-menu">
<div class='top-bar-left'>
<a class='title' href="../../../../index.html"><img src='../../../../_/images/apache-netbeans.svg' style='padding: 8px; height: 48px;'> Apache NetBeans</a>
</div>
<div class="top-bar-right">
<ul class="vertical medium-horizontal menu" data-responsive-menu="drilldown medium-dropdown">
<li> <input id="search-input" type="text" placeholder="Search the docs"> </li>
<li> <a href="../../../../front/main/community">Community</a> </li>
<li> <a href="../../../../front/main/participate">Participate</a> </li>
<li> <a href="../../../../front/main/blogs">Blog</a></li>
<li> <a href="../../../../front/main/help">Get Help</a> </li>
<li> <a href="https://plugins.netbeans.apache.org/">Plugins</a> </li>
<li> <a href="../../../../front/main/download">Download</a> </li>
</ul>
</div>
</div>
<!-- src/templates/news -->
<section class="hero news alternate">
<div class='grid-container'>
<div class='cell'>
<div class="annotation">Latest release</div>
<h1>Apache NetBeans 28</h1>
<p><a class="button success" href="../../../../front/main/download/nb28">Download</a></p>
</div>
</div>
</section>
<div class='grid-container main-content tutorial'>
<h1 class="sect0">NetBeans Code Template Module Tutorial</h1>
<div class="sectionbody">
<div class="admonitionblock note">
<table>
<tbody><tr>
<td class="icon"><i class="fa icon-note" title="Note"></i></td>
<td class="content">This tutorial needs a review.
You can <a href="https://github.com/apache/netbeans-antora-tutorials/edit/main/modules/ROOT/pages/tutorials/nbm-code-template.adoc" title="Edit this tutorial in github">edit it in GitHub </a>
following these <a href="../../../../tutorial/main/kb/docs/contributing">contribution guidelines.</a></td>
</tr></tbody>
</table>
</div>
</div>
<div id="toc" class="toc">
<div id="toctitle"></div>
<ul class="sectlevel1">
<li><a href="#_setting_up_the_module_project">Setting up the Module Project</a></li>
<li><a href="#_creating_the_code_templates">Creating the Code Templates</a></li>
<li><a href="#_declaring_and_registering_the_code_templates">Declaring and Registering the Code Templates</a></li>
<li><a href="#_building_and_installing_the_code_templates">Building and Installing the Code Templates</a>
<ul class="sectlevel2">
<li><a href="#_trying_out_the_code_templates">Trying Out the Code Templates</a></li>
<li><a href="#_creating_a_shareable_module_binary">Creating a Shareable Module Binary</a></li>
</ul>
</li>
<li><a href="#_next_steps">Next Steps</a></li>
</ul>
</div>
<div id="preamble">
<div class="sectionbody">
<div class="paragraph">
<p>This tutorial demonstrates how to create a NetBeans module that provides code templates. Changes can be made by the user in the Options window, either to customize the existing code templates or to add new ones:</p>
</div>
<div class="imageblock">
<div class="content">
<img src="../../_images/tutorials/code-templates_72_pic2.png" alt="code templates 72 pic2">
</div>
</div>
<div class="paragraph">
<p>To provide this functionality, you will not need to use any Java code at all. As shown in this tutorial, you will only need to provide an XML file that defines your code templates, by registering it in your module&#8217;s <code>layer.xml</code> file.</p>
</div>
<div class="paragraph">
<p>For troubleshooting purposes, you are welcome to download the <a href="http://web.archive.org/web/20170409072842/http://java.net/projects/nb-api-samples/show/versions/8.0/tutorials/HTMLCodeTemplates">completed tutorial source code</a>.</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_setting_up_the_module_project"><a class="anchor" href="#_setting_up_the_module_project"></a>Setting up the Module Project</h2>
<div class="sectionbody">
<div class="paragraph">
<p>Before you start writing the module, you have to make sure you that your project is set up correctly. The IDE provides a wizard that sets up all the basic files needed for a module.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="1">
<li>
<p>Choose File &gt; New Project (Ctrl+Shift+N). Under Categories, select NetBeans Modules. Under Projects, select Module. Click Next.</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="2">
<li>
<p>In the Name and Location panel, type <code>HTMLCodeTemplates</code> in the Project Name field. Change the Project Location to any directory on your computer. Click Next.</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="3">
<li>
<p>In the Basic Module Configuration panel, type <code>org.netbeans.htmlcodetemplate</code> in Code Name Base. Click Finish.</p>
</li>
</ol>
</div>
<div class="paragraph">
<p>The IDE creates the <code>HTMLCodeTemplates</code> project. The project contains all of your sources and project metadata, such as the project&#8217;s Ant build script. The project opens in the IDE. You can view its logical structure in the Projects window (Ctrl-1) and its file structure in the Files window (Ctrl-2).</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_creating_the_code_templates"><a class="anchor" href="#_creating_the_code_templates"></a>Creating the Code Templates</h2>
<div class="sectionbody">
<div class="paragraph">
<p>In this section, you create the code templates for HTML files.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="1">
<li>
<p>Right-click the <code>org.netbeans.modules.htmlcodetemplate</code> node and choose New &gt; Other &gt; XML &gt; XML Document. Click Next.</p>
</li>
</ol>
</div>
<div class="paragraph">
<p>1.
Type <code>org-netbeans-modules-htmleditor-snippets</code> and in "Folder" browse to the "htmlcondetemplate" folder:</p>
</div>
<div class="imageblock">
<div class="content">
<img src="../../_images/tutorials/code-templates_72_pic1.png" alt="code templates 72 pic1">
</div>
</div>
<div class="paragraph">
<p>Click Next and then click Finish.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="3">
<li>
<p>Replace the default content of the <code>org-netbeans-modules-htmleditor-snippets.xml</code> file with the following:</p>
</li>
</ol>
</div>
<div class="listingblock">
<div class="content">
<pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
&lt;!DOCTYPE codetemplates PUBLIC "-//NetBeans//DTD Editor Code Templates settings 1.0//EN" "https://netbeans.org/dtds/EditorCodeTemplates-1_0.dtd"&gt;
&lt;codetemplates&gt;
&lt;codetemplate abbreviation="snf" xml:space="preserve"&gt;
&lt;code&gt;&lt;![CDATA[Select "New File" (Ctrl-N) in the File menu]]&gt;&lt;/code&gt;
&lt;description&gt;&lt;![CDATA[Code template for selecting "New File".]]&gt;&lt;/description&gt;
&lt;/codetemplate&gt;
&lt;codetemplate abbreviation="pe" xml:space="preserve"&gt;
&lt;code&gt;&lt;![CDATA[Press Enter.]]&gt;&lt;/code&gt;
&lt;description&gt;&lt;![CDATA[Code template for clicking the "Enter" key.]]&gt;&lt;/description&gt;
&lt;/codetemplate&gt;
&lt;/codetemplates&gt;</code></pre>
</div>
</div>
<div class="paragraph">
<p>You now have two code templates. The first will be shown when "snf" is typed, followed by the expansion key, while the second requires "pe" to be typed, prior to the expansion key being pressed.</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_declaring_and_registering_the_code_templates"><a class="anchor" href="#_declaring_and_registering_the_code_templates"></a>Declaring and Registering the Code Templates</h2>
<div class="sectionbody">
<div class="paragraph">
<p>Code templates are registered in the <code>layer.xml</code> file for the MIME type to which they apply.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="1">
<li>
<p>Right-click the <code>org.netbeans.modules.htmlcodetemplate</code> node and choose New &gt; Other &gt; Module Development &gt; XML Layer. Click Next and then click Finish.</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="2">
<li>
<p>Replace the content of the layer.xml file with the following:</p>
</li>
</ol>
</div>
<div class="listingblock">
<div class="content">
<pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
&lt;!DOCTYPE filesystem PUBLIC "-//NetBeans//DTD Filesystem 1.2//EN" "https://netbeans.org/dtds/filesystem-1_2.dtd"&gt;
&lt;filesystem&gt;
&lt;folder name="Editors"&gt;
&lt;folder name="text"&gt;
&lt;folder name="html"&gt;
&lt;folder name="CodeTemplates"&gt;
&lt;file name="org-netbeans-modules-htmleditor-snippets.xml" url="org-netbeans-modules-htmleditor-snippets.xml"/&gt;
&lt;/folder&gt;
&lt;/folder&gt;
&lt;/folder&gt;
&lt;/folder&gt;
&lt;/filesystem&gt;</code></pre>
</div>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_building_and_installing_the_code_templates"><a class="anchor" href="#_building_and_installing_the_code_templates"></a>Building and Installing the Code Templates</h2>
<div class="sectionbody">
<div class="paragraph">
<p>Now we need to think about installation and distribution. In the first section below, we install the code templates, next we create an NBM file and examine distribution channels.</p>
</div>
<div class="sect2">
<h3 id="_trying_out_the_code_templates"><a class="anchor" href="#_trying_out_the_code_templates"></a>Trying Out the Code Templates</h3>
<div class="paragraph">
<p>Install and try out the code templates, by following the steps below.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="1">
<li>
<p>In the Projects window, right-click the <code>HTMLCodeTemplates</code> project and choose Run. The module is built and installed in the target platform. The target platform opens so that you can try out your new module. The default target platform is the installation used by the current instance of the development IDE.</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="2">
<li>
<p>Look in the Options window and notice your two code templates:</p>
</li>
</ol>
</div>
<div class="imageblock">
<div class="content">
<img src="../../_images/tutorials/code-templates_72_pic2.png" alt="code templates 72 pic2">
</div>
</div>
<div class="olist arabic">
<ol class="arabic" start="3">
<li>
<p>Open an HTML file and type "snf". Press the Tab key and notice that the abbreviation expands. Do the same for "pe".</p>
</li>
</ol>
</div>
</div>
<div class="sect2">
<h3 id="_creating_a_shareable_module_binary"><a class="anchor" href="#_creating_a_shareable_module_binary"></a>Creating a Shareable Module Binary</h3>
<div class="paragraph">
<p>An NBM file is the binary version of the module that provides the code templates. Below, using one menu item, we create the NBM file.</p>
</div>
<div class="olist arabic">
<ol class="arabic" start="1">
<li>
<p>In the Projects window, right-click the <code>HTMLCodeTemplates</code> project and choose Create NBM. The NBM file is created and you can view it in the Files window (Ctrl-2).</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="2">
<li>
<p>Make the module available to others via, for example, the <a href="http://plugins.netbeans.org/PluginPortal/">Plugin Portal</a>.</p>
</li>
</ol>
</div>
<div class="olist arabic">
<ol class="arabic" start="3">
<li>
<p>The recipient can install the module by using their IDE&#8217;s Plugin Manager. They would choose Tools &gt; Plugins from the main menu.
<a href="../../../../front/main/community/mailing-lists/" class="xref page">Send Us Your Feedback</a></p>
</li>
</ol>
</div>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_next_steps"><a class="anchor" href="#_next_steps"></a>Next Steps</h2>
<div class="sectionbody">
<div class="paragraph">
<p>For more information about creating and developing NetBeans modules, see the following resources:</p>
</div>
<div class="ulist">
<ul>
<li>
<p><a href="../../kb/docs/platform/" class="xref page">Other Related Tutorials</a></p>
</li>
<li>
<p><a href="https://bits.netbeans.org/dev/javadoc/index.html">NetBeans API Javadoc</a></p>
</li>
</ul>
</div>
</div>
</div>
<section class='tools'>
<ul class="menu align-center">
<li><a title="Facebook" href="https://www.facebook.com/NetBeans"><i class="fa fa-md fa-facebook"></i></a></li>
<li><a title="Twitter" href="https://twitter.com/netbeans"><i class="fa fa-md fa-twitter"></i></a></li>
<li><a title="Github" href="https://github.com/apache/netbeans"><i class="fa fa-md fa-github"></i></a></li>
<li><a title="YouTube" href="https://www.youtube.com/user/netbeansvideos"><i class="fa fa-md fa-youtube"></i></a></li>
<li><a title="Atom Feed" href="https://netbeans.apache.org/blogs/atom"><i class="fa fa-mf fa-rss"></i></a></li>
<li><a title="Slack" href="https://tinyurl.com/netbeans-slack-signup/"><i class="fa fa-md fa-slack"></i></a></li>
<li><a title="Issues" href="https://github.com/apache/netbeans/issues"><i class="fa fa-mf fa-bug"></i></a></li>
</ul>
<ul class="menu align-center">
<li><a href="https://github.com/apache/netbeans-antora-tutorials/edit/main/modules/ROOT/pages/tutorials/nbm-code-template.adoc" title="See this page in github"><i class="fa fa-md fa-edit"></i> See this page in GitHub.</a></li>
</ul>
</section>
</div>
<div class='grid-container incubator-area' style='margin-top: 64px'>
<div class='grid-x grid-padding-x'>
<div class='large-auto cell text-center'>
<a href="https://www.apache.org/">
<img style="height: 60px" title="Apache Software Foundation" src="../../../../_/images/asf_logo_wide.svg" />
</a>
</div>
<div class='large-auto cell text-center'>
<a href="https://www.apache.org/events/current-event.html">
<img style="width:234px; height: 60px;" title="Apache Software Foundation current event" src="https://www.apache.org/events/current-event-234x60.png"/>
</a>
</div>
</div>
</div>
<footer>
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="large-auto cell">
<h1><a href="../../../../front/main/about">About</a></h1>
<ul>
<li><a href="../../../../front/main/community/who">Who's Who</a></li>
<li><a href="https://www.apache.org/foundation/thanks.html">Thanks</a></li>
<li><a href="https://www.apache.org/foundation/sponsorship.html">Sponsorship</a></li>
<li><a href="https://www.apache.org/security/">Security</a></li>
</ul>
</div>
<div class="large-auto cell">
<h1><a href="../../../../front/main/community">Community</a></h1>
<ul>
<li><a href="../../../../front/main/community/mailing-lists">Mailing lists</a></li>
<li><a href="../../../../front/main/community/committer">Becoming a committer</a></li>
<li><a href="../../../../front/main/community/events">NetBeans Events</a></li>
<li><a href="https://www.apache.org/events/current-event.html">Apache Events</a></li>
</ul>
</div>
<div class="large-auto cell">
<h1><a href="../../../../front/main/participate">Participate</a></h1>
<ul>
<li><a href="../../../../front/main/participate/submit-pr">Submitting Pull Requests</a></li>
<li><a href="../../../../front/main/participate/report-issue">Reporting Issues</a></li>
<li><a href="../../../../front/main/participate/#documentation">Improving the documentation</a></li>
</ul>
</div>
<div class="large-auto cell">
<h1><a href="../../../../front/main/help">Get Help</a></h1>
<ul>
<li><a href="../../../../front/main/help/#documentation">Documentation</a></li>
<li><a href="../../../../wiki/main/wiki">Wiki</a></li>
<li><a href="../../../../front/main/help/#support">Community Support</a></li>
<li><a href="../../../../front/main/help/commercial-support">Commercial Support</a></li>
</ul>
</div>
<div class="large-auto cell">
<h1><a href="../../../../front/main/download">Download</a></h1>
<ul>
<li><a href="../../../../front/main/download">Releases</a></li>
<li><a href="https://plugins.netbeans.apache.org/">Plugins</a></li>
<li><a href="../../../../front/main/download/#_daily_builds_and_building_from_source">Building from source</a></li>
<li><a href="../../../../front/main/download/#_older_releases">Previous releases</a></li>
</ul>
</div>
</div>
</div>
</footer>
<div class='footer-disclaimer'>
<div class="footer-disclaimer-content">
<p>Copyright &copy; 2017-2025 <a href="https://www.apache.org">The Apache Software Foundation</a>.</p>
<p>Licensed under the Apache <a href="https://www.apache.org/licenses/">license</a>, version 2.0</p>
<div style='max-width: 40em; margin: 0 auto'>
<p>Apache, Apache NetBeans, NetBeans, the Apache feather logo and the Apache NetBeans logo are trademarks of <a href="https://www.apache.org">The Apache Software Foundation</a>.</p>
<p>Oracle and Java are registered trademarks of Oracle and/or its affiliates.</p>
<p>The Apache NetBeans website conforms to the <a href="https://privacy.apache.org/policies/privacy-policy-public.html">Apache Software Foundation Privacy Policy</a></p>
</div>
</div>
</div>
<script src="../../../../_/js/vendor/lunr.js"></script>
<script src="../../../../_/js/search-ui.js" id="search-ui-script" data-site-root-path="../../../.." data-snippet-length="100" data-stylesheet="../../../../_/css/search.css"></script>
<script async src="../../../../search-index.js"></script>
<script src="../../../../_/js/vendor/jquery.min.js"></script>
<script src="../../../../_/js/vendor/what-input.min.js"></script>
<script src="../../../../_/js/vendor/foundation.min.js"></script>
<script src="../../../../_/js/vendor/jquery.colorbox-min.js"></script>
<script src="../../../../_/js/netbeans.js"></script>
<script>
$(function(){ $(document).foundation(); });
</script>
<script src="../../../../_/js/vendor/highlight.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', (event) => {
document.querySelectorAll('pre code').forEach((el) => {
hljs.highlightElement(el);
});
});
</script>
</body>
</html>