FROM CACHE - jp_header
解決済

テーマDebut見出しの英語が全部大文字になる件

コムコム
観光客
3 0 0

テンプレートDebutで、見出しの英語が全部大文字表記になってしまいます。

コードを触らないといけないと思うのですが、どこで見出しを大文字に表記しているのかがわかりません。

見出しを大文字にする定義をしているコードがどこか、消し方など教えていただけると大変助かります。

 

1 件の受理された解決策
Jizo_Inagaki
Shopify Partner
1006 380 697

成功

サイトの方を拝見しまして状況を確認しました。

場所は以下になります。

  • theme.liquid

上記ファイルの116行目付近(おそらく実際の行数とは違います)のstyleタグの中に以下の記述があります。

 

.h2,h2{font-size:calc(((var(--font-h2-desktop))/ (var(--font-size-base))) * 1em);text-transform:uppercase;letter-spacing:.1em}

 

上記を以下のようにします。(text-transform:uppercase;を削除)

 

.h2,h2{font-size:calc(((var(--font-h2-desktop))/ (var(--font-size-base))) * 1em);letter-spacing:.1em}

 

 

作業前にはバックアップをとるようにお勧めします。
テーマの複製でも、エディタで表示させたtheme.liquidを丸ごとコピーペーストしてローカルに保存でも構いません。

 

なお、もしもstyleタグがわからないなどでしたら、パートナーやエキスパート、その他業者に依頼されたほうが安全で良いかと思いますので、そういった方法もご検討いただければと思います。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。

元の投稿で解決策を見る

4件の返信4

Jizo_Inagaki
Shopify Partner
1006 380 697

どこの見出しなのか不明なのでなんとも言えませんが、ブラウザの開発者ツールで該当箇所を表示し、以下の指定のある箇所を探すことになるかと思います。

text-transform: uppercase;

上記をコメントアウトするか、noneに書き換えれば変換はされないはずです。 

意図しないところまで影響が出た場合は、クラスやIDを追加して範囲を限定したり、新たにセレクタを作成して対応する必要があります。

なお開発者ツールの使い方に関してどうすれば良いのかわからないという場合は、Googleなどで検索いただければいろいろ情報が出てきますのでそちらを参照いただければと思います。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
コムコム
観光客
3 0 0

9E5385CB-679D-4F29-A2F9-470747E7804D.jpeg7741E5CD-56A1-42F8-A71A-EC4FF188B4E2.jpegCE12184D-CFE0-4780-B82C-DD7186BB2BE9.jpeg

赤線を引いている見出しのところは英語が大文字になってしまいます。

箇所のご提示ありがとうございます。上記の見出しの箇所になるのですが、ファイルでいうとどこに記載されているかわかりますか?

お手数おかけしますが、お返事の程よろしくお願い致します。

Jizo_Inagaki
Shopify Partner
1006 380 697

成功

サイトの方を拝見しまして状況を確認しました。

場所は以下になります。

  • theme.liquid

上記ファイルの116行目付近(おそらく実際の行数とは違います)のstyleタグの中に以下の記述があります。

 

.h2,h2{font-size:calc(((var(--font-h2-desktop))/ (var(--font-size-base))) * 1em);text-transform:uppercase;letter-spacing:.1em}

 

上記を以下のようにします。(text-transform:uppercase;を削除)

 

.h2,h2{font-size:calc(((var(--font-h2-desktop))/ (var(--font-size-base))) * 1em);letter-spacing:.1em}

 

 

作業前にはバックアップをとるようにお勧めします。
テーマの複製でも、エディタで表示させたtheme.liquidを丸ごとコピーペーストしてローカルに保存でも構いません。

 

なお、もしもstyleタグがわからないなどでしたら、パートナーやエキスパート、その他業者に依頼されたほうが安全で良いかと思いますので、そういった方法もご検討いただければと思います。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
コムコム
観光客
3 0 0

無事解決できました。

ご丁寧に色々とご教授いただき、本当に助かりました。

ありがとうございました。