[Shopify]２ステップでカスタマイズ★ふんわり出現★トップページ(Debut)

1分でオシャレなトップページに！

Shopifyのテンプレートをカスタマイズ。

テンプレートコードをコピペするだけ！

ノーコードで1分で設置できます。

たったの２ステップでトップページの２カラムのブロックがふわっとフェイドインして出現するレイアウトが簡単に作れます！

■ダウンロードファイル

・ファイル形式：txt ・対象テーマ：Debut

*メモ帳やテキストエディタでご確認いただけます。

 

■Shopifyふわっと出現するテンプレートの特徴

1. フェイドイン
2. ２カラム（PC）
3. モバイルでは1カラム
4. 画像＆テキスト位置を左右選択可
5. 見出し表示/非表示どちらもOK
6. テキスト太字、イタリック、リンク（新しいWindow設定可）
7. ボタン設置可
   
8. フェイドインの開始位置指定可（上下）

 

画像の位置（右）

 

画像の位置（左）

 

モバイル版は１カラムです

 PCで画像アライメントを左右どちらを設定しても画像が上でテキスト部分が下。

 

見出しにテキスト入れなければ非表示

 

テキストは太字、イタリック、リンクの設置が可能

 

ボタン設置

※ラベルにテキストが入ってなければボタンは非表示。

 

フェイドインを上下どちらから表示させるのか設定

 

Shopifyフェイドインテンプレートコード挿入手順

手順1 新しいセクションを追加する

❶管理画面テーマ＞コードを編集＞Sectionフォルダ内の「新しいSectionを追加する」をクリック
❷ファイル名：なんでもOK（今回はcustom-feature-rowにしました）

custom-feature-row.liquidファイルが作成されます。

 

手順２　テンプレートコードをコピペし保存

❶手順１で作成したcustom-feature-row.liquid内を全て削除
❷後にご紹介するテンプレートコードをコピーし貼り付け

 

以上で完了です。たったの２ステップなので簡単です。

 

サンプルコードで試してみる

挿入できるかご心配の方はサンプルコードをご用意しました。

サンプルコード

 

サンプルコードではフェイドインのみご確認いただけます

▼セクション追加＞画像カテゴリ内＞フェイドインサンプル

フェイドインサンプルを選択いただくとご確認いただけます。

 

Debutテーマのみ対象になりますです。もし、本サンプルテーマで他のテーマでうまく行ったとしても、フルバージョンではその他機能が正確に動作するかは保証できません。

 

サポートや返金はしておりません。サンプルコードで一度ご確認いただく事をお勧めします。