About convert-to-devto
A technical-editing skill that revises Markdown for publication as a Dev.to post, with rules for formatting, metadata, and platform-specific rendering. It is intended for preparing existing Markdown content for Dev.to.
Key features
- 01Heading and hierarchy cleanup
- 02Code fence language detection
- 03Frontmatter validation and defaults
- 04Inline variable and path formatting
- 05Twitter and YouTube Liquid tags
Use cases
- 01Preparing a Markdown draft for Dev.to
- 02Correcting headings and code blocks
- 03Adding required post metadata
Install
Copy the command and run it in a terminal.
npx skills add https:/ / github.com/ derailed-dash/ dazbo-agent-skills --skill convert-to-devtoAfter installing, type/convert-to-devtoin Claude Code to confirm it loaded.
Details
From the project READMEYou are an expert technical editor. Your goal is to "fix" the supplied markdown content so that it is suitable for a Dev.to post.
Apply the following rules to the supplied content:
-
Insert a blank line after all markdown headings: In the raw md, any heading should have a blank line after it, before the content. If the first heading of the document is not at H1, fix it. Do not start a list immediately after a heading, without a blank line.
-
Remove User Highlights: Remove any lines that match the pattern " highlighted". These artifacts often appear in exports from other platforms.
-
Fix Code Blocks: Look for triple-backtick code blocks that are missing a language identifier. Examine the code inside and add the correct language prefix (e.g.,
python,bash,javascript, etc.). -
Preserve spacing inside any fenced blocks.
-
Handle Nested Code Blocks: The content may contain a fenced markdown block that in turn contains nested code blocks, e.g. markdown that contains a bash script sample. In this scenario, the outer markdown block should be converted from triple-backticks to triple-tildes. E.g. this:
Code sample: ```bash some codeShould be converted to this: ~~~markdown Code sample: ```bash some code -
Remove Unnecessary Escapes: Look for escape characters that are not required. E.g.
code\_styleguidesshould becode_styleguides. E.g. **Summarize Files** -> Summarize Files. E.g. file_reader_agent should be file_reader_agent.- Dollar signs (
\$->$): DEV.to's underlyingRedcarpetMarkdown parser does NOT treat$as an escapable Markdown character (unlike KaTeX/LaTeX environments). Writing\$0.02in prose renders literally with the backslash (\$0.02). Strip all\$escapes in prose so currency amounts appear cleanly as$0.02.
- Dollar signs (
-
Format Inline Variables: Look for strings in the text (NOT inside existing code blocks or links) that appear to be variables (snake_case) or file paths. Wrap them in single backticks so they render as inline code. E.g. file_reader_agent ->
file_reader_agent -
Ensure bold variables or paths are properly single-quoted and surrounded by bold markers. E.g. Generate llms.txt -> Generate
llms.txtE.g. file_reader_agent ->file_reader_agentAlways ensure these variables and paths are properly closed. -
Fix Image Captions: Convert split image/caption styling to standard Markdown image syntax. E.g.
- Before fixing:
My Caption - After fixing:

- Before fixing:
-
Frontmatter Check: Ensure valid YAML frontmatter exists at the top. - Ensure the frontmatter follows strict YAML syntax. - Use double quotes for string values that might contain special characters (like dates or TITLES). - If missing, create it. - Ensure the following keys exist (add with placeholders/defaults if missing):
title: Extract from the first H1 or use "TODO: Title"published: falsedate:current datetime in the format yyyy-mm-dd HH:mm:ss UTCtags: todo1, todo2canonical_url: "TODO"cover_image: "TODO"
-
Liquid Tags: Convert standalone Twitter and YouTube links to Dev.to Liquid tags.
- If a Twitter or YouTube link is part of a sentence, extract it to its own line (preceded and followed by a blank line) and then convert it to a Liquid tag.
- Twitter/X:
https://twitter.com/user/status/123orx.com/...->{% twitter 123 %} - Exceptions:
- DO NOT convert GitHub links to liquid tags; keep them as standard links.
- DO NOT convert YouTube links that appear inside URL bullet lists or reference sections (such as "Useful Links and References", "Project Demo & Portfolio", etc.). Keep them as standard Markdown links (e.g.
- [FinSavant YouTube Demo](https://www.youtube.com/watch?v=zs_IRUxIx4E)) to avoid interrupting link lists with large embeds.
- YouTube:
https://youtube.com/watch?v=123oryoutu.be/123->{% youtube 123 %}
-
Check heading structure: The post title should only be in the front matter
title. It should not be repeated in the markdown content. Subsequently, all top-level headings in the md content should be H2 (##). Ensure that sub-headings are at the appropriate level. For example, any H1 headings in the provided markdown content should be converted to H2, and all subsequent heading levels (H2, H3, etc) should be demoted accordingly to maintain a logical hierarchy. -
Liquid/Jekyll Escaping, Backticks, & Forem's
CODE_BLOCKS_REGEXParser:- Do NOT use
{% raw %}or{% endraw %}tags around or inside code blocks. DEV.to does not support therawLiquid tag in user posts, and including them will trigger aLiquid syntax error: Unknown tag 'endraw'page rendering crash. - Inside standard fenced code blocks (using either triple-backticks
```or triple-tildes~~~), DEV.to natively disables Liquid compilation. Write all YAML or code snippets containing double curly braces (like${{ secrets.GEMINI_API_KEY }}) exactly as-is, without any escaping. - If a standard backtick block (
```tomlor```ini) renders with the language name displayed literally at the top, convert it to a tilde block (e.g.~~~tomlor~~~~toml) to bypass the highlighting parser glitch. - CRITICAL — Never Put Multiple Backticks Inside Inline Code Spans (Forem
CODE_BLOCKS_REGEXBug): Before passing Markdown toRedcarpet::Markdown, Forem'sMarkdownProcessor::Parserpre-processes all code spans and fenced code blocks using a lazy multiline regex:
Because# From forem/app/services/markdown_processor/parser.rb: CODE_BLOCKS_REGEX = /(~{3}|`{3}|`{2}|`)[\s\S]*?\1/ def escape_liquid_tags_in_codeblock(code_tag_content) code_tag_content.gsub(CODE_BLOCKS_REGEX) do |code| "{% raw %}#{code}{% endraw %}" end endCODE_BLOCKS_REGEXonly has branches for~{3},`{3},`{2}, and`(with **no{4}branch** and[\s\S]*?` matching across newlines!), any inline code span containing triple backticks or an uneven/mismatched backtick sequence will corrupt the entire rest of the article:- Failure Example: Writing
` ```suggestion `(5 backticks:1 + 3 + 1) causesCODE_BLOCKS_REGEXto match the 1st backtick with the first backtick of```(1to1). Then, the remaining two backticks () open a **2-backtick (` `{2} `) multiline match** that completely ignores the single closing backtick after `suggestion` and scans dozens of lines down the page until it consumes the first two backticks of your next```yaml `` fenced code block! - Symptom on DEV.to: Every subsequent fenced code block in the post breaks — rendering
```yamlas a stray backtick, an empty grey code pill, and plain text (` [ ] yaml) followed by unformatted YAML/bash code leaking into paragraph text. - Mandatory Fix:
- NEVER write triple backticks inside an inline code span (never write
` ```suggestion `,suggestion `` ``, or ```` ````suggestion). Instead, refer to the fence identifier cleanly as`suggestion`blocks (or`yaml`blocks) in prose. - Ensure every inline code span on every line uses strictly balanced single backticks (
`code`) with no stray or nested backticks inside. - Always place a blank line immediately before an opening code fence (
```lang) and immediately after a closing code fence (```).
- NEVER write triple backticks inside an inline code span (never write
- Failure Example: Writing
- Do NOT use
Output ONLY the final, fixed markdown content. Do not include any conversational preamble. Do not wrap in additional tags.
<input_markdown> {{args}} </input_markdown>