diff --git a/assets/images/help/profile/collapsed-section-example.png b/assets/images/help/profile/collapsed-section-example.png
new file mode 100644
index 0000000000..f83d76ba63
Binary files /dev/null and b/assets/images/help/profile/collapsed-section-example.png differ
diff --git a/assets/images/help/profile/edit-profile-readme.png b/assets/images/help/profile/edit-profile-readme.png
new file mode 100644
index 0000000000..5a52937ea7
Binary files /dev/null and b/assets/images/help/profile/edit-profile-readme.png differ
diff --git a/assets/images/help/profile/lightmode-image-example.png b/assets/images/help/profile/lightmode-image-example.png
new file mode 100644
index 0000000000..4d42d6fd0e
Binary files /dev/null and b/assets/images/help/profile/lightmode-image-example.png differ
diff --git a/assets/images/help/profile/markdown-quote-example.png b/assets/images/help/profile/markdown-quote-example.png
new file mode 100644
index 0000000000..7459ec47a1
Binary files /dev/null and b/assets/images/help/profile/markdown-quote-example.png differ
diff --git a/assets/images/help/profile/markdown-table-example.png b/assets/images/help/profile/markdown-table-example.png
new file mode 100644
index 0000000000..77f74063af
Binary files /dev/null and b/assets/images/help/profile/markdown-table-example.png differ
diff --git a/assets/images/help/profile/readme-commit-changes.png b/assets/images/help/profile/readme-commit-changes.png
new file mode 100644
index 0000000000..4caed6260a
Binary files /dev/null and b/assets/images/help/profile/readme-commit-changes.png differ
diff --git a/content/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme.md b/content/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme.md
index 1fb69ef80b..c0511693a3 100644
--- a/content/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme.md
+++ b/content/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme.md
@@ -24,7 +24,7 @@ You decide what information to include in your profile README, so you have full
![Profile README file displayed on profile](/assets/images/help/repository/profile-with-readme.png)
-You can format text and include emoji, images, and GIFs in your profile README by using {% data variables.product.company_short %} Flavored Markdown. For more information, see "[Getting started with writing and formatting on {% data variables.product.prodname_dotcom %}](/github/writing-on-github/getting-started-with-writing-and-formatting-on-github)."
+You can format text and include emoji, images, and GIFs in your profile README by using {% data variables.product.company_short %} Flavored Markdown. For more information, see "[Getting started with writing and formatting on {% data variables.product.prodname_dotcom %}](/github/writing-on-github/getting-started-with-writing-and-formatting-on-github)." For a hands-on guide to customizing your profile README, see "[Quickstart for writing on {% data variables.product.prodname_dotcom %}](/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github)."
## Prerequisites
diff --git a/content/developers/overview/managing-deploy-keys.md b/content/developers/overview/managing-deploy-keys.md
index 9e2ba511e5..45e840a023 100644
--- a/content/developers/overview/managing-deploy-keys.md
+++ b/content/developers/overview/managing-deploy-keys.md
@@ -83,13 +83,15 @@ See [our guide on creating a personal access token](/authentication/keeping-your
#### Setup
1. [Run the `ssh-keygen` procedure][generating-ssh-keys] on your server, and remember where you save the generated public and private rsa key pair.
-2. In the upper-right corner of any {% data variables.product.product_name %} page, click your profile photo, then click **Your profile**. ![Navigation to profile](/assets/images/profile-page.png)
-3. On your profile page, click **Repositories**, then click the name of your repository. ![Repositories link](/assets/images/repos.png)
-4. From your repository, click **Settings**. ![Repository settings](/assets/images/repo-settings.png)
-5. In the sidebar, click **Deploy Keys**, then click **Add deploy key**. ![Add Deploy Keys link](/assets/images/add-deploy-key.png)
-6. Provide a title, paste in your public key. ![Deploy Key page](/assets/images/deploy-key.png)
-7. Select **Allow write access** if you want this key to have write access to the repository. A deploy key with write access lets a deployment push to the repository.
-8. Click **Add key**.
+{% data reusables.profile.navigating-to-profile %}
+
+ ![Navigation to profile](/assets/images/profile-page.png)
+1. On your profile page, click **Repositories**, then click the name of your repository. ![Repositories link](/assets/images/repos.png)
+2. From your repository, click **Settings**. ![Repository settings](/assets/images/repo-settings.png)
+3. In the sidebar, click **Deploy Keys**, then click **Add deploy key**. ![Add Deploy Keys link](/assets/images/add-deploy-key.png)
+4. Provide a title, paste in your public key. ![Deploy Key page](/assets/images/deploy-key.png)
+5. Select **Allow write access** if you want this key to have write access to the repository. A deploy key with write access lets a deployment push to the repository.
+6. Click **Add key**.
#### Using multiple repositories on one server
diff --git a/content/get-started/index.md b/content/get-started/index.md
index 18d0395a5c..4e69dd5e5e 100644
--- a/content/get-started/index.md
+++ b/content/get-started/index.md
@@ -32,6 +32,7 @@ featuredLinks:
- /get-started/onboarding/getting-started-with-github-enterprise-cloud
- /get-started/onboarding/getting-started-with-github-enterprise-server
- /get-started/onboarding/getting-started-with-github-ae
+ - /get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github
popular:
- /github/getting-started-with-github/signing-up-for-a-new-github-account
- /get-started/quickstart/hello-world
diff --git a/content/get-started/quickstart/communicating-on-github.md b/content/get-started/quickstart/communicating-on-github.md
index 73ae95ff70..746d67c59d 100644
--- a/content/get-started/quickstart/communicating-on-github.md
+++ b/content/get-started/quickstart/communicating-on-github.md
@@ -150,3 +150,5 @@ For {% data variables.product.prodname_discussions %}, you can{% ifversion fpt o
{% endif %}
For team discussions, you can edit or delete discussions on a team's page, and you can configure notifications for team discussions. For more information, see "[About team discussions](/organizations/collaborating-with-your-team/about-team-discussions)."
+
+To learn some advanced formatting features that will help you communicate, see "[Quickstart for writing on {% data variables.product.prodname_dotcom %}](/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github)."
\ No newline at end of file
diff --git a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/about-writing-and-formatting-on-github.md b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/about-writing-and-formatting-on-github.md
index 847979c78d..ffec457383 100644
--- a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/about-writing-and-formatting-on-github.md
+++ b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/about-writing-and-formatting-on-github.md
@@ -10,7 +10,7 @@ versions:
ghes: '*'
ghae: '*'
ghec: '*'
-shortTitle: Write & format on GitHub
+shortTitle: About writing & formatting
---
[Markdown](http://daringfireball.net/projects/markdown/) is an easy-to-read, easy-to-write syntax for formatting plain text.
@@ -42,3 +42,4 @@ You can enable a fixed-width font in every comment field on {% data variables.pr
- [{% data variables.product.prodname_dotcom %} Flavored Markdown Spec](https://github.github.com/gfm/)
- "[Basic writing and formatting syntax](/articles/basic-writing-and-formatting-syntax)"
- "[Working with advanced formatting](/articles/working-with-advanced-formatting)"
+- "[Quickstart for writing on {% data variables.product.prodname_dotcom %}](/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github)"
diff --git a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax.md b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax.md
index 5c4474325e..b229b71ca3 100644
--- a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax.md
+++ b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax.md
@@ -179,13 +179,7 @@ You can specify the theme an image is displayed for in Markdown by using the HTM
For example, the following code displays a sun image for light themes and a moon for dark themes:
-```HTML
-
-```
+{% data reusables.getting-started.picture-element-example %}
The old method of specifying images based on the theme, by using a fragment appended to the URL (`#gh-dark-mode-only` or `#gh-light-mode-only`), is deprecated and will be removed in favor of the new method described above.
{% endif %}
@@ -394,3 +388,4 @@ For more information, see Daring Fireball's "[Markdown Syntax](https://daringfir
- [{% data variables.product.prodname_dotcom %} Flavored Markdown Spec](https://github.github.com/gfm/)
- "[About writing and formatting on GitHub](/articles/about-writing-and-formatting-on-github)"
- "[Working with advanced formatting](/articles/working-with-advanced-formatting)"
+- "[Quickstart for writing on {% data variables.product.prodname_dotcom %}](/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github)"
diff --git a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/index.md b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/index.md
index dbd50c1ca9..8a64a3b4fc 100644
--- a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/index.md
+++ b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/index.md
@@ -12,6 +12,7 @@ versions:
ghae: '*'
ghec: '*'
children:
+ - /quickstart-for-writing-on-github
- /about-writing-and-formatting-on-github
- /basic-writing-and-formatting-syntax
shortTitle: Start writing on GitHub
diff --git a/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github.md b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github.md
new file mode 100644
index 0000000000..f9ce600b7e
--- /dev/null
+++ b/content/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github.md
@@ -0,0 +1,244 @@
+---
+title: Quickstart for writing on GitHub
+intro: Learn advanced formatting features by creating a {% ifversion ghae %}gist to describe yourself{% else %}README for your {% data variables.product.prodname_dotcom %} profile{% endif %}.
+versions:
+ fpt: '*'
+ ghes: '*'
+ ghae: '*'
+ ghec: '*'
+shortTitle: Quickstart
+---
+
+## Introduction
+
+Markdown is an easy-to-read, easy-to-write language for formatting plain text. You can use Markdown syntax, along with some additional HTML tags, to format your writing on {% data variables.product.prodname_dotcom %}, in places like repository READMEs and comments on pull requests and issues. In this guide, you'll learn some advanced formatting features by creating {% ifversion ghae %}a gist{% else %}or editing a README for your {% data variables.product.prodname_dotcom %} profile{% endif %}.
+
+If you're new to Markdown, you might want to start with "[Basic writing and formatting syntax](/articles/basic-writing-and-formatting-syntax)" or the [Communicate using Markdown](https://github.com/skills/communicate-using-markdown) {% data variables.product.prodname_learning %} course.
+
+{% ifversion not ghae %}
+
+If you already have a profile README, you can follow this guide by adding some features to your existing README, or by creating a gist with a Markdown file called something like `about-me.md`. For more information, see "[Creating gists](/get-started/writing-on-github/editing-and-sharing-content-with-gists/creating-gists)."
+
+{% endif %}
+
+{% ifversion ghae %}
+
+## Creating a gist
+
+Gists let you store or share code snippets and other pieces of information with others on {% data variables.product.product_location %}. To use formatting features in gists, add a gist file with a `.md` extension.
+
+1. Navigate to your {% data variables.gists.gist_homepage %}.
+1. Optionally, type a description for the gist, such as "About me."
+1. In the **Filename including extension...** field, type `about-me.md`.
+
+For more information, see "[Creating gists](/get-started/writing-on-github/editing-and-sharing-content-with-gists/creating-gists)."
+
+{% else %}
+
+## Creating or editing your profile README
+
+Your profile README lets you share information about yourself with the community on {% data variables.product.product_location %}. The README is displayed at the top of your profile page.
+
+If you don't already have a profile README, you can add one.
+
+1. Create a repository with the same name as your {% data variables.product.prodname_dotcom %} username, initializing the repository with a `README.md` file. For more information, see "[Managing your profile README](/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme#adding-a-profile-readme)."
+1. Edit the `README.md` file and delete the template text (beginning `### Hi there`) that is automatically added when you create the file.
+
+If you already have a profile README, you can edit it from your profile page.
+
+{% data reusables.profile.navigating-to-profile %}
+1. Click the {% octicon "pencil" aria-label="The Pencil icon" %} next to your profile README.
+
+ ![Screenshot of a profile page, with the pencil icon highlighted next to the profile README](/assets/images/help/profile/edit-profile-readme.png)
+
+{% endif %}
+
+## Adding an image to suit your visitors
+
+You can include images in your communication on {% data variables.product.prodname_dotcom %}. Here, you'll add a responsive image, such as a banner, to the top of your {% ifversion ghae %}gist{% else %}profile README{% endif %}.
+
+By using the HTML `` tag, add an `## About me` header and a short paragraph about yourself, like the following.
+
+ ```Markdown
+ ## About me
+
+ Hi, I'm Mona. You might recognize me as {% data variables.product.prodname_dotcom %}'s mascot.
+ ```
+1. Two lines below this paragraph, insert a table by copying and pasting the following markup.
+
+ ```Markdown{:copy}
+ | Rank | THING-TO-RANK |
+ |-----:|---------------|
+ | 1| |
+ | 2| |
+ | 3| |
+ ```
+1. In the column on the right, replace `THING-TO-RANK` with "Languages," "Hobbies," or anything else, and fill in the column with your list of things.
+1. To check the table has rendered correctly, click the **Preview** tab.
+
+For more information, see "[Organizing information with tables](/get-started/writing-on-github/working-with-advanced-formatting/organizing-information-with-tables)."
+
+### Example
+
+```Markdown
+## About me
+
+Hi, I'm Mona. You might recognize me as {% data variables.product.prodname_dotcom %}'s mascot.
+
+| Rank | Languages |
+|-----:|-----------|
+| 1| Javascript|
+| 2| Python |
+| 3| SQL |
+```
+
+### How it looks
+
+![Screenshot of the Preview tab, showing an "About me" heading and a rendered table with a list of languages](/assets/images/help/profile/markdown-table-example.png)
+
+## Adding a collapsed section
+
+To keep your content tidy, you can use the `` tag to create an expandible collapsed section.
+
+1. To create a collapsed section for the table you created, wrap your table in `` tags like in the following example.
+
+ ```HTML{:copy}
+
+ My top THINGS-TO-RANK
+
+ YOUR TABLE
+
+
+ ```
+1. Between the `` tags, replace `THINGS-TO-RANK` with whatever you ranked in your table.
+1. Optionally, to make the section display as open by default, add the `open` attribute to the `` tag.
+
+ ```HTML
+
+ ```
+1. To check the collapsed section has rendered correctly, click the **Preview** tab.
+
+### Example
+
+```HTML
+
+My top languages
+
+| Rank | Languages |
+|-----:|-----------|
+| 1| Javascript|
+| 2| Python |
+| 3| SQL |
+
+
+```
+
+### How it looks
+
+![Screenshot of the Preview tab, with a collapsed section called "My top languages" marked by a dropdown arrow](/assets/images/help/profile/collapsed-section-example.png)
+
+## Adding a quote
+
+Markdown has many other options for formatting your content. Here, you'll add a horizontal rule to divide your page and a blockquote to format your favorite quote.
+
+1. At the bottom of your file, two lines below the `` tag, add a horizontal rule by typing three or more dashes.
+
+ ```Markdown
+ ---
+ ```
+1. Below the `---` line, add a quote by typing markup like the following.
+
+ ```Markdown
+ > QUOTE
+ ```
+
+ Replace `QUOTE` with a quote of your choice. Alternatively, copy the quote from our example below.
+1. To check everything has rendered correctly, click the **Preview** tab.
+
+### Example
+
+```Markdown
+---
+> If we pull together and commit ourselves, then we can push through anything.
+
+— Mona the Octocat
+```
+
+### How it looks
+
+![Screenshot of the Preview tab, with an indented quote below a thick horizontal line](/assets/images/help/profile/markdown-quote-example.png)
+
+## Adding a comment
+
+You can use HTML comment syntax to add a comment that will be hidden in the output. Here, you'll add a comment to remind yourself to update your {% ifversion ghae %}gist{% else %}README{% endif %} later.
+
+1. Two lines below the `## About me` header, insert a comment by using the following markup.
+
+
+ <!-- COMMENT -->
+
+
+ Replace `COMMENT` with a "to-do" item you remind yourself to do something later (for example, to add more items to the table).
+1. To check your comment is hidden in the output, click the **Preview** tab.
+
+### Example
+
+
+## About me
+
+<!-- TO DO: add more details about me later -->
+
+
+## Saving your work
+
+When you're happy with your changes, save your {% ifversion ghae %}gist.
+
+- To keep your gist hidden from search engines but visible to anyone you share the URL with, click **Create secret gist**
+- If you're happy for your gist to be visible to anyone on {% data variables.product.product_location %}, click **Create internal gist**
+
+{% else %}profile README by clicking **Commit changes**.
+
+Committing directly to the `main` branch will make your changes visible to any visitor on your profile. If you want to save your work but aren't ready to make it visible on your profile, you can select **Create a new branch for this commit and start a pull request**.
+
+![Screenshot of the "Commit changes" section](/assets/images/help/profile/readme-commit-changes.png)
+
+{% endif %}
+
+## Next steps
+
+- Continue to learn about advanced formatting features. For example, see {% ifversion fpt or ghec %}"[Creating diagrams](/get-started/writing-on-github/working-with-advanced-formatting/creating-diagrams)" and {% endif %}"[Creating and highlighting codeblocks](/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks)."
+- Use your new skills as you communicate across GitHub, in issues, pull requests, and discussions. For more information, see "[Communicating on {% data variables.product.prodname_dotcom %}](/get-started/quickstart/communicating-on-github)."
diff --git a/data/reusables/getting-started/picture-element-example.md b/data/reusables/getting-started/picture-element-example.md
new file mode 100644
index 0000000000..cc1bfdac06
--- /dev/null
+++ b/data/reusables/getting-started/picture-element-example.md
@@ -0,0 +1,7 @@
+```HTML
+
+
+```
\ No newline at end of file
diff --git a/data/reusables/profile/navigating-to-profile.md b/data/reusables/profile/navigating-to-profile.md
new file mode 100644
index 0000000000..019925a783
--- /dev/null
+++ b/data/reusables/profile/navigating-to-profile.md
@@ -0,0 +1 @@
+1. In the upper-right corner of any {% data variables.product.product_name %} page, click your profile photo, then click **Your profile**.
\ No newline at end of file