ページを選択

ストブロ

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に対応します。

最近のインスト、中間報告

おはようございます! 慣性の法則に逆らえない、桂 コヒ蔵です(^o^)丿~♪ 毎日地球の自転に負けてベッドから立ち上がれません。 まして夜中の固焼き醤油煎餅などと言ったら、かならず口に入ってきます! なんて強いんだ・・・慣性Σ(゚д゚;)...

七月のロスタイム。

僕らの七月は終わろうとしていた。 さめやらぬ興奮。 手に取るように思い出せるけど、 すべてが終わってみるとなんだか、 現実とは思えないような。 でも、いま握っているこの手だけは真実だ。 俺はもう、彼女のこの日焼けした、でも折れそうなまでに細い手を...

そして普通の月曜日。

そろそろ各地の小中学校も夏休みでしょうか。 梅雨があけ、夏が始まり、 夏祭りやイベント等、 外出する機会も多くなりますね。 癒し系突撃レポーター 桂 コヒ蔵です(^o^)丿~♪ 書く言う私もこの週末、いわゆる「同窓会」に参加してきました。...

TカードとEdyカードと私。

お早う御座います! ツイッターの紹介を広島弁で翻訳してくれている動画をみて とても分かりやすいなぁと感じつつ、 どうすれば「やってみよう!」という気になったか とうい興味が尽きない・・・・ コヒ蔵です(^o^)丿~♪ 私は毎朝コンビニで朝食を買います。...

USB付いてないし、とかをもう一度カンガルー

おはよう御座います。 Windows7大好きですが、以前のようにあれこれいじってない事に気づき 「俺も、もう若くないんだなぁ」と しみじみしている突撃レポーター 桂 コヒ蔵(33)です(^o^)丿~♪ ・・・木沢さんとかすごいよねw...

iPhone iPadの所有状況確認。

おはようございます。 エバンジェリスト、エバンジェリスター、エバンジェリステスト。 3段活用でお馴染み、桂 コヒ蔵です(^o^)丿~♪ サンダンバラ、サンダンバラー、サンダンバラスト。 えー、昨日の事ですが。 ようやく、 マチニマッテストな! iPhone...

情報を読む目について思う。

座右の銘は「やっつけ仕事」 突撃レポーターの桂 コヒ蔵です(^o^)丿~♪ コヒ子・デラックス えー、っと。 必ずしも「情報操作」と言い切れませんが、 マスコミを始め様々な媒体の「意思誘導」が気になってしかたありません。...

何か変わったかな?

今日からストブロのワードプレスをバージョン3にアップデートしました。 といっても、皆様には「なんのこっちゃい」って感じだとは思いますが(^^ゞ 電器屋Wlakerやこのストブロは さくらインターネットのレンタルサーバーを利用して配信されています。...

現状のご報告

おはようございます(^o^)丿 更新が滞っておりまして、誠に申し訳御座いません! 電器屋WalkerはTaijiとCoffeeがそれぞれ編集を行っておりますが、...

七月ですな

こんにちは、突撃お天気レポーターの桂 コヒ蔵です(^o^)丿~♪ 今朝気づいたのですが・・・ 七月ですね(^^ゞ 今年は非常に梅雨らしく、雨がちなお天気が続いています。 これだけ降ってくれれば今年の夏場は水不足問題とは無縁で居られるかな?と思ったり。...

0コメント


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

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

開催のお知らせ

詳細はこちら

国際ポッドキャストの日

International Podcast Day Event

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

まとめファンサイト