diff --git a/ui-samples-plugin/src/main/java/jenkins/plugins/ui_samples/UISample.java b/ui-samples-plugin/src/main/java/jenkins/plugins/ui_samples/UISample.java
index 8a1e4849bc1ddb378658e2e7f49068469fef41ac..12218dd5ab051b41be39edac94d223df0f4c52a6 100644
--- a/ui-samples-plugin/src/main/java/jenkins/plugins/ui_samples/UISample.java
+++ b/ui-samples-plugin/src/main/java/jenkins/plugins/ui_samples/UISample.java
@@ -84,7 +84,7 @@ public abstract class UISample implements ExtensionPoint, Action, Describable<UI
 
         public URL resolve() {
             return UISample.this.getClass().getResource(
-                name.endsWith(".jelly") ? UISample.this.getClass().getSimpleName()+"/"+name : name);
+                (name.endsWith(".jelly") || name.endsWith(".groovy")) ? UISample.this.getClass().getSimpleName()+"/"+name : name);
         }
 
         /**
diff --git a/ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/SyntaxHighlightedTextArea/index.groovy b/ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/SyntaxHighlightedTextArea/index.groovy
index 2cb46db03353fc662f293099c0f34a7114d67ba7..48998f33c526f783a515f8df91b189a1cd347461 100644
--- a/ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/SyntaxHighlightedTextArea/index.groovy
+++ b/ui-samples-plugin/src/main/resources/jenkins/plugins/ui_samples/SyntaxHighlightedTextArea/index.groovy
@@ -1,38 +1,33 @@
-def l=namespace(lib.LayoutTagLib)
 def st=namespace("jelly:stapler")
 
-l.layout(title:_("Syntax Highlighted Text Area")) {
-    l.main_panel {
-        h1(_("Syntax Highlighted Text Area"))
+namespace("/lib/samples").sample(title:_("Syntax Highlighted Text Area")) {
+    p("CodeMirror can be used to turn ordinary text area into syntax-highlighted content-assistable text area")
 
-        p("CodeMirror can be used to turn ordinary text area into syntax-highlighted content-assistable text area")
+    // this loads the necessary JavaScripts, if it hasn't loaded already
+    // the first we load is the mode definition file (mode as in Emacs mode)
+    // the second is the theme.
+    //
+    // for other modes, look for "clike.js" in your IDE and see adjacent folders.
+    st.adjunct(includes:"org.kohsuke.stapler.codemirror.mode.clike.clike")
+    st.adjunct(includes:"org.kohsuke.stapler.codemirror.theme.default")
 
-        // this loads the necessary JavaScripts, if it hasn't loaded already
-        // the first we load is the mode definition file (mode as in Emacs mode)
-        // the second is the theme.
-        //
-        // for other modes, look for "clike.js" in your IDE and see adjacent folders.
-        st.adjunct(includes:"org.kohsuke.stapler.codemirror.mode.clike.clike")
-        st.adjunct(includes:"org.kohsuke.stapler.codemirror.theme.default")
+    // TODO: adjunct tag doesn't work because 'wroteHEAD' is not set correctly
+    // TODO: provide abstraction that hides CSS hookup
 
-        // TODO: adjunct tag doesn't work because 'wroteHEAD' is not set correctly
-        // TODO: provide abstraction that hides CSS hookup
+    // this text area is what we convert to the super text area
+    // we use CSS class to hook up the initialization script. In this particular demo,
+    // the ID attribute can be used, but in more general case (such as when you use this in your Builder, etc.,
+    // a single web page may end up containing multiple instances of such text area, so the CSS class works better.
+    textarea("class":"my-groovy-textbox", style:"width:100%; height:10em")
 
-        // this text area is what we convert to the super text area
-        // we use CSS class to hook up the initialization script. In this particular demo,
-        // the ID attribute can be used, but in more general case (such as when you use this in your Builder, etc.,
-        // a single web page may end up containing multiple instances of such text area, so the CSS class works better.
-        textarea("class":"my-groovy-textbox", style:"width:100%; height:10em")
-
-        // see CodeMirror web site for more about how to control the newly instantiated text area.
-        script("""
-            hudsonRules["TEXTAREA.my-groovy-textbox"] = function(e) {
-                var w = CodeMirror.fromTextArea(e,{
-                  mode:"text/x-groovy",
-                  lineNumbers: true
-                }).getWrapperElement();
-                w.setAttribute("style","border:1px solid black; margin-top: 1em; margin-bottom: 1em")
-            }
-        """)
-    }
+    // see CodeMirror web site for more about how to control the newly instantiated text area.
+    script("""
+        hudsonRules["TEXTAREA.my-groovy-textbox"] = function(e) {
+            var w = CodeMirror.fromTextArea(e,{
+              mode:"text/x-groovy",
+              lineNumbers: true
+            }).getWrapperElement();
+            w.setAttribute("style","border:1px solid black; margin-top: 1em; margin-bottom: 1em")
+        }
+    """)
 }