Tricktree for QooQを開放します

Tricktree for QooQ

暫定ですが、仕上がったので開放します

Tricktree について (about Tricktree)

• LinktreeライクなBloggerテーマ Tricktree をリリースしました

QooQでのデモ > https://qooq-kustom.blogspot.com/p/trick-tree.html

QooQ の Version は 2.00 です

禁止事項

AdSenceを導入しているブログでの使用は禁止です。
(サイドバーなどを非表示にする事でポリシー違反となる恐れがある為)

その他

予告なくコードを変更、修正する場合があります。

追加CSS (テンプレート内に追加)

/* Tricktree for QooQ */
.profile-picture {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 10%;
height: auto;
max-width: 100px;
}
.profile-name {
text-align: center;
padding: 30px;
}
.links {
text-align: center;
margin-top: 20px;
padding: 20px;
border: 1px solid $(brand.color);
border-width: 2px;
width: 290px;
display: block;
margin-left: auto;
margin-right: auto;
border-radius: 40px;
background: $(brand.color);
}
.bottom-text {
text-align: center;
margin-top: 40px;
font-size: 20px;
font-weight: bold;
}
.bottom-text a {
color: $(font.color) !important;
}

テンプレート内 head タグ内(</head>上など)に追加

2025/06/04 更新

urlは書き換えて下さい
追記
postId, pageIdを使った条件分岐を推奨

<b:if cond='data:blog.url == &quot;https://blogname.blogspot.com/p/*.html&quot;'>
<style>
#sub-content,
#navigation,
#header,
.breadcrumbs,
#single-header-title {
  display: none;
}
#main-content {width:100%}
#single-content a {color:#fff}
</style>
</b:if>

ページ公開用 HTML ビュー

<!-- Tricktree for QooQ-->
<!-- Profile picture-->
<div class='profile-picture'>
<img alt="" border="0" data-original-height="282" data-original-width="282" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-m4auYR65mju60wPlFdey1FHKQA6S9jk407ajgyoAZs5yb2H5IkwXUHJWNglXcTgeivjTqjCrfM6496csEMFejs0rrT2wzwHZ77-DZ443i7jqmLYASUfiLI6Ar56jdq9vsb8JbfST0ixk2Lc_SFusb3Vwa8D0XzlPPQXrxB7sSPBx-NkABP_P_s8Q4_M/s1600-cc/girl.webp"/>
</div>
<!-- Profile name-->
<div class='profile-name'>@name</div>
<!-- Links-->
<div class='tree'>
<a class='links' href='#'>STORE</a>
<a class='links' href='#'>NEW ALBUM</a>
<a class='links' href='#'>IG</a>
<a class='links' href='#'>Twitter</a>
<a class='links' href='#'>YouTube</a>
</div>
<!-- Logo -->
<div class='bottom-text'><a href="https://trick-tree.blogspot.com/" target="_blank">Tricktree</a></div>