- You can even add a caption using the HTML figcaption tag!
+
+
+ 
+
+ You can even add a caption using the HTML figcaption tag!
Headers
Add a header to your post with this syntax:
@@ -37,7 +40,9 @@
Six '#'s for a h6 header
🌊 Liquid Tags
-
We support native Liquid tags in our editor, but have created our own custom tags listed below:
+
We support native
+ Liquid tags in our editor, but have created our own custom tags listed below:
+
dev.to Article/Post Embed
All you need is the full link of the article:
@@ -54,7 +59,9 @@
{% tag git %}
dev.to Comment Embed
-
All you need is the ID at the end of a comment URL. To get the comment link, click either the timestamp or the menu button in the top right corner on a comment and then click "Permalink". Here's an example:
+
All you need is the
+ ID at the end of a comment URL. To get the comment link, click either the timestamp or the menu button in the top right corner on a comment and then click "Permalink". Here's an example:
+
Using the Twitter Liquid tag will allow the tweet to pre-render from the server, providing your reader with a better experience. All you need is the tweet id from the url.
+
Using the Twitter Liquid tag will allow the tweet to pre-render from the server, providing your reader with a better experience. All you need is the tweet
+ id from the url.
{% twitter 834439977220112384 %}
Glitch embed
All you need is the Glitch project slug
{% glitch earthy-course %}
-
There are several optional attributes you can use in your tag, just add them after the id, separated by spaces.
+
There are several
+ optional attributes you can use in your tag, just add them after the id, separated by spaces.
+
app
@@ -100,6 +110,7 @@
Lets you choose which file to display in the code panel. Defaults to index.html. {% glitch earthy-course file=script.js %}
- Add default-tab parameter to your CodePen embed tag. Default to result
- {% codepen https://codepen.io/twhite96/pen/XKqrJX default-tab=js,result %}
-
+
default-tab
+
+ Add default-tab parameter to your CodePen embed tag. Default to result
+ {% codepen https://codepen.io/twhite96/pen/XKqrJX default-tab=js,result %}
+
+
RunKit Embed
Put executable code within a runkit liquid block, as follows:
@@ -146,14 +158,17 @@
{% stackblitz ball-demo %}
Default view
- You can change the default view, the options are both, preview, editor. Defaults to both
+ You can change the default view, the options are both, preview, editor. Defaults to
+ both {% stackblitz ball-demo view=preview %}
CodeSandbox Embed
All you need is the ID of the Sandbox:
{% codesandbox ppxnl191zx %}
-
Of CodeSandbox's many optional attributes, the following are supported by using them in your tag, just add them after the id, separated by spaces.
+
Of CodeSandbox's many
+ optional attributes, the following are supported by using them in your tag, just add them after the id, separated by spaces.
+
initialpath
@@ -165,17 +180,19 @@
Which module to open by default. {% codesandbox ppxnl191zx module=/path/to/module %}
+
JSFiddle Embed
All you need is the full JSFiddle link, ending in the fiddle ID code, as follows:
- You can add a custom tab order to you JSFiddle embed tag. Defaults to js,html,css,result
- {% jsfiddle https://jsfiddle.net/webdevem/Q8KVC result,html,css %}
-
+
Custom tabs
+
+ You can add a custom tab order to you JSFiddle embed tag. Defaults to js,html,css,result
+ {% jsfiddle https://jsfiddle.net/webdevem/Q8KVC result,html,css %}
+
+
repl.it Embed
All you need is the URL after the domain name:
@@ -213,7 +230,8 @@
Parsing Liquid Tags as a Code Example
To parse Liquid tags as code, simply wrap it with a single backtick or triple backticks.
`{% mytag %}{{ site.SOMETHING }}{% endmytag %}`
-
One specific edge case is with using the raw tag. To properly escape it, use this format:
+
One specific edge case is with using the raw tag. To properly escape it, use this format:
+
`{% raw %}{{site.SOMETHING }} {% ``endraw`` %}`
Common Gotchas
@@ -227,7 +245,9 @@
alt="example image of writing lists with images in Markdown">
-
Our RSS reader converts some tags from the RSS items to tags for the Jekyll front matter:
<title>: title
-
<category>: tags, comma separated. Since only 4 tags can be used in a post on dev.to, only the first four tags will be used from the RSS item.
-
<link>: canonical_url Only if the "Mark the RSS source as canonical URL by default" option is enabled in the Publishing from RSS settings.
+
<category>:
+ tags, comma separated. Since only 4 tags can be used in a post on dev.to, only the first four tags will be used from the RSS item.
+
+
<link>:
+ canonical_url Only if the "Mark the RSS source as canonical URL by default" option is enabled in the Publishing from RSS settings.
+
Article Content
-
The article content is prioritized in this order: <content>, <summary>, or <description>. The HTML will be converted to Markdown as the body of the DEV post.
+
The article content is prioritized in this order: <content>,
+ <summary>, or
+ <description>. The HTML will be converted to Markdown as the body of the DEV post.
If you're using a Medium RSS feed, Tweet links, YouTube, and Gist iframes are converted to Liquid tags.
-<% end %>
\ No newline at end of file
+<% end %>
diff --git a/app/views/pages/about.html.erb b/app/views/pages/about.html.erb
index 52a36b689..75daf69c1 100644
--- a/app/views/pages/about.html.erb
+++ b/app/views/pages/about.html.erb
@@ -1,7 +1,7 @@
<% title "About The Practical Dev" %>
<%= content_for :page_meta do %>
-
+
@@ -19,32 +19,34 @@
<% end %>
-
-
@@ -56,67 +58,69 @@
-
- Where programmers share ideas and help each other grow. It is an online community for sharing and discovering great ideas, having debates, and making friends. Anyone can share articles, questions, discussions, etc. as long as they have the rights to the words they are sharing. Cross-posting from your own blog is welcome.
-
-
Leadership
-
-
-
- " width="250" alt="Ben Halpern"/>
-
-
- Ben Halpern, Founder
- Ben manages content, is the core maintainer of the dev.to application, and makes jokes on the Internets.
-
+
+ Where programmers share ideas and help each other grow. It is an online community for sharing and discovering great ideas, having debates, and making friends. Anyone can share articles, questions, discussions, etc. as long as they have the rights to the words they are sharing. Cross-posting from your own blog is welcome.
+
+
Leadership
+
+
+
+ " width="250" alt="Ben Halpern" />
-
-
- " width="250" alt="Ben Halpern"/>
-
-
- Jess Lee, Co-Founder
- Jess leads day-to-day operations, manages content, and contributes to the dev.to codebase.
-
-
-
-
- " width="250" alt="Ben Halpern"/>
-
-
- Peter Frank, Co-Founder
- Peter focuses on strategy, investor relations, and sending dev.to swag around the globe.
-
+
+ Ben Halpern, Founder
+ Ben manages content, is the core maintainer of the dev.to application, and makes jokes on the Internets.
+
+
+ " width="250" alt="Ben Halpern" />
+
+
+ Jess Lee, Co-Founder
+ Jess leads day-to-day operations, manages content, and contributes to the dev.to codebase.
+
+
+
+
+ " width="250" alt="Ben Halpern" />
+
+
+ Peter Frank, Co-Founder
+ Peter focuses on strategy, investor relations, and sending dev.to swag around the globe.
+
+
+
-
-
- The platform was created in 2016. The Twitter account, @ThePracticalDev was around before then. We are based out of New York City.
-
+
+
+ The platform was created in 2016. The Twitter account,
+ @ThePracticalDev was around before then. We are based out of New York City.
+