Shopify テーマ、Liquid、ロゴ、その他の類似トピック
ShopifyでCDNを使って、フォントを読み込む方法について教えていただきたい。
■達成したいこと
任天堂がホームページで使用しているフォントがあります。
https://www.nintendo.co.jp/
こちらはCDNを経由すれば使えるようで、フォントを作成した会社のホームページに記載がありました。 https://yakuhanjp.qranoko.jp/
なので、ShopifyでCDNを経由して特定のフォントを使用するための設定をしたい
■調べたこと base_urlを使うとCDN経由のフォントも使えるようです いくつかリンクも貼っておきます。 https://qiita.com/eijiSaito/items/e951067577b542271ab6
https://labo.kon-ruri.co.jp/shopify-liquid-font-filters/
https://shopify.dev/api/liquid/filters/font_face
https://developer.mozilla.org/en-US/docs/Web/CSS/%40font-face
■やってみたこと
フォントに関わる変更でしたので、コード編集からbase.cssなどを編集してみましたが、さっぱりでした。
■わからなかったこと
・base_urlのコードをどのファイルに書けば良いのかわからない
ご教授お願いできますでしょうか?
お手数ですがよろしくお願いいたします。
だいきさま
はじめまして、フルバランスの園畑です。
ご質問を確認いたしました。
外部フォントの導入ですが、基本的にtheme.liquidの<head>内に下記(cdnのリンク)を記入すれば良いかと存じます。
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/yakuhanjp@3.4.1/dist/css/yakuhanjp.min.css">
cssのコードは、任意のcssファイル等に記載くださいませ。
ご参考までに。
私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。
分からない点があれば、またいつでもご連絡ください。
フルバランス 園畑
フルバランス 園畑様
お返事ありがとうございます。
head内にCDNのリンクを貼り付けることで対処することはわかりました。
ありがとうございます。
わからない点がありましたので、追加で質問をさせてください。
任意のCSSファイルに記述する。
とありますが、任意のファイルとは
・新規で作成したCSSファイル
・既に作成済みのCSSファイル
どちらでも良いと解釈してよろしいでしょうか?
お返事をお待ちしております。
Shopify アカデミーの学習パスと認定スキルバッジExpanding Your Shopify Business Internationallyを活用して、国際的にビジネ...
By Shopify Feb 7, 2025Shopify アカデミーの学習パスB2B on Shopify:立ち上げとカスタマイズで卸売販売に進出しましょう。これら3つの無料コースは、ShopifyストアでB2B機能...
By Shopify Jan 31, 2025サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 2024