アヒル用Tricktree

デモ

WISH LISTのURLを除いて、コードはそのままです

HTML ビュー 用コード

<div class="d-grid gap-2 col-6 mx-auto">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXdED2IWpJ2kYlNeTQ7dTvU9XQNJZ3BjrMfIDtRXQfDEx-4dvrj0eRGYNKhUOqODLxT_DnjvNsHaCloh748wWdAYAC-l87IqFeNYgxTUySXJFlZNaYhcVJPxKH8YhKMl5HO5QD8Q4SUKgG/s100/B_5V9vvVAAE6qBC_3.png" alt="profile picture" class="profile-picture">
  <div class="text-center"><b>@F(uriouz)</b></div>
  <a class="btn btn-outline-primary mt-5" href="https://furiouzps.blogspot.com/" target="_blank" role="button"><svg class="icon" width="22" height="22" fill="currentColor"><use xlink:href="/responsive/sprite_v1_6.css.svg#ic_post_blogger_black_24dp"/></svg> Blog</a>
  <a class="btn btn-outline-primary" href="https://note.com/furiouz" target="_blank" role="button">note</a>
  <a class="btn btn-outline-primary" href="https://x.com/03kustom" target="_blank" role="button"><i class="bi bi-twitter-x"></i></a>
  <a class="btn btn-outline-primary" href="#" target="_blank" role="button"><i class="bi bi-amazon"></i> WISH LIST</a>
  <a class="btn btn-outline-primary" href="https://support.google.com/profile/67273507" target="_blank" role="button"><i class="bi bi-google"></i> COMMUNITY</a>
  <a class="btn btn-outline-primary" href="https://github.com/UsernameFuriouz" target="_blank" role="button"><i class="bi bi-github"></i> GitHub</a>
  <button type="button" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#exampleModal"><i class="bi bi-envelope-heart"></i> Contact</button>
</div>

<p class="text-center pt-5 bottom-text"><a href="https://trick-tree.blogspot.com/" target="_blank"><b><span translate="no">Tricktree</span></b></a></p>

<style>
.header, .DuckDuckGo, h2.post-title, .home-link, .Footer {
  display: none;
}
  
.post-outer {
  box-shadow: none !important;
  --bs-card-border-color: none;
}
 
.divide {
  padding-bottom: 0px;
  border-bottom: 0px solid #c7c8c9;
  margin-bottom: 0px;
}
  
img {
border-radius: 50%;
}
.profile-picture {
display: block;
margin-left: auto;
margin-right: auto;
height: auto;
max-width: 100px;
}
.bottom-text a {
  text-decoration: none;
}
</style>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h1 class="modal-title fs-5" id="exampleModalLabel">お問い合わせ</h1>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
<div class='bloggerForm'></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

関連エントリ

• Bloggerテーマ、アヒル用連絡フォーム(モーダル)