ページを選択

ストブロ

Coffee's Blog.

DIVI Builder で PageSpeed Insights を改善する

執筆者 | 2020年04月09日 | さくらのレンタルサーバー, ストブロ

Googleの「PageSpeed Insights」はウェブサイトの表示速度を評価して、改善する為の検査ツールですが、評価内容が多岐にわたり中々スコアが上げられない感じになります。
色々取り組みしているのを備忘録的に。

今回は@font-familyにfont-display:swap;が設定されていない場合に評価が低下する問題をDIVI Builderで対応する場合の「荒技」です(笑)

1.Wordpressのテーマエディター(cssやphpを直接編集出来る禁断の機能)でdivi テーマを表示。
2.style.cssを選択。
3.検索機能で「font-family」を探す。

@font-face{font-family:ETmodules;src:url(core/admin/fonts/modules.eot);src:url(core/admin/fonts/modules.eot?#iefix) format("embedded-opentype"),url(core/admin/fonts/modules.ttf) format("truetype"),url(core/admin/fonts/modules.woff) format("woff"),url(core/admin/fonts/modules.svg#ETmodules) format("svg");font-weight:400;font-style:normal}

上記の様な記載があるはずです。
このETmodulesが管理画面などで使用される?ものです。それにたった一文追加します。

@font-face{font-family:ETmodules;font-display: swap;src:url(core/admin/fonts/modules.eot);src:url(core/admin/fonts/modules.eot?#iefix) format("embedded-opentype"),url(core/admin/fonts/modules.ttf) format("truetype"),url(core/admin/fonts/modules.woff) format("woff"),url(core/admin/fonts/modules.svg#ETmodules) format("svg");font-weight:400;font-style:normal}

font-display:swap;を加えるだけです。
加え終わったら保存して下さい。
終了です。※くれぐれも自己責任で行ってください。

アップデートのタイミングでstyle.cssが上書きされたら、上記の対策もむこうになります。

googleフォント(noto sans jp)も、なんか、こう…改善させる。

DIVIビルダーの「統合」タグで「head」に追記する項目があります。
そこに以下の一文を追加。

<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">

カスタムCSSの記入欄に以下を追加

body,h1,h2,h3,h4,h5,h6,input,textarea,select{
	font-family: 'Noto Sans JP', sans-serif;
}

これでGoogleフォント(今回はnoto sans jp)もswapに対応します。

久しぶりに出勤

おはようございます。 皆様ご機嫌如何ですか? 桂 コヒ蔵です。 被災地のみなさんには心よりお見舞い申し上げます。 一日でも早く暖かく安心できる春が来る事をお祈りしております。 震災後、会社が休業となりその後初出勤です。...

震災後初めて迎える月曜日。

おはようございます。 今日は震災後初めて迎える月曜日です。 各方面、かなりの混乱が発生する可能性があります。 みなさん、どうかいつも以上に気をつけて行動してください。 被災地のみなさん、安否確認や連絡がとれないみなさん。...

こそっ

|`・ω・´)? | ) ミ  さっ

あ、間に合ったw

昨日からの雪で交通状態は最悪。 ってことで、会社に来る時間もぎりぎりになりました。...

iPhone4用スタンド&Dockケーブル

いまさらですが、 昨日iPhone4用のスタンドとDockケーブルを購入しました。 ポイントなのは「バンパー」との併用です! バンパーが大好きって訳ではないのですが、私にとっては現状最も使いやすいケースなのです。 ただ、問題なのがスリムコネクター。...

ひき始めの攻防

日曜日の朝からなんとなく喉が痛いと思っていたのですが、 どうやら風邪のひき始めの様子。 ここで風邪をひいてはなるまいと、早めの葛根湯攻撃! 「風邪VS私」 で激しい攻防戦が続いております(`・ω・´) 2年に一度位3月に大きな風邪を引きまして、...

一年前は?:電器屋新CM

一年前は何をしていたか? とブログを振り返ると、2010年の3月は既にほぼ毎日更新をスタートしていました。 2010年3月7日は日曜日、なので本来ストブロはお休みでしたが、 この日は書き込みがありましたね。...

たった一言でも・・・

たった一言でも、 ストブロを更新し続ける為に、 自分のペースを守る為に、 自分のルールを守る為に、 たった一言でも、 ブログへ投稿するべきなのだろうか? 「おはよ」だけでも、 かきこむべきなのだろうか? それは読んでくれている人を裏切る行為なのか?...

冬が戻ってきました(>_

今朝は冷え込みましたね! こちらでは、また雪が降っちゃいました。 もう三月だけど、春は遠いなぁって感じです。 出勤に時間が掛かってしまった為・・・ 本日はこれにて!ww...

ミニチュアの日

3月2日は「ミニチュア」の日なんだそうです。 3(み) 2(に) の語呂合わせでしょうね。 ・・・ん? だとすると、ミニが付くものなら何でも来いかな? ミニスカートの日 ミニ肉まんの日 ミニミニピザの日 ミニダンボーの日 ミニーマウスの日 ミニ四駆の日...

終わっちゃいますよ!

2月が終わっちゃいますよ!? あっという間に! え、今日28日? 2月最終日じゃないですかΣ( ̄。 ̄ノ)ノ 早かったですねぇ。 もう、今日は2月の余韻に浸って一杯飲みたいと思いますw...

久しぶりの雨

みなさん、雨はお好きですか? 私はINST内では無双の雨好きなのですが、「雨が好き!」っていうと だいたい理解してくれませんw 今朝は私の町では久しぶりのまとまった雨が降っています。 今日は午後まで降り続く予報です。...

0コメント


電器屋Walkerの過去配信のBGMで利用させて頂いております。

ポッドキャスト品質向上、整音テクニック 解説Live

開催のお知らせ

詳細はこちら

国際ポッドキャストの日

International Podcast Day Event

ツキイチ - 隣のポッドキャスト

まとめファンサイト