セルフルの上級者機能に追加された「カスタムCSS」
この機能を利用した裏技をこのブログでは紹介しています🤗
目次
フォントサンプル画像
このように、文字のフォントが変わります。

対応しているサイトデザイン※
全てのデザイン
※サイトデザインとは、セルフルの管理画面左にある「サイト設定」に入った画面の一番上「サイトデザイン」で選択しているデザインのことです。
変更方法
下記のコードをコピーして「上級者設定」の中にある「カスタムCSS」をクリックしたページに貼り付けしてください。
NotoSans(ゴシック体/フォントサンプル画像:上段左)
/* -------- Webフォント(NotoSans) -------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;700&display=swap');
#site {
font-family: 'Noto Sans JP', sans-serif;
}
ZenKakuGothicNew(ゴシック体/フォントサンプル画像:上段右)
/* -------- Webフォント(ZenKakuGothicNew) -------- */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;700&display=swap');
#site {
font-family: 'Zen Kaku Gothic New', sans-serif;
}
NotoSerif(明朝体/フォントサンプル画像:下段左)
/* -------- Webフォント(NotoSerif) -------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;700&display=swap');
#site {
font-family: 'Noto Serif JP', serif;
}
ShipporiMincho(明朝体/フォントサンプル画像:下段右)
/* -------- Webフォント(ShipporiMincho) -------- */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@500;800&display=swap');
#site {
font-family: 'Shippori Mincho', serif;
}