Liquid、JavaScriptなどに関する質問
素人ですdawnテーマを使用しておりますトップ画面のitem表示数を4列にしたいのですがすでに回答のあるものを試したのですが反映されません。素人にも理解できるよう手順を教えて頂きたいです
解決済! ベストソリューションを見る。
成功
上記の方法で
3列になりました!!!!
本当にありがとうございます!!
もう1件お聞きしたいのですが
このような 〈 1/2 〉の文字を
削除は行えますでしょうか??
コレクションリストやマルチカラム等の下部にでてきます。
成功
@piko 様
補足説明ありがとうございます。
コレクションリストやマルチカラムの「モバイルでスワイプを有効にする」にチェックを入れた際に表示されるコンポーネントを非表示にするには、
それぞれのカスタムCSSに下記を設定されれば良いはずです。
.slider-buttons {
display: none;
}
お試しください。
(キュー田辺)
成功
@piko 様
「カートに入れる」が何も表示されていないように見えるのは、
「テーマ設定」にて、
文字色を白に、ボーダーをなくしたからではないでしょうか?
デフォルトのデザインですと、
「カートに入れる」ボタンは下記の状態です。
ここから、
ボーダーを無くして、文字色を白にしてしまうと、
何も表示されていないように見えてしまうかもしれません。
念のためご確認ください。
(キュー田辺)
成功
@piko 様
スキーム1の、アウトラインボタンがボタンの文字色に採用されるようです。
もし、この設定に問題がない場合ですが、
今の状態での、これ以上のアドバイスは難しいです。
設定をご自身で変更されているようなので、
実際にストアを拝見してみないと調査が難しいです。
もし、ご要望あれば、
コラボレーターアクセスをいただいて、
私たちが直接ストアにログインして確認してみることはできます。
(解決のお約束はできませんが。)
ご検討ください。
(キュー田辺)
@piko 様
Dawn 11.0.0を確認しますと、
https://themes.shopify.com/themes/dawn/styles/default/preview
商品カードは元々4列表示になっています。
ということは、
質問者様は、上図の部分ではない箇所について言及されていると思うのですが、どの部分のことかをお教えいただいても良いでしょうか?
例えば、スクリーンキャプチャをつけていただいたり、「テーマ > カスタマイズ」の中のセクションやブロックの名称でも大丈夫です。
また、
お使いのDawnのバージョンや、
参考にされた、という記事のURLなども
分かると、より良いです。
(キュー田辺)
返信くださりありがとうございます。
質問内容に詳細を書き忘れており
申し訳ございません。
モバイル版での表示を横に3列にしたいです。
4列も可能であれば4列も試したいです。
初期設定では1列か2列しか選べれないです
dawn 10.0.0 と11.0.0を使用しております
https://community.shopify.com/c/技術的なq-a/prestigeでモバイルの商品表示数を3列にしたい/m-p/1874208
https://community.shopify.com/c/技術的なq-a/モバイルでの商品グリットの列数3列で表示させる方法/m-p/2032165
関連のものは全て見ており試してみましたが、、実装されません。。
@piko 様
補足情報ありがとうございます。
Dawnをお使いであればこちらの記事の方が参考になりそうですね。
(もう片方はPrestigeというテーマのカスタマイズについてのようなので、参考にできなさそうです。)
さて、上記の投稿で紹介されているCSSをどこに追加するか、でも変わってきてしまうのですが、適切な位置に追加されている場合、下図のように「テーマカスタマイズ」画面にて、モバイルでの列数が「2列」になっていれば、うまくCSSがきくはずです。
「1列」になっている場合は、「2列」にご変更ください。
さて、上記のやり方ですと、意図した見た目にならないかもしれません。
例えば、3列表示で、11個商品がある場合、最後の段の2商品は2列表示になるかと思います。
そうしたくない場合は、下記のように、max-widthを追加されると良いです。
max-widthとwidthに同じ内容を設定してください。
@media screen and (max-width: 749px) {
.grid--2-col-tablet-down .grid__item {
width: calc(33% - var(--grid-mobile-horizontal-spacing) / 2);
max-width: calc(33% - var(--grid-mobile-horizontal-spacing) / 2);
}
}
また、
もしCSSの追加場所に悩まれるようでしたら、下図のように「カスタムCSS」に追加いただくのが簡単です。
Dawn 11.0.0での解説になっていますが、おそらくDawn 10.0.0でもうまく機能するはずです。
ご参考まで。
(キュー田辺)
成功
上記の方法で
3列になりました!!!!
本当にありがとうございます!!
もう1件お聞きしたいのですが
このような 〈 1/2 〉の文字を
削除は行えますでしょうか??
コレクションリストやマルチカラム等の下部にでてきます。
@piko 様
私の開発ストアでは下記の文字列の表示を確認できませんでした。
> このような 〈 1/2 〉の文字を
> 削除は行えますでしょうか??
> コレクションリストやマルチカラム等の下部にでてきます。
プライベートメッセージなどで、ストアのURLをお送りいただけますと何か分かるかもしれません。
ご検討ください。
(キュー田辺)
モバイル画面の表示で
スワイプをOnにしたときにでます
これを非表示したいです。
また、sold outの枠線
白くなっているのはどうしたら
消せれますでしょうか?
スキームを色々試したのですが
枠線は残ったままでした。
教えて頂きたいです🙇🏼
成功
@piko 様
補足説明ありがとうございます。
コレクションリストやマルチカラムの「モバイルでスワイプを有効にする」にチェックを入れた際に表示されるコンポーネントを非表示にするには、
それぞれのカスタムCSSに下記を設定されれば良いはずです。
.slider-buttons {
display: none;
}
お試しください。
(キュー田辺)
sold outの枠線は解決しました🙇♀️
商品ページのカートに入れる
ボタンが表示されないのですが
原因はわかりますでしょうか?
成功
@piko 様
「カートに入れる」が何も表示されていないように見えるのは、
「テーマ設定」にて、
文字色を白に、ボーダーをなくしたからではないでしょうか?
デフォルトのデザインですと、
「カートに入れる」ボタンは下記の状態です。
ここから、
ボーダーを無くして、文字色を白にしてしまうと、
何も表示されていないように見えてしまうかもしれません。
念のためご確認ください。
(キュー田辺)
テーマ設定の色
全て確認し設定もし直したのですが
表示されないままです。
配色スキーム複数作成してますが
何番が商品ページのカートインボタンに
反映されるのでしょうか。
成功
@piko 様
スキーム1の、アウトラインボタンがボタンの文字色に採用されるようです。
もし、この設定に問題がない場合ですが、
今の状態での、これ以上のアドバイスは難しいです。
設定をご自身で変更されているようなので、
実際にストアを拝見してみないと調査が難しいです。
もし、ご要望あれば、
コラボレーターアクセスをいただいて、
私たちが直接ストアにログインして確認してみることはできます。
(解決のお約束はできませんが。)
ご検討ください。
(キュー田辺)
お願いしたいです🙇🏼
コラボレーターアクセスはどうしたら
よいのでしょうか?
サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 20242023年初頭、Shopifyペイメントアカウント、及びShopifyアカウント全体のセキュリティを強化する為の変更が適用されました。ユーザーのアカウントセキュリティを強化す...
By Mirai Sep 29, 2024概要: 年末/年明けは、消費者が最もショッピングを行う時期の一つです。特に、ブラックフライデー・サイバーマンデー(BFCM)は、世界中で注目される大規模なセールイベントであ...
By JapanGuru Sep 25, 2024