HTML+ERB to Slim
Convert HTML/ERB syntax to Slim template format
Introduction
This online converter tool makes it easy to convert HTML+ERB templates into Slim format. It’s perfect for developers working with Ruby on Rails who want cleaner, more concise templates.
How to Use This Tool
- Paste your HTML+ERB code directly into the editor or type it in.
- Click the Convert button to transform your code into Slim.
-
After the conversion, you can:
- Download the Slim result.
- Save or share it with others using a unique link.
- Sign in with Google or GitHub to save your converted templates for future use.
What is Slim?
Slim is a lightweight Ruby template language designed to reduce syntax to its essential elements while remaining easy to read and use. By removing unnecessary parts like `<`, `>`, and closing tags, Slim simplifies template writing without sacrificing functionality.
Originally created as an exercise in minimalism, Slim has evolved into a robust and flexible language that adapts to the needs of its users. Its simplicity and concise syntax make it a popular choice for Ruby on Rails developers.
Slim is powered by Temple and Tilt. If you’re interested in learning more about how Slim works under the hood, exploring these projects is a great place to start.
Check out the official Slim documentation for more details.
Slim Syntax
doctype html
html
head
title Slim Examples
meta name="keywords" content="template language"
meta name="author" content=author
javascript:
alert('Slim supports embedded javascript!')
body
h1 Markup examples
#content
p This example shows you what a basic Slim file looks like.
== yield
- unless items.empty?
table
- items.each do |item|
tr
td.name = item.name
td.price = item.price
- else
p
| No items found. Please add some inventory.
Thank you!
div id="footer"
= render 'footer'
| Copyright © #{year} #{author}
Examples
HTML+ERB
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<h1>Blogg</h1>
<p>
Time:
<%= Time.now %>
</p>
<% Post.all.each do |post| %>
<article>
<h2><%= post.title %></h2>
<div><%= post.body %></div>
</article>
<% end %>
</body>
</html>
Slim
|
html
head
meta[charset="utf-8"]
body
h1
| Blogg
p
| Time:
= Time.now
- Post.all.each do |post|
article
h2
= post.title
div
= post.body