PR PR

Blogger自動付加されるbundle.cssを読込まず高速化する方法

スポンサーリンク
新着情報
2023.04.09
2023.04.06
2023.04.03
2023.03.19
スポンサーリンク
スポンサーリンク

この記事は2014年7月23日の1年以上前に書かれたものです。現在は状況が異なる可能性がありますのでご注意ください。

記事内に広告が含まれています。

昨年から、
Bloggerブログを利用させていただいています。

そんな中、

スポンサーリンク

スポンサーリンク

これまで色々とカスタマイズをしてきてみました。


Bloggerの元々用意されている?テンプレートを、

  • 使用していても、
  • 使用していなくても?

デフォルトのまま使用していると、

  1. ~bundle.css
  2. ~authorization.css?targetBlogID=ご自身のブログID"

の2つが、
勝手に付加されます。

これらが表示速度を少しでも遅くしているのは事実です。

以下ブログ参照
Bloggerに自動で追加されるバンドルCSSを除去する : たき備忘録
Bloggerの読み込み遅延の元凶「widget css bundle」を削除して高速化する Degustation?: Sepia

昨年、
現在のテンプレートではない時に、
試してみましたが、

カラム落ちしてしまいました。

結局、
対処法がわからないままそのままの状態でいました。

今回、
解決方法かと思われる方法を備忘録として、
残していおきたいと思います。

具体的方法

まず、
テンプレートを見ると、

以下の部分があります。

<b:skin><![CDATA[
自分のスタイルシート
]]></b:skin>

個々の部分を、

以下のように書き換えます。

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/
自分のスタイルシート
]]></b:skin>

すると、
テンプレートを展開後にページのソースを見ると、
以下のようになっています。

<style type="text/css">
<!-- /*<link type='text/css' rel='stylesheet' href='https://www.blogger.com/static/v1/widgets/3841957138-widget_css_bundle.css' />
<link type='text/css' rel='stylesheet' href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=自分のブログID&zx=74a6d4be-5c08-4c60-bd5e-e2fdb844d5e9' />
<style id='page-skin-1' type='text/css'><!--
*

これを見ると、
https://www.blogger.com/static/v1/widgets/3841957138-widget_css_bundle.css
と、
https://www.blogger.com/dyn-css/authorization.css?targetBlogID=自分のブログID&zx=74a6d4be-5c08-4c60-bd5e-e2fdb844d5e9

の2つが、

コメントアウト化されているのがわかると思います。

しかし、
これだけだと、
昨年と同じく、
(現在はテンプレートを変えたので大丈夫かと思ったのですが…。)、

カラム落ちしてしまいます。

それならばと、

外部に読み込みにいっているbundle.cssの内容を、

以下のように、
直接書き込みました。

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/
【bundle.cssの内容をコピペ】
自分のスタイルシート
]]></b:skin>

こうすると、
勝手に付加・付与される、
-widget_css_bundle.css
と、
https://www.blogger.com/dyn-css/authorization.css?targetBlogID=自分のブログID&zx=74a6d4be-5c08-4c60-bd5e-e2fdb844d5e9

の2つは、
コメントアウト化されたままで、

ブログ表示も崩れることなく正常に表示されます。

また、
Bloggerの読み込み遅延の元凶「widgets.js」「plusone.js」を削除して高速化する…非推奨 Degustation?: Sepia

こちらに関しても、
Degustation?: Sepiaさんのように以下記述後に、
上記と同操作で可能かと思いました。

&lt;!--
</body>
--&gt;
&lt;/body&gt;
</html>

記述することでコメントアウト化はされます。

ですが、

画像のライトボックス機能がなくなってしまいます。

直書きで何とかなるかと思いましたが、
ダメでした。

まとめ

なので、
今のところ解決策なし(方法がわからない)です。

こちらも、
時間の経過と経験で、
来年くらいまでには、
クリアできるようになっていればいいなぁ。
と思います。

※他にも気づかないだけで何か影響があるかもしれません。

スポンサーリンク
タイトルとURLをコピーしました