Blogger tutorial

The classic theme tutorial link:
http://www.elizabethcastro.com/blogvqj/extras/templatetags.html

If mobile show's second generation theme (not classic)

1. Settings
2. Custom redirects inside Errors and redirects
3. Add custom redirect from ?m=1 to ?m=0

Classic Theme for Blog & Single Post

<!DOCTYPE html>
<html>
<head>
  <title><$BlogPageTitle$></title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js" defer></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" defer></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" defer></script>
  <style>
    nav { padding-top:0; padding-bottom:0; }
    blockquote { background:#EEE; font-family:courier; font-size:12px; padding:20px; }
    .sticky-top { z-index:99999 !important; }
  </style>
</head>
<body>
<nav class="navbar navbar-expand-sm bg-dark navbar-dark sticky-top">
  <ul class="container navbar-nav">
    <li class="nav-item"><a class="nav-link" href="https://onbiponi.blogspot.com">Home</a></li>
    <li class="nav-item"><a class="nav-link" href="https://www.blogger.com/blogger.g?blogID=6361392784509304650#editor">New Post</a></li>
    <li class="nav-item">
      <form action="https://onbiponi.blogspot.com/search" method="get">
        <div class="input-group">
          <input type="text" name="q" class="form-control border-right">
          <div class="input-group-append">
            <input type="submit" class="fa fa-search bg-white border-white">
          </div>
        </div>
      </form>
    </li>
  </ul>
</nav>

<div class="container pt-3" style="margin-bottom:72px">
  <div class="row">
    <MainOrArchivePage>
      <Blogger>
        <div class="col-sm-2 col-md-3 col-lg-4">
          <BlogItemTitle><a href="<$BlogItemPermalinkUrl$>"><$BlogItemTitle$></a></BlogItemTitle>
        </div>
      </Blogger>
    </MainOrArchivePage>
    <ItemPage>
      <Blogger>
        <div class="col-12">
          <BlogItemTitle><h1><$BlogItemTitle$></h1></BlogItemTitle>
        </div>
        <div class="col-12"><$BlogItemBody$></div>
        <div class="col-12"><a class="btn btn-link" href="https://draft.blogger.com/blog/post/edit/6361392784509304650/<$BlogItemNumber$>">Edit This post</a></div>
      </Blogger>
    </ItemPage>
  </div>
</div>

<div class="row" style="position:fixed; bottom:0; left:0; right:0">
  <div class="col-12 text-center bg-dark text-secondary p-3 mt-3">© copyright-2020 Rejaul</div>
</div>
</body>
</html>

Single Page Theme with Links

<!-- Shahpur Progoti Songho | Single Page -->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- Bootstrap JS Bundle (includes Popper) -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script>

<style>
  html, body { height: 100%; margin:0; font-family:'Noto Sans Bengali',sans-serif; background-color:#f8f9fa; }
  body { display:flex; flex-direction:column; min-height:100vh; }
  nav.navbar { padding:0.5rem 1rem; background-color:#212529; }
  nav .nav-link { color:#f8f9fa !important; transition:color 0.3s; }
  nav .nav-link:hover { color:#0d6efd !important; }
  .container-main { flex:1 0 auto; padding:2rem 0; min-height:1vh; }
  h1 { font-weight:700; }
  .card-link { display:flex; align-items:center; padding:1rem; margin-bottom:1rem; border-radius:12px; text-decoration:none; color:#0d6efd; background-color:#fff; box-shadow:0 2px 5px rgba(0,0,0,0.08); transition:all 0.3s ease; }
  .card-link span { font-size:1.2rem; margin-right:10px; }
  .card-link:hover { background-color:#0d6efd; color:white; box-shadow:0 4px 12px rgba(0,0,0,0.15); text-decoration:none; }
  .section-title { margin:3rem 0 1.5rem 0; font-weight:600; color:#0d6efd; text-align:center; }
  footer { flex-shrink:0; text-align:center; background-color:#212529; color:#adb5bd; padding:15px 0; font-size:0.9rem; }
</style>

<!-- Navbar -->
<nav class="navbar navbar-expand-sm sticky-top">
  <div class="container">
    <a class="navbar-brand text-light fw-bold" href="https://progoti-songho.blogspot.com">শাহপুর প্রগতি সংঘ</a>
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav ms-auto">
        <li class="nav-item"><a class="nav-link" href="https://progoti-songho.blogspot.com">হোম</a></li>
        <li class="nav-item"><a class="nav-link" href="https://forms.gle/abcd" target="_blank">সদস্য ভর্তি ফর্ম</a></li>
        <li class="nav-item"><a class="nav-link" href="https://forms.gle/abcd" target="_blank">চাঁদা প্রদান ফর্ম</a></li>
      </ul>
    </div>
  </div>
</nav>

<!-- Main Container -->
<div class="container container-main">
  <h1 class="text-center text-primary mb-4">শাহপুর প্রগতি সংঘ</h1>
  <p class="text-center text-muted mb-4">নিচের লিংকগুলো থেকে আপনার প্রয়োজনীয় ফর্ম বা ডকুমেন্ট দেখুন</p>

  <div>
    <a href="https://docs.google.com/forms/d/e/abcd/viewform?usp=sharing&ouid=abcd" target="_blank" class="card-link">
      <span>🧾</span> অনলাইন সদস্য ভর্তি ফর্ম
    </a>
    <a href="https://docs.google.com/forms/d/e/abcd/viewform?usp=sharing&ouid=abcd" target="_blank" class="card-link">
      <span>💰</span> অনলাইন মাসিক চাঁদা প্রদান ফর্ম
    </a>
    <a href="https://drive.google.com/file/d/abcd/view?usp=drive_link" target="_blank" class="card-link">
      <span>📜</span> গঠনতন্ত্র
    </a>
  </div>

  <h2 class="section-title">ডাউনলোড সেকশন</h2>
  <div>
    <a href="https://drive.google.com/file/d/abcd/view?usp=sharing" target="_blank" class="card-link">
      <span>🧾</span> সদস্য ভর্তি ফর্ম ডাউনলোড
    </a>
    <a href="https://drive.google.com/file/d/abcd/view?usp=sharing" target="_blank" class="card-link">
      <span>💰</span> মাসিক চাঁদা ফর্ম ডাউনলোড
    </a>
  </div>
</div>

<footer>
  &copy; ২০২৫ শাহপুর প্রগতি সংঘ
</footer>