Liquid、JavaScriptなどに関する質問
Dawnのスライドショーでリンク付きボタンを画像の上に表示しているのですが、
下記2点のコード編集方法を教えていただけますでしょうか。
<前提設定条件>
デスクトップのコンテンツ位置:左下
デスクトップのコンテンツ配置:左
モバイルのコンテンツ配置:左
1. デスクトップでのコンテンツ表示位置を左下に設定しているが、さらに下に表示させたい
2. モバイルでのボタンサイズが大きすぎるので小さくし、もっと下に表示したい
Shopifyコード編集は初心者です。よろしくお願い致します。
FABEA様
はじめまして、フルバランスの園畑です。
ご質問を確認いたしました。
Dawnのスライドショーですが、以下cssを追加することで調整できるかと思います。
<style>
.slideshow__text {
position:relative;
}
.slideshow__text .banner__buttons { /* ボタンの位置 */
position:absolute;
top:50%;/* 任意の数字 */
}
.slideshow__text .banner__buttons .button { /* ボタンサイズ調整 */
min-height: 0;
min-width: 0;
padding: 10px 5px;/* 任意の数字 */
}
</style>
もっと自由にレイアウト調整されたい場合は、liquidコードにてカスタマイズをする必要があるかと存じます。
ご参考までに。
フルバランスの園畑様
早速のご返信ありがとうございます。
仰せの通り、styleのcssをcomponent-slider.cssに追記し、ボタンの位置を変更することはできました。
ただ、ボタンサイズの変更が反映されません。ボタンサイズはどこか別の場所で設定されているのでしょうか。
また、コンテンツの親要素の場所を下を起点に位置設定を行う場合はどこを修正したらいいでしょうか。
見出し・小見出しを入力しないとボタンが上にずれてしまうためです。
ご教示いただければ幸いです。
宜しくお願い致します。
サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 20242023年初頭、Shopifyペイメントアカウント、及びShopifyアカウント全体のセキュリティを強化する為の変更が適用されました。ユーザーのアカウントセキュリティを強化す...
By Mirai Sep 29, 2024概要: 年末/年明けは、消費者が最もショッピングを行う時期の一つです。特に、ブラックフライデー・サイバーマンデー(BFCM)は、世界中で注目される大規模なセールイベントであ...
By JapanGuru Sep 25, 2024