![見出し画像](https://assets.st-note.com/production/uploads/images/83643836/rectangle_large_type_2_5e09b2f3e74f51f213c721fe21be86f2.png?width=1200)
[Shopify]ブログ記事のテンプレート第3弾♪(Dawn)
こんにちは。Shopify専門エンジニアのまりん(@crowd37cord)です。
Shopifyブログ記事のツールバーの機能を使ってレイアウト変更できないかなぁと思って作ってみました♪
これならHTMLそんなに触らないし簡単。
対象テーマ:Dawn
✔️今回のテンプレート
デモページ(PW:stahsk40jw1Mf)
ヘッダー>テンプレート>ブログ>Template3
![](https://assets.st-note.com/img/1659231045184-Yu3ivBjNGs.png?width=1200)
✔️使い方
![](https://assets.st-note.com/img/1659137365625-lDHbpRJYPg.png?width=1200)
![](https://assets.st-note.com/img/1659137370396-rBQv7ENQTO.png?width=1200)
![](https://assets.st-note.com/img/1659137375025-MWw0x6rqPp.png?width=1200)
![](https://assets.st-note.com/img/1659137379608-bZ51ikg6BL.png?width=1200)
![](https://assets.st-note.com/img/1659137384391-EIhLeApfYD.png?width=1200)
![](https://assets.st-note.com/img/1659137388631-C2Y1Rov9oB.png?width=1200)
![](https://assets.st-note.com/img/1659137393166-npXFaYbKY9.png?width=1200)
![](https://assets.st-note.com/img/1659137397031-1MyIfX7APv.png?width=1200)
![](https://assets.st-note.com/img/1659137402195-s9bfp5ul0I.png?width=1200)
![](https://assets.st-note.com/img/1659137406441-7ttG6xiuPH.png?width=1200)
![](https://assets.st-note.com/img/1659137411069-SNDR4pZyTc.png?width=1200)
![](https://assets.st-note.com/img/1659137414778-gjLVoIRw5Z.png?width=1200)
![](https://assets.st-note.com/img/1659137419687-oe6DiMV9jH.png?width=1200)
✔️CMSの特徴
目次とテーマカラーのみ選択できます。
◆見出しのキーカラーを選択
![](https://assets.st-note.com/img/1659131949360-wThpTloluW.png?width=1200)
◆目次のタイトルテキストと背景カラー
![](https://assets.st-note.com/img/1659131938680-sK7QJ4cO8T.png?width=1200)
目次は目のマークでON /OFF切り替えできます。
✔️設置手順
Step1 新規セクション追加
コード編集>Section>新規追加
![](https://assets.st-note.com/img/1659131366055-IaupcAv0f9.png)
ファイル名:main-article-template3
ここから先は
19,993字
/
3画像
/
1ファイル
この記事が気に入ったらサポートをしてみませんか?