賢威ツイートサイトにYouTubeの動画を埋め込んている方は、注意して下さい。サイトの表示速度がかなり遅くなっている可能性が高いです。当記事では、賢威7.1テンプレートに動画を埋め込んだ場合で、サイトの表示速度が低下したときの対処法をご紹介します。スタイルとスクリプトの順序を最適化するGTmetrixでサイトのスピードを確認するまずはGTmetrixでサイトのスピードを測定して下さい。このツールの評価が、必ずしも正しいというわけではないかもしれません。いった所に問題があるのか細かく知ることができるので便利です。このブログを測定してみると......かなり遅いことが分かります。問題はYouTubeの動画の埋め込みです。scripts」の項目にYouTubeの動画が表示されています。scripts」では......そこで、これを改善したいと思います。JavaScript(JavaScriptの解析を延期する)」にYouTubeの動画が表示されている場合、次の方法で解決できるかもしれません。「function.php」にコードを追加することになるので、バックアップを取って下さい。親テーマがアップデートされた場合でもカスタマイズした部分を残すためには、子テーマを設置していきましょう。賢威テンプレートに子テーマを設置するには「ワードプレス初心者向け|賢威に子テーマを設置する方法(エックスサーバー編)」を参考にしてみて下さい。JavaScript」の改善ページにYouTubuの動画が一つだけある場合と複数ある場合では、使うコードが違います。YouTubeの動画が一つだけあるときの対処法を説明します。ページにYouTubuの動画が一つだけある場合YouTubeのコードは↓のようになっていると思います。このコードから「allow=”autoplay;」を削除して、ogfYd705cRsの後に「?rel=0」を追加します。「ogfYd705cRs」はIDになるので動画によって異なります。</iframe>このようにしておくと動画が終わったときに他の動画が自動で表示されなくなります。次に「iframe」のうしろへ「id=”videoDefer”」を追加して「src」を「data-src」に書き換えて下さい。</iframe>ここからは、バックアップが必要です。「外観」から「テーマの編集」をクリックして「function.php」の最下部に↓のコードを貼り付けます。);動画を一つだけ設置した場合は、これで改善されると思います。ページにYouTubeの動画が複数ある場合YouTubeの埋め込みタグが複数ある場合は、すべてのタグの「iframe」の後に「class=”videoDefer”」を追加して下さい。「src」は動画が一つだけあるときと同じように「data-src」にします。</iframe>次に下のコードを「function.php」に貼り付けて下さい。);複数の動画を埋め込んでいる場合でも、これで対処できるかと思います。スタイルとスクリプトの順序を最適化するスタイルとスクリプトの順序を最適化するには、下のコードを「function.php」の最下部に貼り付けて下さい。vimg.getAttribute('data-src'));}});});また、特定のページだけに適応したい場合は、賢威のエディタ画面の下の方にある「この記事だけの個別CSS/JS記述欄」のなかに同じコードを<script></script>で囲んで貼り付けてください。スタイルとスクリプトの順序を最適化する作業はこれで完了です。再度GTmetrixで測定してみると......ページスピードスコアが2倍に改善しています。JavaScript」を見てみると......改善しなければならないJavaScriptはたくさんありますが、YouTubeのリンクは消えています。scripts」の項目もスッキリしました。賢威7.1のテンプレートでも、お使いのデザインによって使用するコードが違うこともあります。function.phpに編集を加えるときは、慎重におこなってみて下さい。