✦ CODE SNIPPET
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta charset='UTF-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<title><data:blog.pageTitle/></title>
<b:include data='blog' name='all-head-content'/>
<b:skin><![CDATA[
:root {
--primary: #f97316;
--primary-dark: #ea580c;
--dark-bg: #0f172a;
--card-bg: #ffffff;
--text-main: #1e293b;
--text-muted: #64748b;
--border-color: #cbd5e1;
--whatsapp: #25D366;
--whatsapp-hover: #20BA5A;
--price-red: #dc2626;
--food-badge: #ef4444;
}
* { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
body { background: #f8fafc; color: var(--text-main); line-height: 1.6; }
/* Header */
header { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); color: white; border-bottom: 3px solid var(--primary); position: sticky; top: 0; z-index: 1000; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.header-container { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; gap: 20px; }
.logo { font-size: 28px; font-weight: 900; color: #ffffff; text-decoration: none; letter-spacing: -0.5px; }
.logo span { color: var(--primary); }
.search-bar { flex: 1; max-width: 500px; position: relative; display: flex; }
.search-bar input { width: 100%; padding: 12px 18px; border: none; border-radius: 30px 0 0 30px; outline: none; font-size: 14px; background: #ffffff; color: #333; }
.search-bar button { background: var(--primary); border: none; color: white; padding: 0 25px; border-radius: 0 30px 30px 0; cursor: pointer; font-weight: 700; transition: background 0.2s; }
.search-bar button:hover { background: var(--primary-dark); }
/* Promo Hero */
.promo-hero { background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%); color: white; padding: 45px 20px; text-align: center; border-radius: 16px; margin: 25px auto; max-width: 1200px; box-shadow: 0 10px 25px rgba(59,130,246,0.3); }
.promo-hero h1 { font-size: 34px; font-weight: 800; margin-bottom: 10px; }
.promo-hero p { font-size: 16px; opacity: 0.95; max-width: 600px; margin: 0 auto; }
/* Container & Grid */
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px 50px 20px; }
.section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; border-bottom: 2px solid var(--border-color); padding-bottom: 10px; }
.section-title { font-size: 24px; font-weight: 800; color: var(--dark-bg); display: flex; align-items: center; gap: 10px; }
.section-title::before { content: ''; width: 8px; height: 24px; background: var(--primary); border-radius: 4px; display: inline-block; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 25px; }
/* Product Card */
.product-card { background: var(--card-bg); border-radius: 16px; overflow: hidden; border: 1px solid var(--border-color); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); display: flex; flex-direction: column; position: relative; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); }
.product-card:hover { transform: translateY(-8px); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.12); border-color: var(--primary); }
.product-thumb-wrap { width: 100%; height: 220px; background: #fff; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.product-thumb { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.product-card:hover .product-thumb { transform: scale(1.08); }
.food-badge { position: absolute; top: 12px; left: 12px; background: var(--food-badge); color: white; font-size: 12px; font-weight: 800; padding: 5px 12px; border-radius: 20px; z-index: 10; box-shadow: 0 3px 8px rgba(239,68,68,0.5); text-transform: uppercase; letter-spacing: 0.5px; }
.product-info { padding: 18px; display: flex; flex-direction: column; flex-grow: 1; }
.product-title { font-size: 15px; font-weight: 700; margin-bottom: 12px; color: var(--text-main); text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: 44px; }
.product-title:hover { color: var(--primary); }
.price-box { display: flex; align-items: baseline; gap: 10px; margin-bottom: 15px; }
.current-price { font-size: 20px; font-weight: 900; color: var(--price-red); }
.card-actions { display: flex; gap: 10px; margin-top: auto; }
.card-btn { flex: 1; padding: 11px; text-align: center; border-radius: 10px; font-size: 13px; font-weight: 700; cursor: pointer; border: none; text-decoration: none; transition: all 0.2s; display: inline-flex; align-items: center; justify-content: center; }
.btn-details { background: #f1f5f9; color: var(--text-main); border: 1px solid var(--border-color); }
.btn-details:hover { background: #e2e8f0; }
.btn-order { background: linear-gradient(135deg, #f97316 0%, #ea580c 100%); color: #ffffff; gap: 6px; box-shadow: 0 4px 12px rgba(249,115,22,0.3); }
.btn-order:hover { transform: translateY(-2px); }
/* Pager */
.blog-pager { text-align: center; margin-top: 35px; }
.blog-pager a { display: inline-block; background: var(--primary); color: #fff; padding: 12px 28px; border-radius: 30px; font-weight: 700; text-decoration: none; margin: 0 6px; }
.blog-pager a:hover { background: var(--primary-dark); }
/* Product Details Page */
.post-layout { display: grid; grid-template-columns: 1.4fr 0.8fr; gap: 35px; align-items: start; margin-top: 25px; }
.post-main-card { background: var(--card-bg); padding: 35px; border-radius: 20px; border: 1px solid var(--border-color); box-shadow: 0 10px 25px rgba(0,0,0,0.05); }
.post-title-main { font-size: 30px; font-weight: 900; margin-bottom: 20px; color: var(--dark-bg); line-height: 1.3; }
.post-body { font-size: 16px; color: var(--text-muted); line-height: 1.8; }
.post-body img { max-width: 100%; height: auto; border-radius: 12px; margin: 20px 0; box-shadow: 0 8px 20px rgba(0,0,0,0.08); }
/* Order Sidebar */
.order-sidebar { background: var(--card-bg); padding: 30px; border-radius: 20px; border: 1px solid var(--border-color); position: sticky; top: 100px; box-shadow: 0 15px 35px rgba(0,0,0,0.08); }
.sidebar-price-box { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; border-bottom: 2px solid var(--border-color); padding-bottom: 15px; }
.sidebar-price-box .current-price { font-size: 32px; font-weight: 900; color: var(--price-red); }
.features-list { list-style: none; margin-bottom: 25px; font-size: 14px; color: var(--text-muted); display: flex; flex-direction: column; gap: 12px; }
.features-list li { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.features-list span { color: #10b981; font-size: 18px; background: #dcfce7; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.single-order-btn { background: var(--whatsapp); color: white; width: 100%; padding: 16px; border-radius: 12px; border: none; font-size: 17px; font-weight: 800; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 10px; transition: all 0.2s; box-shadow: 0 6px 20px rgba(37,211,102,0.35); text-decoration: none; }
.single-order-btn:hover { background: var(--whatsapp-hover); transform: translateY(-2px); }
.order-instructions { margin-top: 25px; border-top: 1px solid var(--border-color); font-size: 13px; color: var(--text-muted); line-height: 1.6; background: #f8fafc; padding: 15px; border-radius: 12px; }
.order-instructions h4 { font-size: 14px; font-weight: 800; color: var(--dark-bg); margin-bottom: 8px; }
.order-instructions ol { padding-left: 18px; display: flex; flex-direction: column; gap: 6px; }
/* Modal */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(15,23,42,0.75); backdrop-filter: blur(6px); z-index: 2000; align-items: center; justify-content: center; }
.modal-box { background: white; width: 90%; max-width: 440px; max-height: 92vh; overflow-y: auto; padding: 35px; border-radius: 24px; position: relative; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.3); }
.modal-close { position: absolute; top: 18px; right: 20px; font-size: 20px; cursor: pointer; border: none; background: #f1f5f9; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: bold; color: var(--dark-bg); }
.modal-title { font-size: 22px; font-weight: 900; margin-bottom: 20px; color: var(--dark-bg); border-bottom: 2px solid var(--border-color); padding-bottom: 12px; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; color: var(--dark-bg); }
.form-group input, .form-group textarea { width: 100%; padding: 13px 16px; border: 2px solid var(--border-color); border-radius: 12px; font-size: 14px; outline: none; background: #f8fafc; }
.form-group input:focus, .form-group textarea:focus { border-color: var(--primary); background: white; }
.form-group textarea { resize: vertical; height: 75px; }
.submit-order-btn { width: 100%; background: var(--whatsapp); color: white; border: none; padding: 15px; border-radius: 12px; font-weight: 800; font-size: 16px; cursor: pointer; margin-top: 10px; transition: background 0.2s; box-shadow: 0 6px 20px rgba(37,211,102,0.35); }
.submit-order-btn:hover { background: var(--whatsapp-hover); }
/* Footer */
footer { background: var(--dark-bg); color: #94a3b8; padding: 45px 20px; text-align: center; margin-top: 60px; font-size: 14px; border-top: 4px solid var(--primary); }
footer p { font-weight: 600; color: #cbd5e1; }
@media(max-width: 768px) {
.post-layout { grid-template-columns: 1fr; }
.order-sidebar { position: static; }
.search-bar { display: none; }
.promo-hero h1 { font-size: 26px; }
}
]]></b:skin>
</head>
<body>
<!-- Header -->
<header>
<div class='header-container'>
<a class='logo' expr:href='data:blog.homepageUrl'>BD <span>SHOP</span></a>
<form action='/search' class='search-bar' method='get'>
<input name='q' placeholder='পণ্য বা সুস্বাদু খাবার সার্চ করুন...' type='text'/>
<button type='submit'>🔍 সার্চ</button>
</form>
<div class='header-actions'>
<span>🛒 কার্ট</span>
</div>
</div>
</header>
<!-- Promo Hero -->
<div class='container' style='padding-bottom:0;'>
<div class='promo-hero'>
<h1>ইলেকট্রনিক্স থেকে সুস্বাদু খাবার—সব এক ছাদের নিচে!</h1>
<p>সেরা দামে গ্যাজেট, হোম অ্যাপ্লায়েন্স এবং ফ্রেশ ফুড অর্ডার করুন ক্যাশ অন ডেলিভারিতে।</p>
</div>
</div>
<!-- Main Content -->
<div class='container' id='shop-section'>
<b:section class='main-content' id='main-content' showaddelement='yes'>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='showDateHeader'>false</b:widget-setting>
<b:widget-setting name='style.textcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showShareButtons'>false</b:widget-setting>
<b:widget-setting name='showCommentLink'>false</b:widget-setting>
<b:widget-setting name='style.urlcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showAuthor'>true</b:widget-setting>
<b:widget-setting name='style.linkcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='style.unittype'>TextAndImage</b:widget-setting>
<b:widget-setting name='style.bgcolor'>#ffffff</b:widget-setting>
<b:widget-setting name='timestampLabel'/>
<b:widget-setting name='reactionsLabel'/>
<b:widget-setting name='showAuthorProfile'>false</b:widget-setting>
<b:widget-setting name='style.layout'>1x1</b:widget-setting>
<b:widget-setting name='showLabels'>true</b:widget-setting>
<b:widget-setting name='showLocation'>true</b:widget-setting>
<b:widget-setting name='postLabelsLabel'/>
<b:widget-setting name='showTimestamp'>true</b:widget-setting>
<b:widget-setting name='postsPerAd'>3</b:widget-setting>
<b:widget-setting name='showBacklinks'>false</b:widget-setting>
<b:widget-setting name='style.bordercolor'>#ffffff</b:widget-setting>
<b:widget-setting name='showInlineAds'>true</b:widget-setting>
<b:widget-setting name='showReactions'>false</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<!-- HOME / INDEX / ARCHIVE / SEARCH -->
<b:if cond='data:blog.pageType == "index" or data:blog.pageType == "archive"'>
<div class='section-header'>
<h2 class='section-title'>সকল পণ্য ও স্পেশাল ফুড কালেকশন</h2>
</div>
<div class='product-grid'>
<b:loop values='data:posts' var='post'>
<div class='product-card'>
<div class='product-thumb-wrap'>
<b:loop values='data:post.labels' var='lbl'>
<b:if cond='data:lbl.name == "Food" or data:lbl.name == "Foods" or data:lbl.name == "food" or data:lbl.name == "foods"'>
<span class='food-badge'>🔥 Hot Food</span>
</b:if>
</b:loop>
<b:if cond='data:post.featuredImage'>
<img class='product-thumb' expr:alt='data:post.title' expr:src='data:post.featuredImage'/>
<b:else/>
<img alt='Product Image' class='product-thumb' src='https://via.placeholder.com/240x220?text=Product+Item'/>
</b:if>
</div>
<div class='product-info'>
<a class='product-title' expr:href='data:post.url'><data:post.title/></a>
<div class='price-box'>
<span class='current-price'><b:loop index='pi' values='data:post.labels' var='pl'><b:if cond='data:pi == 0'><data:pl.name/></b:if></b:loop></span>
</div>
<div class='card-actions'>
<a class='card-btn btn-details' expr:href='data:post.url'>বিস্তারিত</a>
<button class='card-btn btn-order js-order-btn' type='button'>🛒 অর্ডার</button>
</div>
</div>
</div>
</b:loop>
</div>
<div class='blog-pager'>
<b:if cond='data:newerPageUrl'>
<a expr:href='data:newerPageUrl'>« নতুন পণ্য</a>
</b:if>
<b:if cond='data:olderPageUrl'>
<a expr:href='data:olderPageUrl'>আরও পণ্য »</a>
</b:if>
</div>
<!-- SINGLE POST / PRODUCT DETAILS -->
<b:else/>
<b:loop values='data:posts' var='post'>
<div class='post-layout'>
<div class='post-main-card'>
<h1 class='post-title-main'><data:post.title/></h1>
<div class='post-body'>
<data:post.body/>
</div>
</div>
<div class='order-sidebar'>
<div class='sidebar-price-box'>
<span class='current-price'><b:loop index='pi' values='data:post.labels' var='pl'><b:if cond='data:pi == 0'><data:pl.name/></b:if></b:loop></span>
</div>
<ul class='features-list'>
<li><span>✓</span> ১০০% অরিজিনাল ও প্রিমিয়াম কোয়ালিটি</li>
<li><span>✓</span> ঝটপট হোম ডেলিভারি সার্ভিস</li>
<li><span>✓</span> ক্যাশ অন ডেলিভারি সুবিধা</li>
</ul>
<button class='single-order-btn js-order-btn' type='button'>
💬 হোয়াটসঅ্যাপে অর্ডার করুন
</button>
<div class='order-instructions'>
<h4>📌 যেভাবে অর্ডার কনফার্ম করবেন:</h4>
<ol>
<li>বাটনে ক্লিক করে অর্ডার ফর্ম খুলুন।</li>
<li>আপনার নাম, ফোন, ঠিকানা এবং সাইজ/নোট (যদি ফুড হয়) লিখুন।</li>
<li>"সেন্ড অর্ডার" দিলেই সরাসরি আমাদের হোয়াটসঅ্যাপে চলে আসবে!</li>
</ol>
</div>
</div>
</div>
</b:loop>
</b:if>
</b:includable>
<b:includable id='aboutPostAuthor'>
<div class='author-name'>
<a class='g-profile' expr:href='data:post.author.profileUrl' rel='author' title='author profile'>
<span>
<data:post.author.name/>
</span>
</a>
</div>
<div>
<span class='author-desc'>
<data:post.author.aboutMe/>
</span>
</div>
</b:includable>
<b:includable id='addComments'>
<a expr:href='data:post.commentsUrl' expr:onclick='data:post.commentsUrlOnclick'>
<b:message name='messages.postAComment'/>
</a>
</b:includable>
<b:includable id='commentAuthorAvatar'>
<div class='avatar-image-container'>
<img class='author-avatar' expr:src='data:comment.authorAvatarSrc' height='35' width='35'/>
</div>
</b:includable>
<b:includable id='commentDeleteIcon' var='comment'>
<span expr:class='"item-control " + data:comment.adminClass'>
<b:if cond='data:showCmtPopup'>
<div class='goog-toggle-button'>
<div class='goog-inline-block comment-action-icon'/>
</div>
<b:else/>
<a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:messages.deleteComment'>
<img src='https://resources.blogblog.com/img/icon_delete13.gif'/>
</a>
</b:if>
</span>
</b:includable>
<b:includable id='commentForm' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:messages.postAComment/></h4>
<b:if cond='data:this.messages.blogComment != ""'>
<p><data:this.messages.blogComment/></p>
</b:if>
<b:include data='post' name='commentFormIframeSrc'/>
<iframe allowtransparency='allowtransparency' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight ?: "90px"' frameborder='0' id='comment-editor' name='comment-editor' src='' width='100%'/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>');
</script>
</div>
</b:includable>
<b:includable id='commentFormIframeSrc' var='post'>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
</b:includable>
<b:includable id='commentItem' var='comment'>
<div class='comment' expr:id='"c" + data:comment.id'>
<b:include cond='data:blog.enabledCommentProfileImages' name='commentAuthorAvatar'/>
<div class='comment-block'>
<div class='comment-author'>
<b:if cond='data:comment.authorUrl'>
<b:message name='messages.authorSaidWithLink'>
<b:param expr:value='data:comment.author' name='authorName'/>
<b:param expr:value='data:comment.authorUrl' name='authorUrl'/>
</b:message>
<b:else/>
<b:message name='messages.authorSaid'>
<b:param expr:value='data:comment.author' name='authorName'/>
</b:message>
</b:if>
</div>
<div expr:class='"comment-body" + (data:comment.isDeleted ? " deleted" : "")'>
<data:comment.body/>
</div>
<div class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</div>
</div>
</div>
</b:includable>
<b:includable id='commentList' var='comments'>
<div id='comments-block'>
<b:loop values='data:comments' var='comment'>
<b:include data='comment' name='commentItem'/>
</b:loop>
</div>
</b:includable>
<b:includable id='commentPicker' var='post'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threadedComments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:includable>
<b:includable id='comments' var='post'>
<section expr:class='"comments" + (data:post.embedCommentForm ? " embed" : "")' expr:data-num-comments='data:post.numberOfComments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<b:include name='commentsTitle'/>
<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
<b:include cond='data:post.comments' data='post.comments' name='commentList'/>
</div>
<b:if cond='data:post.commentPagingRequired'>
<div class='paging-control-container'>
<b:if cond='data:post.hasOlderLinks'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
<data:messages.oldest/>
</a>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
<data:messages.older/>
</a>
</b:if>
<span class='comment-range-text'>
<data:post.commentRangeText/>
</span>
<b:if cond='data:post.hasNewerLinks'>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
<data:messages.newer/>
</a>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
<data:messages.newest/>
</a>
</b:if>
</div>
</b:if>
<div class='footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='commentForm'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='addComments'/>
</b:if>
</b:if>
</div>
</b:if>
<b:if cond='data:showCmtPopup'>
<div id='comment-popup'>
<iframe allowtransparency='allowtransparency' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
</iframe>
</div>
</b:if>
</section>
</b:includable>
<b:includable id='commentsTitle'>
<h3 class='title'><data:messages.comments/></h3>
</b:includable>
<b:includable id='feedLinks'>
<b:if cond='!data:view.isPost'> <!-- Blog feed links -->
<b:if cond='data:feedLinks'>
<div class='blog-feeds'>
<b:include data='feedLinks' name='feedLinksBody'/>
</div>
</b:if>
<b:else/> <!--Post feed links -->
<div class='post-feeds'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.allowComments and data:post.feedLinks'>
<b:include data='post.feedLinks' name='feedLinksBody'/>
</b:if>
</b:loop>
</div>
</b:if>
</b:includable>
<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:messages.subscribeTo/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>
<b:includable id='homePageLink'>
<a class='home-link' expr:href='data:blog.homepageUrl'>
<data:messages.home/>
</a>
</b:includable>
<b:includable id='iframeComments' var='post'>
<!-- G+ comments, no longer available. The includable is retained for backwards-compatibility. -->
</b:includable>
<b:includable id='inlineAd' var='post'>
<b:if cond='!data:view.isPreview'>
<b:if cond='data:this.adCode or data:this.adClientId or data:blog.adsenseClientId'>
<!-- Ad -->
<div class='inline-ad'>
<b:if cond='data:this.adCode != ""'>
<data:this.adCode/>
<b:else/>
<b:include cond='data:this.adClientId or data:blog.adsenseClientId' name='defaultAdUnit'/>
</b:if>
</div>
</b:if>
<b:else/>
<div class='inline-ad'>
<div class='inline-ad-placeholder'>
<span><b:message name='messages.adsGoHere'/></span>
</div>
</div>
</b:if>
</b:includable>
<b:includable id='nextPageLink'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:messages.olderPosts'>
<data:messages.olderPosts/>
</a>
</b:includable>
<b:includable id='post' var='post'>
<div class='post'>
<b:include data='post' name='postMeta'/>
<b:include data='post' name='postTitle'/>
<b:include name='headerByline'/>
<b:if cond='data:view.isSingleItem'>
<b:include data='post' name='postBody'/>
<b:else/>
<b:include data='post' name='postBodySnippet'/>
<b:include data='post' name='postJumpLink'/>
</b:if>
<b:include data='post' name='postFooter'/>
</div>
</b:includable>
<b:includable id='postBody' var='post'>
<!-- If metaDescription is empty, use the post body as the schema.org description too, for G+/FB snippeting. -->
<div class='post-body entry-content float-container' expr:id='"post-body-" + data:post.id'>
<data:post.body/>
</div>
</b:includable>
<b:includable id='postBodySnippet' var='post'>
<b:include data='post' name='postBody'/>
</b:includable>
<b:includable id='postCommentsAndAd' var='post'>
<article class='post-outer-container'>
<!-- Post title and body -->
<div class='post-outer'>
<b:include data='post' name='post'/>
</div>
<!-- Comments -->
<b:include cond='data:view.isSingleItem' data='post' name='commentPicker'/>
<!-- Show ad inside post container, after comments, if single item. -->
<b:include cond='data:view.isSingleItem and data:post.includeAd' data='post' name='inlineAd'/>
</article>
<!-- Show ad outside post container (between posts) for feed pages. -->
<b:include cond='data:view.isMultipleItems and data:post.includeAd' data='post' name='inlineAd'/>
</b:includable>
<b:includable id='postCommentsLink'>
<b:if cond='data:view.isMultipleItems'>
<span class='byline post-comment-link container'>
<b:include cond='data:post.commentSource != 1' name='commentsLink'/>
</span>
</b:if>
</b:includable>
<b:includable id='postFooter' var='post'>
<div class='post-footer'>
<b:include name='footerBylines'/>
<b:include data='post' name='postFooterAuthorProfile'/>
</div>
</b:includable>
<b:includable id='postFooterAuthorProfile' var='post'>
<b:if cond='data:post.author.aboutMe and data:view.isPost'>
<div class='author-profile'>
<b:if cond='data:post.author.authorPhoto.url'>
<img class='author-image' expr:src='data:post.author.authorPhoto.url' width='50px'/>
<div class='author-about'>
<b:include data='post' name='aboutPostAuthor'/>
</div>
<b:else/>
<b:include data='post' name='aboutPostAuthor'/>
</b:if>
</div>
</b:if>
</b:includable>
<b:includable id='postHeader' var='post'>
<b:include name='headerByline'/>
</b:includable>
<b:includable id='postMeta' var='post'>
<b:include data='post' name='postMetadataJSON'/>
</b:includable>
<b:includable id='postPagination'>
<div class='blog-pager container' id='blog-pager'>
<b:include cond='data:newerPageUrl' name='previousPageLink'/>
<b:include cond='data:olderPageUrl' name='nextPageLink'/>
<b:include cond='data:view.url != data:blog.homepageUrl' name='homePageLink'/>
</div>
</b:includable>
<b:includable id='postTitle' var='post'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title != ""'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link or (data:post.url and data:view.url != data:post.url)'>
<a expr:href='data:post.link ?: data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
</b:includable>
<b:includable id='previousPageLink'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:messages.newerPosts'>
<data:messages.newerPosts/>
</a>
</b:includable>
<b:includable id='threadedCommentForm' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:messages.postAComment/></h4>
<b:if cond='data:this.messages.blogComment != ""'>
<p><data:this.messages.blogComment/></p>
</b:if>
<b:include data='post' name='commentFormIframeSrc'/>
<iframe allowtransparency='allowtransparency' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight ?: "90px"' frameborder='0' id='comment-editor' name='comment-editor' src='' width='100%'/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>');
</script>
</div>
</b:includable>
<b:includable id='threadedCommentJs' var='post'>
<script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
<b:template-script inline='true' name='threaded_comments'/>
<script type='text/javascript'>
blogger.widgets.blog.initThreadedComments(
<data:post.commentJso/>,
<data:post.commentMsgs/>,
<data:post.commentConfig/>);
</script>
</b:includable>
<b:includable id='threadedComments' var='post'>
<section class='comments threaded' expr:data-embed='data:post.embedCommentForm' expr:data-num-comments='data:post.numberOfComments' id='comments'>
<a name='comments'/>
<b:include name='commentsTitle'/>
<div class='comments-content'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='threadedCommentJs'/>
</b:if>
<div id='comment-holder'>
<data:post.commentHtml/>
</div>
</div>
<p class='comment-footer'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='threadedCommentForm'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:if cond='data:post.showManageComments'>
<b:include data='post' name='manageComments'/>
</b:if>
</p>
<b:if cond='data:showCmtPopup'>
<div id='comment-popup'>
<iframe allowtransparency='allowtransparency' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
</iframe>
</div>
</b:if>
</section>
</b:includable>
<b:includable id='tooltipCss'>
<!-- LINT.IfChange -->
<style>
.post-body a.b-tooltip-container {
position: relative;
display: inline-block;
}
.post-body a.b-tooltip-container .b-tooltip {
display: block !important;
position: absolute;
top: 100%;
left: 50%;
transform: translate(-20%, 1px);
visibility: hidden;
opacity: 0;
z-index: 1;
transition: opacity 0.2s ease-in-out;
}
.post-body a.b-tooltip-container .b-tooltip iframe {
width: 200px;
height: 198px;
max-width: none;
border: none;
border-radius: 20px;
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
}
@media (hover: hover) {
.post-body a.b-tooltip-container:hover .b-tooltip {
visibility: visible;
opacity: 1;
}
}
</style>
<!-- LINT.ThenChange(//depot/google3/java/com/google/blogger/b2/layouts/widgets/v2-style.css) -->
</b:includable>
</b:widget>
</b:section>
<!-- Extra Widget Area -->
<div class='sidebar-widgets' style='margin-top:35px; background:#fff; padding:25px; border-radius:16px; border:1px solid var(--border-color); box-shadow: 0 4px 12px rgba(0,0,0,0.03);'>
<b:section class='sidebar' id='sidebar-section' name='Sidebar Widgets' showaddelement='yes'/>
</div>
</div>
<!-- Order Modal -->
<div class='modal-overlay' id='orderModal'>
<div class='modal-box'>
<button class='modal-close' onclick='closeOrderModal()' type='button'>×</button>
<div class='modal-title'>অর্ডার কনফার্ম করুন</div>
<form id='whatsappOrderForm' onsubmit='sendToWhatsApp(event)'>
<input id='modalProductName' type='hidden'/>
<input id='modalProductPrice' type='hidden'/>
<input id='modalProductUrl' type='hidden'/>
<div class='form-group'>
<label>আপনার নাম *</label>
<input id='custName' placeholder='আপনার নাম লিখুন' required='required' type='text'/>
</div>
<div class='form-group'>
<label>মোবাইল নম্বর *</label>
<input id='custPhone' placeholder='যেমন: 01927661298' required='required' type='tel'/>
</div>
<div class='form-group'>
<label>ডেলিভারি ঠিকানা *</label>
<textarea id='custAddress' placeholder='বাসা, রোড, থানা, জেলা...' required='required'/>
</div>
<div class='form-group'>
<label>পরিমাণ ও সাইজ / বিশেষ নোট (যেমন: Size L বা কম ঝাল)</label>
<input id='custNote' placeholder='যেমন: ১ পিস, এক্সট্রা সস' type='text'/>
</div>
<button class='submit-order-btn' type='submit'>সেন্ড অর্ডার টু হোয়াটসঅ্যাপ</button>
</form>
</div>
</div>
<!-- Footer -->
<footer>
<div class='container' style='padding-bottom:0; margin:0;'>
<p>© 2026 <data:blog.title/>. সকল অধিকার সংরক্ষিত। Powered by BD Shop.</p>
</div>
</footer>
<script>
//<![CDATA[
var storeWhatsAppNumber = "8801927661298";
function openModalFromButton(btn) {
var title = '', price = '', url = window.location.href;
var card = btn.closest('.product-card');
if (card) {
var t = card.querySelector('.product-title');
var p = card.querySelector('.current-price');
if (t) { title = t.textContent; url = t.href; }
if (p) { price = p.textContent; }
} else {
var t2 = document.querySelector('.post-title-main');
var p2 = document.querySelector('.order-sidebar .current-price');
title = t2 ? t2.textContent : document.title;
price = p2 ? p2.textContent : '';
}
document.getElementById('modalProductName').value = title.trim() || 'Product';
document.getElementById('modalProductPrice').value = price.trim() || 'N/A';
document.getElementById('modalProductUrl').value = url;
document.getElementById('orderModal').style.display = 'flex';
}
function closeOrderModal() {
document.getElementById('orderModal').style.display = 'none';
}
function sendToWhatsApp(event) {
event.preventDefault();
var title = document.getElementById('modalProductName').value;
var price = document.getElementById('modalProductPrice').value;
var url = document.getElementById('modalProductUrl').value;
var name = document.getElementById('custName').value;
var phone = document.getElementById('custPhone').value;
var address = document.getElementById('custAddress').value;
var note = document.getElementById('custNote').value || 'সাধারণ অর্ডার';
var message = "🛒 *নতুন অর্ডার এসেছে!*\n\n";
message += "📦 *প্রোডাক্ট/আইটেম:* " + title + "\n";
message += "💰 *দাম:* " + price + "\n";
message += "📝 *পরিমাণ ও নোট:* " + note + "\n";
message += "🔗 *লিংক:* " + url + "\n\n";
message += "👤 *গ্রাহকের বিবরণ:*\n";
message += "• নাম: " + name + "\n";
message += "• ফোন: " + phone + "\n";
message += "• ঠিকানা: " + address;
var whatsappUrl = "https://wa.me/" + storeWhatsAppNumber + "?text=" + encodeURIComponent(message);
window.open(whatsappUrl, '_blank');
closeOrderModal();
}
document.addEventListener('click', function (e) {
var btn = e.target.closest ? e.target.closest('.js-order-btn') : null;
if (btn) {
e.preventDefault();
openModalFromButton(btn);
return;
}
if (e.target && e.target.id === 'orderModal') {
closeOrderModal();
}
});
//]]>
</script>
</body>
</html>
