add my-document source and image references, update associated content

1 files changed, 19 insertions, 12 deletions

diff --git a/docs/modules/get-started/pages/index.adoc b/docs/modules/get-started/pages/index.adoc
index 9daf9562..7e689c15 100644
--- a/docs/modules/get-started/pages/index.adoc
+++ b/docs/modules/get-started/pages/index.adoc
@@ -11,17 +11,25 @@ On this page, you'll learn how to run Asciidoctor on an AsciiDoc document and co
 == Generate HTML using the default converter
 
 Let's generate HTML 5 using Asciidoctor's default converter and stylesheet from an AsciiDoc document.
-If you want to follow along with the examples, #download the _my-sample.adoc_ file# or use your own AsciiDoc document.
 
-. Open a terminal and switch (`cd`) into the directory where your AsciiDoc document is saved.
+. To follow along with the steps below, copy the contents of <<ex-my-doc>> into a new plain text file or use your own AsciiDoc document.
++
+.my-document.adoc
+[source#ex-my-doc,asciidoc]
+----
+include::html-backend:example$my-document.adoc[tags=title;body]
+----
 
+. Make sure to save the file with the _.adoc_ file extension.
+. Open a terminal and switch (`cd`) into the directory where your AsciiDoc document is saved.
++
  $ cd directory-name
 
 . Call Asciidoctor with the `asciidoctor` command, followed by file name of the AsciiDoc document.
 Since HTML 5 is Asciidoctor's default output, we don't need to specify a converter.
 +
 --
- $ asciidoctor my-sample.adoc
+ $ asciidoctor my-document.adoc
 
 As long as the document didn't contain any syntax errors, you won't see any messages printed to your terminal.
 --
@@ -30,21 +38,20 @@ As long as the document didn't contain any syntax errors, you won't see any mess
 +
 --
  $ ls
- my-sample.adoc  my-sample.html
+ my-document.adoc  my-document.html
 
-You should see a new file named [.path]_my-sample.html_.
+You should see a new file named [.path]_my-document.html_.
 Asciidoctor derives the name of the output file from the name of the input document.
 --
 
-. Open [.path]_my-sample.html_ in your web browser.
+. Open [.path]_my-document.html_ in your web browser.
 The converted document should look like the example below.
 +
-====
-#fix ex#
-//image::mysample.png[]
-====
-+
+--
+image::html-backend:my-document.png[]
+
 The document's text, titles, and link is styled by the default Asciidoctor stylesheet, which is embedded in the HTML output.
-As a result, you could save [.path]_my-sample.html_ to any computer and it will look the same.
+As a result, you could save [.path]_my-document.html_ to any computer and it will look the same.
+--
 
 TIP: Most of the examples in the general documentation use the CLI, but there are usually corresponding API examples under xref:api:index.adoc[].