Debug School

Cover image for Writing a Great Post Title
Suyash Sambhare
Suyash Sambhare

Posted on

Writing a Great Post Title

#devops #tags #post #guidelines

Writing a Great Post Title

Think of your post title as a super short (but compelling!) description — like an overview of the actual post in one short sentence.
Use keywords where appropriate to help ensure people can find your post by search.

Tagging Guidelines

Tags help people find your post - think of them as the topics or categories that best describe your post.
Add up to four comma-separated tags per post. Use existing tags whenever possible.
Some tags have special posting guidelines - double check to make sure your post complies with them.

Editor Basics

Use Markdown to write and format posts.
Commonly used syntax
URL:

[deleted user] image

[Deleted User]

.
Embed rich content such as Tweets, YouTube videos, etc. Use the complete See a list of supported embeds.
In addition to images for the post's content, you can also drag and drop a cover image.

Liquid Tags

Supported URL Embeds

  • Debug School Comment
  • Debug School Link
  • Debug School Link
  • Debug School Listing
  • Debug School Organization
  • Debug School Podcast Episode
  • Debug School Tag
  • Debug School User Profile
  • asciinema
  • CodePen
  • CodeSandbox
  • DotNetFiddle
  • GitHub Gist, Issue or Repository
  • Glitch
  • Instagram
  • JSFiddle
  • JSitor
  • Loom
  • Kotlin
  • Medium
  • Next Tech
  • Reddit
  • Replit
  • Slideshare
  • Speaker Deck
  • SoundCloud
  • Spotify
  • StackBlitz
  • Stackery
  • Stack Exchange or Stack Overflow
  • Twitch
  • Twitter
  • Twitter timeline
  • Wikipedia
  • Vimeo
  • YouTube

Supported Non-URL Embeds
Call To Action (CTA)
{% cta link %} description {% endcta %}
Provide a link that a user will be redirected to. The description will contain the label/description for the call to action.

Details
You can embed a details HTML element by using details, spoiler, or collapsible. The summary will be what the dropdown title displays. The content will be the text hidden behind the dropdown. This is great for when you want to hide text (i.e. answers to questions) behind a user action/intent (i.e. a click).

{% details summary %} content {% enddetails %}
{% spoiler summary %} content {% endspoiler %}
{% collapsible summary %} content {% endcollapsible %}

KaTex
Place your mathematical expression within a KaTeX liquid block, as follows:

{% katex %}
c = \pm\sqrt{a^2 + b^2}
{% endkatex %}

c=±a2+b2 c = \pm\sqrt{a^2 + b^2}

To render KaTeX inline add the "inline" option:

{% katex inline %}
c = \pm\sqrt{a^2 + b^2}
{% endkatex %}

c=±a2+b2 c = \pm\sqrt{a^2 + b^2}

RunKit
Put executable code within a runkit liquid block, as follows:

// hidden setup JavaScript code goes in this preamble area const hiddenVar = 42 // visible, reader-editable JavaScript code goes here console.log(hiddenVar)

✍️ Markdown

Below are some examples of commonly used markdown syntax. If you want to dive deeper, check out this cheat sheet.

Bold & Italic
Italics: *asterisks* or _underscores_

Bold: **double asterisks** or __double underscores__

Links
I'm an inline link: [I'm an inline link](https://www.debug.school/suyash)

Anchored links (For things like a Table of Contents)

      ## Table Of Contents
        * [Chapter 1](#chapter-1)
        * [Chapter 2](#chapter-2)

      ### Chapter 1 <a name="chapter-1"></a>
Enter fullscreen mode Exit fullscreen mode

Bold & Italic
Italics: asterisks or underscores

Bold: double asterisks or double underscores

Links
I'm an inline link: I'm an inline link

Anchored links (For things like a Table of Contents)

  ## Table Of Contents
    * [Chapter 1](#chapter-1)
    * [Chapter 2](#chapter-2)

  ### Chapter 1 <a name="chapter-1"></a>
Enter fullscreen mode Exit fullscreen mode

Inline Images
When adding GIFs to posts and comments, please note that there is a limit of 200 megapixels per frame/page.example image, with sloan

![Image Description](https://www.debug.school/uploads/articles/83lk4o8m574tukr0sqib.png)
Enter fullscreen mode Exit fullscreen mode

Image Description

You can even add a caption using the HTML figcaption tag!

Headers

Add a header to your post with this syntax:

# One '#' for a h1 header
## Two '#'s for a h2 header
...
###### Six '#'s for a h6 header
Enter fullscreen mode Exit fullscreen mode

One '#' for a h1 header

Two '#'s for a h2 header

...

Six '#'s for a h6 header

One '#' for a h1 header
Two '#'s for a h2 header
Three '#'s for a h3 header
Four '#'s for a h4 header
Five '#'s for a h5 header
Six '#'s for a h6 header
Author Notes/Comments
Add some hidden notes/comments to your article with this syntax:
<!-- This won't show up in the content! -->

Common Gotchas

Lists are written just like any other Markdown editor. If you're adding an image in between numbered list, though, be sure to tab the image, otherwise it'll restart the number of the list. Here's an example of what to do:example image of writing lists with images in Markdown

Publishing Tips

Ensure your post has a cover image set to make the most of the home feed and social media platforms.
Share your post on social media platforms or with your co-workers or local communities.
Ask people to leave questions for you in the comments. It's a great way to spark additional discussion describing personally why you wrote it or why people might find it helpful.

Here's the Markdown cheatsheet again for reference.

Top comments (0)