フリーランスを始めたばかりの方、WBEデザイナーで構築に自信のない方、もっとクオリティの高いWEBサイトを作り稼いでいきたいと思っている方に、本当にお勧めなページビルダープラグイン【Brizy】を紹介しています。
ElementorやDiviを過去に使った事がありますが、断然Brizyはおすすめです！
表示速度にこだわったページビルダープラグインなので、サクサクと作業が進みます！
海外のプラグインなので、デフォルトで日本語フォントがない点が欠点です。ただ、フォントファイルをアップロードする事が出来るので、日本語フォントファイルのアップロードをして日本語フォントを利用する方法を今回は解説しています！
Brizyについては、こちらの記事で詳しく紹介しています！実際にどのように構築をするのか解説した動画もあります！
この記事でわかる事
Brizyで日本語フォントを反映させる方法
今回は無料で使える「うつくし明朝体」をBrizyへ反映させてみます。
googleフォントの場合はもっと簡単に反映させる事が出来るので後半でご紹介します。
日本語フォントをダウンロード
日本語ダウンロードサイトへ移行し、フォントファイルをダウンロードします。
日本語フォントを反映させたいテキストをBrizyで表示
仮にBrizyのテンプレートブロックの１つを例に、日本語フォントを反映させてみます。
Add New Font
【T】のアイコンをクリックして、【Add New Font】をクリックします。
フォントをアップロード
Uploadをクリックして、先ほどダウンロードした日本語フォントをアップロードします。
１．フォント表示名を決める
Brizyでフォントを選択する時にわかるように、フォント名を決めます。今回はそのまま「うつくし明朝代」とします。
２．フォントの太さバリエーション選択＆アップロード
アップロードするフォント太さを選択します。
うつくし明朝代はzipファイルを展開すると【ttf】形式だったので【ttf】からアップロードしました。
３．日本語フォントアップロード完了
【Add new font variation】からフォントの別の太さを登録出来ますが、今回は1種類しかなかったのでここでおしまいにします。【Continue】をクリック。
Brizyへ日本語フォント追加完了
ご覧の通り、Brizyへ日本語フォントが簡単に追加されました。
日本語フォントを使ってみる
早速、日本語フォントをBrizyで使ってみました。
サイト上では
googleフォントをBrizyで使う場合
googleフォントはもっと簡単に使う事が出来ます。
【Add New Font】をクリックした時に、先ほどば【Upload】からファイルをアップロードする方法を選びましたが、googleフォントをBrizyで使いたい場合は【Google Fonts】を選択します。
Noto Sans JP
今回は有名なNoto Sans JPをgoogleフォントから読み込みます。
フォントを入力
使いたいフォント名を入力すると候補一覧が出てくれるので、そちらから選択する事が出来ます。【Noto Sans JP】ありました。【Continue】をクリックすると
完了です。
実際にgoogleフォントが反映されているか確認
先ほど追加したうつくし明朝体の下に反映されていました。
googleフォントを読み込んでいるので、太さのバリエーションも自動で反映されていて、フォントをアップロードするよりとても快適です。
サイト上でもフォントがNoto Sans JPへ変わりました。
まとめ
海外製ページビルダープラグインBrizyですが、日本語フォントも簡単に使えるようになります。一度アップロードしたフォントは、次回からは選択するだけで使えます。
フォントによってサイトの印象がガラッと変わるので、オリジナルのフォントが設定できる点はとてもお勧めです！
