コードブロックの言語指定に diff ruby や diff css のように diff 言語名を指定すると、diff マーカー(+/-) の色分けと 言語のシンタックスハイライト が同時に適用されるようになりました。
```diff ruby
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
```
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
ファイル名の指定も可能です。
```diff scss:app/assets/stylesheets/header.css
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
```
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
このように、変更箇所がより読みやすくなります。ぜひお試しください。
桜が見頃ですね🌸
[ProTip] Webhookでdocs.esa.ioの更新通知を受け取ることができます
Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io
# 今回のリリース内容
<img width="2400" alt="2026-03-30.png (183.6 kB)" src="https://img.esa.io/uploads/production/attachments/105/2026/03/30/11/7d3bb244-97b9-46e9-897e-57ba2ce2bd06.png">
コードブロックの言語指定に `diff ruby` や `diff css` のように `diff 言語名`を指定すると、__diff マーカー(+/-)__ の色分けと __言語のシンタックスハイライト__ が同時に適用されるようになりました。
```diff ruby
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
```
```diff ruby
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
```
ファイル名の指定も可能です。
```diff scss:app/assets/stylesheets/header.css
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
```
```diff css:app/assets/stylesheets/header.css
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
```
このように、変更箇所がより読みやすくなります。ぜひお試しください。
# (\\( ⁰⊖⁰)/) ヒトコト
桜が見頃ですね🌸
<img width="1000" alt="IMG_8109.jpeg (2.0 MB)" src="https://img.esa.io/uploads/production/attachments/105/2026/03/30/11/8b4e78f8-7510-4ab2-ace5-487441df97ff.jpeg">
---
[ProTip] [Webhookでdocs.esa.ioの更新通知を受け取ることができます](/posts/73)
Enjoy "(\\( ⁰⊖⁰)/)"
https://esa.io
コードブロックの言語指定に diff ruby や diff css のように diff 言語名を指定すると、diff マーカー(+/-) の色分けと 言語のシンタックスハイライト が同時に適用されるようになりました。
```diff ruby
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
```
def greet(name)
- puts "Hello, " + name
+ puts "Hello, #{name}!"
end
ファイル名の指定も可能です。
```diff scss:app/assets/stylesheets/header.css
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
```
.header {
display: flex;
- background-color: #fff;
+ background-color: #2a4365;
+ color: #fff;
padding: 12px 24px;
}
このように、変更箇所がより読みやすくなります。ぜひお試しください。
桜が見頃ですね🌸
[ProTip] Webhookでdocs.esa.ioの更新通知を受け取ることができます
Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io