Liquid、JavaScriptなどに関する質問
Debutを使用しています。
ブログのCSSもサイト全体と同様にtheme.scss.liquidが読み込まれているのですが、ブログで見出しにh2タグを使用すると、h3よりもサイズが小さくなってしまいます。
theme.scss.liquidのh2タグを変更するとサイト全体がおかしくなるため、ブログのみh2タグのサイズを変更したり、hタグにそれぞれ下線を設定する等したいのですが、読み込むCSSをブログのみ変更するにはどうすれば良いでしょうか?
コード編集より色々とファイルを追加変更してみたのですが、ブログ記事のテンプレート読込箇所(画像参照)も「デフォルトのブログ記事」以外が表示されません。
よろしくお願いします。
解決済! ベストソリューションを見る。
成功
とりあえずの解決として
templates/ article.liquid か section/ article-template.liquid のファイルに下記のコードを入れてみるのはいかがでしょうか? (一番上らへんに)
Debut の初期のCSSだとh3とかより、なぜかh2が小さいのが謎ですよね。
ぼくの環境でChrome ブラウザだと1.7remくらいがちょうど良さそうでした。
成功
とりあえずの解決として
templates/ article.liquid か section/ article-template.liquid のファイルに下記のコードを入れてみるのはいかがでしょうか? (一番上らへんに)
Debut の初期のCSSだとh3とかより、なぜかh2が小さいのが謎ですよね。
ぼくの環境でChrome ブラウザだと1.7remくらいがちょうど良さそうでした。
回答頂きありがとうございます。
そちらの方法でも出来るのですね。
日本のコミュニティだと人が少ないのかな?と思い、英語の方でも聞いたところ、下記の回答も頂きました。
pxよりも教えていただいた1.7remで調整してみます。ありがとうございました!
まだまだ勉強中の身ですが、お役に立ててよかったです。
>日本のコミュニティだと、、
Shopifyはカナダ発で英語ユーザーのほうが多いので、コミュニティも英語ユーザーのほうが多いらしいです。
最近コミュニティに参加したので詳しく状況はわかりませんが。
英語のコミュニティの方の回答も見ました。
body.template-article h2 {
font-size: 22px !important;
}
ブログ記事のコンテンツがDebutのテーマだと template-article のクラスで囲まれているようなので、そちらの指定でうまくサイズ変わると思います。またDebutの初期CSSに書き込みして良いのであれば、そちらに記載する方法が良いと思います。
1rem = 16px (ブラウザの設定などによる)で remの単位だと相対で指定できますが、DebutのCSSの書き方に合わせてピクセル指定で良いかもしれません。
リエンゲージメントの自動化で売り上げ向上へ!素敵なオンラインストアを作成し、見込み顧客の携帯へ広告を直接に送信する、またはSNSなどで宣伝すると、お客様がストアに行き着...
By Mirai Mar 24, 2024Shopifyは世界で最も革新的なブランドと起業家をサポートしています。個人起業家やあらゆる規模のビジネスの成長を後押しするために、Shopify アカデミーではShopif...
By SarahF_Shopify Mar 22, 2024オンラインストア運営はとてもやりがいのある活動です。新しい注文が入った時の喜びや世界中のお客様とやりとりできる可能性、商品に対して最高のレビューをもらった時の満足感は、毎日の...
By Mina Mar 13, 2024