1 files changed, 27 insertions, 0 deletions
diff --git a/docs/config/templates/runnableExample.template.html b/docs/config/templates/runnableExample.template.html
new file mode 100644
index 00000000..4fe2a38f
--- /dev/null
+++ b/docs/config/templates/runnableExample.template.html
@@ -0,0 +1,27 @@
+{# Be aware that we need these extra new lines here or marked will not realise that the <div>
+   is HTML and wrap each line in a <p> - thus breaking the HTML #}
+
+<div>
+  <a ng-href="http://plnkr.co/edit/ngdoc:{$ doc.example.id $}@{{docsVersion}}?p=preview" class="btn pull-right" target="_blank">
+    <i class="glyphicon glyphicon-edit">&nbsp;</i>
+    Edit in Plunker</a>
+  <div class="runnable-example"
+      path="{$ doc.example.outputFolder $}"
+      {%- for attrName, attrValue in doc.example.attributes %}
+      {$ attrName $}="{$ attrValue $}"{% endfor %}>
+
+   {% for fileName, file in doc.example.files %}
+    <div class="runnable-example-file" {% for attrName, attrValue in file.attributes %}
+      {$ attrName $}="{$ attrValue $}"{% endfor %}>
+      {% code -%}
+      {$ file.fileContents $}
+      {%- endcode %}  
+    </div>
+  {% endfor %}
+
+    <iframe class="runnable-example-frame" src="{$ doc.example.outputFolder $}/index.html" name="{$ doc.example.id $}"></iframe>
+  </div>
+</div>
+
+{# Be aware that we need these extra new lines here or marked will not realise that the <div>
+   above is HTML and wrap each line in a <p> - thus breaking the HTML #}
+\ No newline at end of file