# Dawn 編集画面のカスタムCSSにエラー

**URL:** <https://community.shopify.com/t/dawn-css/235596>\
**Category:** 技術的なQ＆A\
**Created:** [July 25, 2023, 1:11pm UTC](https://community.shopify.com/t/dawn-css/235596 "2023-07-25T13:11:02Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

Dawnテーマの「カスタムCSS」機能で、CSSコードに `content: "";` プロパティを含めるとエラーが発生し、公開できない問題が報告されています。

**問題の詳細：**
- カスタムliquidでオリジナルタイトルを作成中
- `h2::after { content: ""; }` などのコードでエラー発生
- 何度試しても `content` プロパティが原因と判明

**確認された状況：**
- 別のユーザーも同様の現象を再現
- カスタムCSS機能には使用できるCSSに制限があり、`content` プロパティは使用不可の可能性が高い

**提案された解決策：**
- `content` プロパティを使わない方法での実装
- `::after` 疑似要素以外での実現を検討

質問者は公式情報を見つけられず、代替方法を模索中です。この問題は現在も未解決の状態です。

<div class="post-metadata">

**Author:** ![YMD002](https://avatars.discourse-cdn.com/v4/letter/y/b4bc9f/32.png) [@YMD002](https://community.shopify.com/u/YMD002)\
**Post date:** [July 25, 2023, 1:11pm UTC](https://community.shopify.com/t/dawn-css/235596/1 "2023-07-25T13:11:02Z")

</div>

Dawnテーマでショップを作成しており、編集画面の「カスタムliquid」にてオリジナルのタイトルを作成したいと思いますが、「カスタムCSS」にコードを追加したら、添付画像のように、エラーが発生し、公開できない状況になっています。何回か試してみましたが、結局CSS中の「content: “”;」部分がエラーの原因だったみたいです。

解決方法をお伺いしたく、投稿させていただきました。

ご存知の方教えていただけますか？

宜しくお願い致します。

 ![画像１.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/d/7/d743095ebea3e2dad83534de895734ebdbb3b943.png)

書いたコード：

```auto
liquid部分：
<h2>〇〇〇〇〇</h2>

CSS部分：
h2 {
  display: block;
  position: relative;
} 
h2::after {
  content: "";
  position: absolute;
  width: 50px;
  top: 120%;
  left: 50%;
  transform: translateX(-50%);
  height: 1px;
  background: #008060;
} 

```

---

<div class="post-metadata">

**Author:** ![ogasawarakyohei](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/ogasawarakyohei/32/28415_2.png) [@ogasawarakyohei](https://community.shopify.com/u/ogasawarakyohei)\
**Post date:** [July 26, 2023, 1:56am UTC](https://community.shopify.com/t/dawn-css/235596/2 "2023-07-26T01:56:31Z")

</div>

私の方でも確認してみましたが、たしかにcontentプロパティがあると保存できませんでした。

カスタムCSSは使用できるCSSに制限があるので、おそらくcontentプロパティは使用できないのだと思います。(使用できないCSSに関する公式の情報を調べましたが見つけられませんでした)

contentプロパティが使えない以上、after疑似要素以外で実現するのがよいと思います。

特殊なケースでなければ、疑似要素を使わなくても解決できると思いますので。

---

<div class="post-metadata">

**Author:** ![YMD002](https://avatars.discourse-cdn.com/v4/letter/y/b4bc9f/32.png) [@YMD002](https://community.shopify.com/u/YMD002)\
**Post date:** [July 26, 2023, 2:32am UTC](https://community.shopify.com/t/dawn-css/235596/3 "2023-07-26T02:32:56Z")

</div>

[Ogasawarakyohei](https://community.shopify.com/user/1287850)さま

ご教示いただきありがとうございます。

CSSに制限があることは知りませんでした。他の方法で試してみます。

貴重な時間をいただき本当にありがとうございました。