Shopify アプリに関する話題はこちら
アプリを2カラムに表示することは可能でしょうか?
例えば、SNS投稿をインポートして表示するアプリがあったとして、
左側:アプリ | 右側:こちらが用意したテキスト
というレイアウトで表示させたいです。
=====
■コーディング例
HTML
<div class="warp">
<div class="left">
ここにアプリ(例:SNSの投稿を表示するアプリ)を表示したい
</div>
<div class="right">
<h2>商品をご紹介!</h2>
<p>{{ section.settings.text }}</p>
</div>
</div>
CSS
.wrap{
display: flex;
}
schema
{
"type": "text",
"label": "ここにテキスト",
"id": "text"
}
※該当箇所のみ抽出し、他の記述は省略しています。
=====
↑細かいところは省略していますがこのようにしたいです。
テーマエディタでアプリブロックを追加すると1カラムになります。
Liquidで@appで呼び出すやり方を試しているのですが、書き方を間違えているのか上手くいかず…。
Liquidで@appでアプリを呼び出してコーディングで2カラムにするというやり方であってますでしょうか…?
Liquidでアプリを呼び出す基本の書き方はどういう書き方になりますでしょうか?
Aoi_16さま
はじめまして、フルバランスの渡邉です。
ご質問を確認いたしました。
コーディング例のご共有ありがとうございます。
いただいた例ですと、
.left, .right{
width:50%;
}
というCSSを追加することで2分割できるかと存じます。
また、アプリブロックはschemaに"type": "@app"を追加し、{% for block in section.blocks %}内で{% render block %}すると呼び出せますので、下記記事を参考にお試しいただけますと幸いです。
https://www.shopify.com/jp/blog/partner-theme-blocks
なにかヒントになりましたら幸いです。
私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。
分からない点があれば、またいつでもご連絡ください。
フルバランス 渡邉
Shopifyペイメント決済サービスを利用していて、ストアの管理画面の通知セクションに突然「Shopifyペイメントの使用を継続するために必要な情報」というバナーメッセージが表示さ...
By Mirai Dec 3, 2023すべてのShopifyアカウントはデフォルトではmyshopify.comのURLと関連付けられており、これはアカウント設定時に使用したビジネス名に基づいて作成されます。しかし、オ...
By Nina_13 Nov 26, 2023このトピックは英語版コミュニティの投稿:Shopify Web Pixel Manager Sandbox FAQの日本翻訳です。
By Mirai Nov 19, 2023