CS-CartにおいてWebフォント(Google Web Fonts)を利用する方法を説明します。
【Webフォントの利用方法】
手順.1 利用するWebフォントをGoogle web fontsから選びます。
http://www.google.com/fonts/ 利用するフォントの右矢印ボタンをクリックします。
手順.2 スタイルシートの定義
webフォントの詳細設定画面が表示されますのでスタイルシートリンクをコピーします。
※)画面内の「3. Add this code to your website」にあるリンクをコピーします。
コピーしたリンクは以下のファイルに追記します。
design/themes/テーマディレクトリ/templates/addons/localization_jp/hooks/index/jp_external_scripts.post.tpl
※)テーマディレクトリのデフォルトは「basic」です。
手順.3 既存スタイルのオーバーライド
webフォントの詳細設定画面に戻りフォント定義スタイルをコピーします。
※)画面内の「4. Integrate the fonts into your CSS」をコピーします。
以下のファイルにフォントを変更したいスタイルを追記します。
design/themes/テーマディレクトリ/css/addons/localization_jp/styles.less
※)テーマディレクトリのデフォルトは「basic」です。
※)body、div、pタグおよび一覧の商品名フォントを変更しています。
手順.4 表示確認の前にテンプレートキャッシュのクリア
スタイルシートやテンプレートファイルを修正した場合は、以下のページを参考にテンプレートキャッシュのクリアを実行してから表示を確認します。
http://helpdesk.cs-cart.jp/index.php?/Knowledgebase/Article/View/81/0/