[Blogger]ページなどにDynamic Viewsなどのgifアニメプリローダーを仕込む

Add an Awesome Preloader In Blogger Website - UPG Tech » Make it Simple
https://www.upg.com.np/2020/03/how-to-add-preloader-in-blogger.html

アレが見れるURL > https://www.blogger.com/img/gear.gif

とりあえず、Tricktreeのデモに仕込んだ結果
https://tt-order.blogspot.com/p/tricktree.html

やり方は404ページの作成と同じ様な感じですね
[Blogger]オリジナルのカスタム 404ページを作成する

<b:if cond='data:blog.pageId == &quot;pageId&quot;'>
<div id='preloader'><div id='status'><img alt='' src='https://www.blogger.com/img/gear.gif'/></div></div>

<style>
/* Preloader CSS by UPG.com.np */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 99999;
    height: 100%;
}
#status {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 64px;
    height: 64px;
    margin: -32px 0 0 -32px;
    padding: 0;
}
</style>

<!-- /* Preloader Javascript */ -->
<script crossorigin='anonymous' integrity='sha256-1IKHGl6UjLSIT6CXLqmKgavKBXtr0/jJlaGMEkh+dhw=' src='https://code.jquery.com/jquery-2.0.0.min.js'/>
<!-- <script src='//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'/> -->
<script>
//<![CDATA[
$(window).load(function(){$("#status").fadeOut("slow");$("#preloader").delay(500).fadeOut("slow").remove();})
//]]>
</script>
</b:if>

赤字が変更部分など
みんな分岐の中に入れちゃいました
分岐入れなければ全てのページで読み込まれます

関連エントリ

• [Blogger]postId, pageIdを使った条件分岐