<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html> <html b:version='2' class='v2' b:css='false' b:js='false' expr:dir='data:blog.languageDirection' expr:lang='data:blog.locale' 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.0' name='viewport'/> <meta content='#FF6B00' name='theme-color'/> <meta content='IE=edge' http-equiv='X-UA-Compatible'/> <b:if cond='data:blog.pageType == "index"'> <title><data:blog.pageTitle/></title> <meta expr:content='data:blog.metaDescription' name='description'/> <b:else/> <title><data:blog.pageName/> | <data:blog.title/></title> </b:if> <link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/> <link href='https://fonts.googleapis.com' rel='preconnect'/> <link crossorigin='' href='https://fonts.gstatic.com' rel='preconnect'/> <link href='https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap' rel='stylesheet'/> <link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css' rel='stylesheet'/> <b:include data='blog' name='all-head-content'/> <b:skin><![CDATA[ /* ============================================ DESHMAJ TOOLS - PROFESSIONAL BLOGGER THEME Color: Orange (#FF6B00) | Dark Theme Version: 3.0 Final ============================================ */ :root { --primary: #FF6B00; --primary-light: #FF8C33; --primary-dark: #E55A00; --primary-soft: rgba(255, 107, 0, 0.08); --primary-glow: rgba(255, 107, 0, 0.15); --secondary: #1A1A2E; --dark: #0F0F1A; --darker: #0A0A12; --card: #151525; --card-hover: #1A1A30; --surface: #1E1E35; --surface-light: #252540; --text: #E8E8E8; --text-secondary: #A0A0B8; --text-muted: #6B6B85; --white: #FFFFFF; --success: #00C853; --warning: #FFD600; --danger: #FF1744; --info: #00B0FF; --radius-sm: 10px; --radius-md: 16px; --radius-lg: 22px; --radius-xl: 30px; --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2); --shadow: 0 8px 32px rgba(0, 0, 0, 0.3); --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.4); --shadow-glow: 0 0 40px rgba(255, 107, 0, 0.12); --shadow-glow-strong: 0 0 60px rgba(255, 107, 0, 0.2); --transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); --max-width: 1320px; --sidebar-width: 340px; --header-height: 76px; } * { margin: 0; padding: 0; box-sizing: border-box; } html { scroll-behavior: smooth; } body { font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif; background: var(--darker); color: var(--text); line-height: 1.65; overflow-x: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } ::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-track { background: var(--dark); } ::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; } ::-webkit-scrollbar-thumb:hover { background: var(--primary-light); } ::selection { background: var(--primary); color: var(--white); } a { text-decoration: none; color: inherit; transition: var(--transition); } ul, ol { list-style: none; } img { max-width: 100%; height: auto; display: block; } /* HEADER & NAVIGATION */ .navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: rgba(10, 10, 18, 0.92); backdrop-filter: blur(24px) saturate(180%); -webkit-backdrop-filter: blur(24px) saturate(180%); border-bottom: 1px solid rgba(255, 107, 0, 0.08); transition: var(--transition); } .navbar.scrolled { box-shadow: 0 4px 30px rgba(0, 0, 0, 0.4); background: rgba(10, 10, 18, 0.98); } .nav-inner { max-width: var(--max-width); margin: 0 auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; height: var(--header-height); } .logo { display: flex; align-items: center; gap: 12px; font-size: 24px; font-weight: 800; color: var(--white); letter-spacing: -0.5px; } .logo-icon { width: 42px; height: 42px; background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--white); box-shadow: 0 4px 15px rgba(255, 107, 0, 0.3); transition: var(--transition); } .logo:hover .logo-icon { transform: rotate(-10deg) scale(1.1); } .logo span { color: var(--primary); } .nav-menu { display: flex; align-items: center; gap: 4px; } .nav-menu a { padding: 10px 18px; border-radius: var(--radius-sm); font-size: 14px; font-weight: 500; color: var(--text-secondary); position: relative; transition: var(--transition-fast); } .nav-menu a::after { content: ''; position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%); width: 0; height: 2px; background: var(--primary); border-radius: 2px; transition: var(--transition); } .nav-menu a:hover, .nav-menu a.active { color: var(--primary); background: var(--primary-soft); } .nav-menu a:hover::after, .nav-menu a.active::after { width: 20px; } .nav-right { display: flex; align-items: center; gap: 12px; } .search-toggle { width: 40px; height: 40px; border-radius: 50%; background: var(--surface); border: 1px solid var(--card-hover); display: flex; align-items: center; justify-content: center; color: var(--text-secondary); cursor: pointer; transition: var(--transition-fast); } .search-toggle:hover { background: var(--primary); color: var(--white); border-color: var(--primary); transform: scale(1.08); } .mobile-menu-btn { display: none; width: 40px; height: 40px; border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--card-hover); align-items: center; justify-content: center; color: var(--text); cursor: pointer; font-size: 16px; } /* SEARCH OVERLAY */ .search-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(10, 10, 18, 0.97); backdrop-filter: blur(20px); z-index: 2000; display: none; align-items: flex-start; justify-content: center; padding-top: 140px; opacity: 0; transition: opacity 0.3s ease; } .search-overlay.active { display: flex; opacity: 1; } .search-box { width: 90%; max-width: 640px; position: relative; } .search-box input { width: 100%; padding: 22px 64px 22px 28px; border: 2px solid var(--primary); border-radius: var(--radius-lg); background: var(--dark); color: var(--white); font-size: 18px; font-family: inherit; outline: none; transition: var(--transition); } .search-box input:focus { box-shadow: 0 0 30px rgba(255, 107, 0, 0.2); } .search-box input::placeholder { color: var(--text-muted); } .search-box .search-btn { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; background: var(--primary); border: none; border-radius: var(--radius-md); color: var(--white); cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; transition: var(--transition-fast); } .search-box .search-btn:hover { background: var(--primary-light); transform: translateY(-50%) scale(1.05); } .search-close { position: absolute; top: 32px; right: 32px; width: 48px; height: 48px; border-radius: 50%; background: var(--surface); border: 1px solid var(--card-hover); color: var(--text); display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 18px; transition: var(--transition-fast); } .search-close:hover { background: var(--danger); color: var(--white); border-color: var(--danger); } /* HERO SECTION */ .hero { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 140px 24px 100px; position: relative; overflow: hidden; background: var(--darker); } .hero::before { content: ''; position: absolute; top: -30%; left: 50%; transform: translateX(-50%); width: 900px; height: 900px; background: radial-gradient(circle, rgba(255, 107, 0, 0.1) 0%, transparent 65%); pointer-events: none; } .hero::after { content: ''; position: absolute; bottom: -20%; right: -10%; width: 500px; height: 500px; background: radial-gradient(circle, rgba(255, 107, 0, 0.06) 0%, transparent 60%); pointer-events: none; } .hero-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 20px; background: var(--primary-soft); border: 1px solid rgba(255, 107, 0, 0.15); border-radius: 50px; font-size: 13px; font-weight: 600; color: var(--primary); margin-bottom: 32px; text-transform: uppercase; letter-spacing: 1px; } .hero h1 { font-size: clamp(36px, 6.5vw, 64px); font-weight: 800; line-height: 1.1; color: var(--white); margin-bottom: 20px; max-width: 850px; letter-spacing: -1px; } .hero h1 span { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .hero p { font-size: 18px; color: var(--text-secondary); max-width: 520px; margin-bottom: 40px; line-height: 1.7; } .hero-buttons { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; } .btn { display: inline-flex; align-items: center; gap: 10px; padding: 16px 34px; border-radius: var(--radius-md); font-size: 15px; font-weight: 600; cursor: pointer; transition: var(--transition); border: none; font-family: inherit; } .btn-primary { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); color: var(--white); box-shadow: 0 8px 30px rgba(255, 107, 0, 0.3); } .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(255, 107, 0, 0.4); } .btn-secondary { background: var(--surface); color: var(--text); border: 1px solid var(--card-hover); } .btn-secondary:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-3px); background: var(--primary-soft); } .hero-stats { display: flex; gap: 48px; margin-top: 64px; padding: 28px 56px; background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); backdrop-filter: blur(10px); } .stat-item { text-align: center; } .stat-item .stat-num { font-size: 30px; font-weight: 800; color: var(--primary); line-height: 1; } .stat-item .stat-label { font-size: 12px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1.5px; margin-top: 6px; font-weight: 500; } /* SECTION STYLES */ .section { max-width: var(--max-width); margin: 0 auto; padding: 100px 28px; } .section-header { text-align: center; margin-bottom: 64px; } .section-tag { display: inline-block; padding: 6px 18px; background: var(--primary-soft); border: 1px solid rgba(255, 107, 0, 0.12); border-radius: 50px; font-size: 12px; font-weight: 700; color: var(--primary); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 16px; } .section-header h2 { font-size: clamp(28px, 4vw, 40px); font-weight: 800; color: var(--white); margin-bottom: 14px; letter-spacing: -0.5px; } .section-header p { color: var(--text-secondary); max-width: 480px; margin: 0 auto; font-size: 16px; } /* AD SPACES */ .ad-container { background: var(--card); border: 1px dashed rgba(255, 107, 0, 0.2); border-radius: var(--radius-md); padding: 16px; text-align: center; margin: 32px 0; position: relative; overflow: hidden; } .ad-container::before { content: 'ADVERTISEMENT'; position: absolute; top: 4px; right: 12px; font-size: 9px; font-weight: 700; color: var(--text-muted); letter-spacing: 1px; } .ad-label { font-size: 11px; color: var(--text-muted); margin-bottom: 8px; font-weight: 500; letter-spacing: 1px; } .ad-placeholder { min-height: 90px; background: linear-gradient(135deg, var(--surface) 0%, var(--dark) 100%); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 13px; font-weight: 500; } .ad-placeholder.skyscraper { min-height: 600px; } .ad-placeholder.rectangle { min-height: 250px; } .ad-placeholder.leaderboard { min-height: 90px; } .ad-placeholder.inline { min-height: 250px; } .sidebar-ad { position: sticky; top: calc(var(--header-height) + 20px); } .sidebar-ad .ad-placeholder.skyscraper { min-height: 600px; } /* TOOLS SECTION */ .tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 20px; } .tool-card { background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); padding: 28px; display: flex; align-items: flex-start; gap: 18px; cursor: pointer; transition: var(--transition); position: relative; overflow: hidden; } .tool-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: linear-gradient(to bottom, var(--primary), var(--primary-dark)); transform: scaleY(0); transform-origin: top; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .tool-card::after { content: ''; position: absolute; top: 0; right: 0; width: 150px; height: 150px; background: radial-gradient(circle, rgba(255, 107, 0, 0.06) 0%, transparent 70%); opacity: 0; transition: var(--transition); } .tool-card:hover { border-color: rgba(255, 107, 0, 0.3); transform: translateY(-5px); box-shadow: var(--shadow-glow); background: var(--card-hover); } .tool-card:hover::before { transform: scaleY(1); } .tool-card:hover::after { opacity: 1; } .tool-icon { width: 56px; height: 56px; min-width: 56px; border-radius: var(--radius-md); background: linear-gradient(135deg, rgba(255, 107, 0, 0.12) 0%, rgba(255, 107, 0, 0.04) 100%); border: 1px solid rgba(255, 107, 0, 0.08); display: flex; align-items: center; justify-content: center; font-size: 24px; color: var(--primary); transition: var(--transition); position: relative; z-index: 1; } .tool-card:hover .tool-icon { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); color: var(--white); transform: scale(1.08) rotate(-5deg); box-shadow: 0 8px 25px rgba(255, 107, 0, 0.3); } .tool-content { flex: 1; position: relative; z-index: 1; } .tool-content h3 { font-size: 17px; font-weight: 700; color: var(--white); margin-bottom: 6px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .tool-badge { padding: 3px 10px; background: var(--primary-soft); color: var(--primary); border-radius: 50px; font-size: 10px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; } .tool-content p { font-size: 13px; color: var(--text-secondary); line-height: 1.6; } .tool-arrow { width: 36px; height: 36px; min-width: 36px; border-radius: 50%; background: var(--surface); border: 1px solid var(--card-hover); display: flex; align-items: center; justify-content: center; color: var(--text-muted); transition: var(--transition-fast); position: relative; z-index: 1; } .tool-card:hover .tool-arrow { background: var(--primary); color: var(--white); border-color: var(--primary); transform: translateX(5px); } /* CATEGORY GRID */ .category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; } .cat-card { background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); overflow: hidden; transition: var(--transition); } .cat-card:hover { border-color: rgba(255, 107, 0, 0.3); transform: translateY(-8px); box-shadow: var(--shadow-glow); } .cat-card-img { height: 160px; background: linear-gradient(135deg, #121220 0%, #1a1a35 100%); display: flex; align-items: center; justify-content: center; font-size: 44px; color: var(--primary); position: relative; overflow: hidden; } .cat-card-img i { transition: var(--transition); filter: drop-shadow(0 4px 20px rgba(255, 107, 0, 0.3)); } .cat-card:hover .cat-card-img i { transform: scale(1.15); } .cat-card-img::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60%; background: linear-gradient(to top, var(--card), transparent); } .cat-card-body { padding: 22px; } .cat-card-body h3 { font-size: 17px; font-weight: 700; color: var(--white); margin-bottom: 6px; } .cat-card-body p { font-size: 13px; color: var(--text-secondary); line-height: 1.6; margin-bottom: 14px; } .cat-card-meta { display: flex; align-items: center; justify-content: space-between; } .cat-count { font-size: 11px; font-weight: 700; color: var(--primary); background: var(--primary-soft); padding: 4px 12px; border-radius: 50px; letter-spacing: 0.5px; } .cat-link { font-size: 13px; font-weight: 600; color: var(--primary); display: flex; align-items: center; gap: 6px; } .cat-link:hover { gap: 10px; } /* BLOG POSTS */ .posts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 28px; } .post-card { background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); overflow: hidden; transition: var(--transition); } .post-card:hover { border-color: rgba(255, 107, 0, 0.3); transform: translateY(-6px); box-shadow: var(--shadow-glow); } .post-thumb { height: 200px; overflow: hidden; position: relative; } .post-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); } .post-card:hover .post-thumb img { transform: scale(1.08); } .post-thumb .post-category { position: absolute; top: 14px; left: 14px; padding: 5px 14px; background: var(--primary); color: var(--white); font-size: 11px; font-weight: 700; border-radius: 50px; text-transform: uppercase; letter-spacing: 0.5px; box-shadow: 0 4px 15px rgba(255, 107, 0, 0.3); } .post-body { padding: 22px; } .post-date { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-muted); margin-bottom: 10px; } .post-title { font-size: 17px; font-weight: 700; color: var(--white); line-height: 1.4; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .post-title:hover { color: var(--primary); } .post-excerpt { font-size: 13px; color: var(--text-secondary); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .read-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: var(--primary); font-weight: 600; font-size: 13px; } .read-more:hover { gap: 12px; } /* FEATURES SECTION */ .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; } .feature-item { text-align: center; padding: 44px 28px; background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); transition: var(--transition); position: relative; overflow: hidden; } .feature-item::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, var(--primary), transparent); transform: scaleX(0); transition: var(--transition); } .feature-item:hover { border-color: rgba(255, 107, 0, 0.2); transform: translateY(-5px); box-shadow: var(--shadow-glow); } .feature-item:hover::before { transform: scaleX(1); } .feature-icon { width: 68px; height: 68px; margin: 0 auto 20px; border-radius: var(--radius-md); background: linear-gradient(135deg, rgba(255, 107, 0, 0.12) 0%, rgba(255, 107, 0, 0.04) 100%); border: 1px solid rgba(255, 107, 0, 0.08); display: flex; align-items: center; justify-content: center; font-size: 26px; color: var(--primary); transition: var(--transition); } .feature-item:hover .feature-icon { transform: scale(1.1); box-shadow: 0 8px 25px rgba(255, 107, 0, 0.2); } .feature-item h4 { font-size: 17px; font-weight: 700; color: var(--white); margin-bottom: 10px; } .feature-item p { font-size: 13px; color: var(--text-secondary); line-height: 1.6; } /* CTA SECTION */ .cta-section { max-width: var(--max-width); margin: 0 auto 100px; padding: 0 28px; } .cta-box { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); border-radius: var(--radius-xl); padding: 64px 48px; text-align: center; position: relative; overflow: hidden; } .cta-box::before { content: ''; position: absolute; top: -50%; left: -20%; width: 700px; height: 700px; background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 60%); pointer-events: none; } .cta-box::after { content: ''; position: absolute; bottom: -30%; right: -10%; width: 400px; height: 400px; background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, transparent 60%); pointer-events: none; } .cta-box h2 { font-size: clamp(24px, 4vw, 34px); font-weight: 800; color: var(--white); margin-bottom: 12px; position: relative; } .cta-box p { color: rgba(255, 255, 255, 0.85); margin-bottom: 28px; max-width: 480px; margin-left: auto; margin-right: auto; position: relative; font-size: 16px; } .cta-box .btn { background: var(--white); color: var(--primary); position: relative; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2); } .cta-box .btn:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3); } /* LAYOUT WITH SIDEBAR */ .main-layout { max-width: var(--max-width); margin: 0 auto; padding: 0 28px; display: grid; grid-template-columns: 1fr var(--sidebar-width); gap: 40px; align-items: start; } .main-content { min-width: 0; } .sidebar { display: flex; flex-direction: column; gap: 28px; } .sidebar-widget { background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); padding: 24px; } .sidebar-widget h4 { font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; } .sidebar-widget h4 i { color: var(--primary); } .sidebar-widget ul li { margin-bottom: 10px; } .sidebar-widget ul li a { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text-secondary); padding: 8px 12px; border-radius: var(--radius-sm); transition: var(--transition-fast); } .sidebar-widget ul li a i { color: var(--primary); font-size: 12px; } .sidebar-widget ul li a:hover { background: var(--primary-soft); color: var(--primary); } /* POST PAGE */ .post-page { padding: 120px 0 60px; } .post-page-header { margin-bottom: 40px; padding-bottom: 32px; border-bottom: 1px solid var(--card-hover); } .post-page-title { font-size: clamp(26px, 5vw, 40px); font-weight: 800; color: var(--white); line-height: 1.2; margin-bottom: 20px; letter-spacing: -0.5px; } .post-meta { display: flex; flex-wrap: wrap; gap: 20px; font-size: 13px; color: var(--text-muted); } .post-meta span { display: flex; align-items: center; gap: 6px; } .post-meta i { color: var(--primary); } .post-content { font-size: 16px; line-height: 1.8; color: var(--text); } .post-content h2 { font-size: 26px; font-weight: 700; color: var(--white); margin: 48px 0 18px; letter-spacing: -0.3px; } .post-content h3 { font-size: 20px; font-weight: 700; color: var(--white); margin: 36px 0 14px; } .post-content p { margin-bottom: 20px; } .post-content img { border-radius: var(--radius-md); margin: 28px 0; width: 100%; } .post-content a { color: var(--primary); font-weight: 500; } .post-content blockquote { border-left: 4px solid var(--primary); padding: 16px 24px; margin: 28px 0; background: var(--primary-soft); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--text-secondary); font-style: italic; } .post-content code { background: var(--surface); padding: 2px 8px; border-radius: 4px; font-size: 14px; color: var(--primary-light); } .post-content pre { background: var(--surface); padding: 20px; border-radius: var(--radius-md); overflow-x: auto; margin: 24px 0; border: 1px solid var(--card-hover); } .post-content table { width: 100%; border-collapse: collapse; margin: 24px 0; border-radius: var(--radius-sm); overflow: hidden; } .post-content th { background: var(--surface); padding: 14px 18px; text-align: left; font-weight: 600; color: var(--white); border-bottom: 2px solid var(--primary); } .post-content td { padding: 12px 18px; border-bottom: 1px solid var(--card-hover); color: var(--text-secondary); } .post-content tr:hover td { background: var(--primary-soft); } /* RELATED POSTS */ .related-posts { margin: 48px 0; padding: 32px; background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); } .related-posts h3 { font-size: 20px; font-weight: 700; color: var(--white); margin-bottom: 24px; display: flex; align-items: center; gap: 10px; } .related-posts h3 i { color: var(--primary); } .related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; } .related-item { background: var(--dark); border: 1px solid var(--card-hover); border-radius: var(--radius-md); overflow: hidden; transition: var(--transition); } .related-item:hover { border-color: rgba(255, 107, 0, 0.3); transform: translateY(-4px); box-shadow: var(--shadow-glow); } .related-item img { width: 100%; height: 120px; object-fit: cover; } .related-item h4 { padding: 14px; font-size: 13px; font-weight: 600; color: var(--white); line-height: 1.4; } .related-item:hover h4 { color: var(--primary); } /* PAGINATION */ .pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 56px; } .pagination a, .pagination span { padding: 12px 20px; border-radius: var(--radius-sm); font-size: 14px; font-weight: 600; transition: var(--transition-fast); } .pagination a { background: var(--card); border: 1px solid var(--card-hover); color: var(--text); } .pagination a:hover { background: var(--primary); color: var(--white); border-color: var(--primary); transform: translateY(-2px); } .pagination .current { background: var(--primary); color: var(--white); box-shadow: 0 4px 15px rgba(255, 107, 0, 0.3); } /* BREADCRUMB */ .breadcrumb { padding: 24px 0; font-size: 13px; color: var(--text-muted); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .breadcrumb a { color: var(--primary); font-weight: 500; } .breadcrumb a:hover { text-decoration: underline; } .breadcrumb i { font-size: 10px; color: var(--text-muted); } /* COMMENTS SECTION */ .comments-section { margin-top: 48px; padding: 32px; background: var(--card); border: 1px solid var(--card-hover); border-radius: var(--radius-lg); } .comments-section h3 { font-size: 20px; font-weight: 700; color: var(--white); margin-bottom: 24px; display: flex; align-items: center; gap: 10px; } .comments-section h3 i { color: var(--primary); } /* PROFESSIONAL FOOTER */ .footer { background: linear-gradient(180deg, var(--dark) 0%, #070710 100%); border-top: 1px solid rgba(255, 107, 0, 0.1); position: relative; overflow: hidden; } .footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--primary), transparent); opacity: 0.3; } .footer-inner { max-width: var(--max-width); margin: 0 auto; padding: 80px 28px 40px; } .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.2fr; gap: 56px; margin-bottom: 64px; } .footer-brand .logo { margin-bottom: 20px; font-size: 22px; } .footer-brand .logo-icon { width: 40px; height: 40px; font-size: 16px; } .footer-brand p { font-size: 14px; color: var(--text-secondary); line-height: 1.7; margin-bottom: 24px; max-width: 320px; } .social-links { display: flex; gap: 10px; } .social-links a { width: 40px; height: 40px; border-radius: 50%; background: var(--surface); border: 1px solid var(--card-hover); display: flex; align-items: center; justify-content: center; color: var(--text-secondary); font-size: 15px; transition: var(--transition-fast); } .social-links a:hover { background: var(--primary); color: var(--white); border-color: var(--primary); transform: translateY(-4px); box-shadow: 0 8px 20px rgba(255, 107, 0, 0.3); } .footer-col h4 { font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 24px; display: flex; align-items: center; gap: 8px; } .footer-col h4::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--card-hover), transparent); margin-left: 8px; } .footer-col ul li { margin-bottom: 12px; } .footer-col ul li a { font-size: 14px; color: var(--text-secondary); display: flex; align-items: center; gap: 8px; transition: var(--transition-fast); } .footer-col ul li a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--text-muted); transition: var(--transition-fast); } .footer-col ul li a:hover { color: var(--primary); padding-left: 4px; } .footer-col ul li a:hover::before { background: var(--primary); box-shadow: 0 0 8px rgba(255, 107, 0, 0.5); } .newsletter-box p { font-size: 13px; color: var(--text-secondary); margin-bottom: 16px; line-height: 1.6; } .newsletter-form { display: flex; gap: 8px; } .newsletter-form input { flex: 1; padding: 12px 16px; background: var(--surface); border: 1px solid var(--card-hover); border-radius: var(--radius-sm); color: var(--white); font-family: inherit; font-size: 13px; outline: none; transition: var(--transition-fast); } .newsletter-form input:focus { border-color: var(--primary); box-shadow: 0 0 15px rgba(255, 107, 0, 0.1); } .newsletter-form input::placeholder { color: var(--text-muted); } .newsletter-form button { padding: 12px 18px; background: var(--primary); border: none; border-radius: var(--radius-sm); color: var(--white); cursor: pointer; font-size: 14px; transition: var(--transition-fast); } .newsletter-form button:hover { background: var(--primary-light); transform: scale(1.05); } .footer-ad-space { margin: 40px 0; padding: 24px; background: var(--card); border: 1px dashed rgba(255, 107, 0, 0.15); border-radius: var(--radius-lg); text-align: center; } .footer-bottom { border-top: 1px solid var(--card-hover); padding-top: 28px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; } .footer-bottom p { font-size: 13px; color: var(--text-muted); } .footer-bottom a { color: var(--primary); font-weight: 500; } .footer-bottom-links { display: flex; gap: 24px; } .footer-bottom-links a { font-size: 13px; color: var(--text-muted); } .footer-bottom-links a:hover { color: var(--primary); } /* MOBILE MENU */ .mobile-nav { position: fixed; top: 0; right: -100%; width: 80%; max-width: 340px; height: 100vh; background: var(--dark); z-index: 1500; padding: 80px 28px 28px; transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1); border-left: 1px solid var(--card-hover); overflow-y: auto; } .mobile-nav.active { right: 0; } .mobile-nav a { display: block; padding: 16px 0; border-bottom: 1px solid var(--card-hover); font-size: 15px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 12px; } .mobile-nav a i { color: var(--primary); width: 20px; } .mobile-nav a:hover { color: var(--primary); padding-left: 8px; } .mobile-nav-close { position: absolute; top: 20px; right: 20px; width: 40px; height: 40px; border-radius: 50%; background: var(--surface); border: 1px solid var(--card-hover); display: flex; align-items: center; justify-content: center; color: var(--text); cursor: pointer; transition: var(--transition-fast); } .mobile-nav-close:hover { background: var(--danger); color: var(--white); border-color: var(--danger); } .overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); z-index: 1400; display: none; backdrop-filter: blur(4px); } .overlay.active { display: block; } /* RESPONSIVE */ @media (max-width: 1100px) { .main-layout { grid-template-columns: 1fr; } .sidebar { display: none; } } @media (max-width: 992px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; } .nav-menu { display: none; } .mobile-menu-btn { display: flex; } .hero-stats { gap: 28px; padding: 24px 40px; } .tools-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); } } @media (max-width: 768px) { .footer-grid { grid-template-columns: 1fr; gap: 36px; } .footer-bottom { flex-direction: column; text-align: center; } .hero-stats { flex-direction: column; gap: 16px; padding: 24px 32px; } .tools-grid { grid-template-columns: 1fr; } .posts-grid { grid-template-columns: 1fr; } .category-grid { grid-template-columns: 1fr; } .features-grid { grid-template-columns: 1fr; } .related-grid { grid-template-columns: 1fr; } .nav-inner { padding: 0 16px; height: 68px; } .logo { font-size: 20px; } .logo-icon { width: 36px; height: 36px; font-size: 15px; } .hero { padding: 120px 16px 60px; } .section { padding: 60px 16px; } .post-page { padding: 100px 0 40px; } } /* ANIMATIONS */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate { animation: fadeInUp 0.6s ease forwards; opacity: 0; } .delay-1 { animation-delay: 0.1s; } .delay-2 { animation-delay: 0.2s; } .delay-3 { animation-delay: 0.3s; } .delay-4 { animation-delay: 0.4s; } .float { animation: float 3s ease-in-out infinite; } ]]></b:skin> <b:template-skin><![CDATA[ @media (max-width: 480px) { .hero h1 { font-size: 28px; } .hero-stats { padding: 20px 24px; } .cta-box { padding: 40px 24px; } .post-page { padding: 90px 0 30px; } } ]]></b:template-skin> </head> <body> <!-- ===== HEADER SECTION (Required by Blogger) ===== --> <b:section class='header' id='header' maxwidgets='1' name='Header' showaddelement='no'> <b:widget id='Header1' locked='true' title='Deshmaj Tools (Header)' type='Header' version='2'> <b:widget-settings> <b:widget-setting name='displayUrl'/> <b:widget-setting name='displayHeight'>0</b:widget-setting> <b:widget-setting name='sectionWidth'>-1</b:widget-setting> <b:widget-setting name='shrinkToFit'>false</b:widget-setting> <b:widget-setting name='displayWidth'>0</b:widget-setting> <b:widget-setting name='linkUrl'/> </b:widget-settings> <b:includable id='main' var='this'> <nav class='navbar' id='navbar'> <div class='nav-inner'> <a class='logo' expr:href='data:blog.homepageUrl'> <div class='logo-icon'><i class='fas fa-tools'/></div> Deshmaj<span>Tools</span> </a> <div class='nav-menu'> <a class='active' expr:href='data:blog.homepageUrl'>Home</a> <a href='/search/label/Blog'><i class='fas fa-blog' style='margin-right:5px;opacity:0.7;'></i>Blog</a> <a href='/search/label/Tools'><i class='fas fa-toolbox' style='margin-right:5px;opacity:0.7;'></i>Tools</a> <a href='/p/contact-us.html'><i class='fas fa-envelope' style='margin-right:5px;opacity:0.7;'></i>Contact</a> </div> <div class='nav-right'> <button class='search-toggle' onclick='toggleSearch()'><i class='fas fa-search'/></button> <button class='mobile-menu-btn' onclick='toggleMobile()'><i class='fas fa-bars'/></button> </div> </div> </nav> <div class='search-overlay' id='searchOverlay'> <button class='search-close' onclick='toggleSearch()'><i class='fas fa-times'/></button> <form class='search-box' expr:action='data:blog.searchUrl'> <input name='q' placeholder='Search tools...' type='text'/> <button class='search-btn' type='submit'><i class='fas fa-arrow-right'/></button> </form> </div> <div class='overlay' id='overlay' onclick='toggleMobile()'></div> <div class='mobile-nav' id='mobileNav'> <button class='mobile-nav-close' onclick='toggleMobile()'><i class='fas fa-times'/></button> <a expr:href='data:blog.homepageUrl'><i class='fas fa-home'></i> Home</a> <a href='/search/label/Blog'><i class='fas fa-blog'></i> Blog</a> <a href='/search/label/Tools'><i class='fas fa-toolbox'></i> Tools</a> <a href='/p/contact-us.html'><i class='fas fa-envelope'></i> Contact</a> <a href='/search/label/Artificial%20Intelligence'><i class='fas fa-robot'></i> AI Tools</a> <a href='/search/label/Calculator%20Tools'><i class='fas fa-calculator'></i> Calculator</a> <a href='/search/label/Converter%20Tools'><i class='fas fa-sync-alt'></i> Converters</a> <a href='/search/label/Finance%20Tools'><i class='fas fa-coins'></i> Finance</a> <a href='/search/label/Generator%20Tools'><i class='fas fa-magic'></i> Generators</a> <a href='/search/label/Image%20Tools'><i class='fas fa-image'></i> Image</a> <a href='/search/label/SEO%20Tools'><i class='fas fa-search'></i> SEO</a> <a href='/search/label/Writing%20Tools'><i class='fas fa-pen'></i> Writing</a> </div> </b:includable> </b:widget> </b:section> <!-- ===== HOMEPAGE ONLY CONTENT ===== --> <b:if cond='data:blog.pageType == "index"'> <section class='hero'> <div class='hero-badge animate'> <i class='fas fa-fire' style='color:var(--primary)'/> 100+ Free Online Tools </div> <h1 class='animate delay-1'> Powerful Tools for <span>Every Need</span> </h1> <p class='animate delay-2'> Deshmaj Tools provides free, fast and reliable online utilities. From AI tools to calculators, converters to SEO — all at your fingertips. </p> <div class='hero-buttons animate delay-3'> <a class='btn btn-primary' href='#tools'> <i class='fas fa-rocket'/> Explore Tools </a> <a class='btn btn-secondary' href='#latest'> <i class='fas fa-newspaper'/> Latest Posts </a> </div> <div class='hero-stats animate delay-4'> <div class='stat-item'><div class='stat-num'>100+</div><div class='stat-label'>Tools</div></div> <div class='stat-item'><div class='stat-num'>50K+</div><div class='stat-label'>Users</div></div> <div class='stat-item'><div class='stat-num'>20+</div><div class='stat-label'>Categories</div></div> <div class='stat-item'><div class='stat-num'>10x</div><div class='stat-label'>Speed</div></div> </div> </section> <section class='section'> <div class='section-header'> <div class='section-tag'>Why Choose Us</div> <h2>Built for <span style='color:var(--primary)'>Speed & Simplicity</span></h2> <p>Experience the best online tools with zero hassle</p> </div> <div class='features-grid'> <div class='feature-item'> <div class='feature-icon'><i class='fas fa-bolt'/></div> <h4>Lightning Fast</h4> <p>All tools work instantly in your browser with no waiting time</p> </div> <div class='feature-item'> <div class='feature-icon'><i class='fas fa-lock'/></div> <h4>100% Secure</h4> <p>Your data never leaves your device — complete privacy guaranteed</p> </div> <div class='feature-item'> <div class='feature-icon'><i class='fas fa-mobile-alt'/></div> <h4>Mobile Friendly</h4> <p>Works perfectly on all devices — phone, tablet, and desktop</p> </div> <div class='feature-item'> <div class='feature-icon'><i class='fas fa-infinity'/></div> <h4>Unlimited Use</h4> <p>No limits, no sign-ups, no restrictions — use as much as you want</p> </div> </div> </section> <section class='section' id='tools'> <div class='section-header'> <div class='section-tag'>Popular Tools</div> <h2>Most <span style='color:var(--primary)'>Used Tools</span></h2> <p>Click any tool below to use it instantly</p> </div> <div class='tools-grid'> <a class='tool-card' href='/search/label/Artificial%20Intelligence'> <div class='tool-icon'><i class='fas fa-robot'/></div> <div class='tool-content'><h3>AI Tools <span class='tool-badge'>Trending</span></h3><p>AI-powered text generators, image creators, and smart utilities.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/SEO%20Tools'> <div class='tool-icon'><i class='fas fa-chart-line'/></div> <div class='tool-content'><h3>SEO Tools <span class='tool-badge'>Popular</span></h3><p>Meta tag generator, sitemap creator, keyword analyzer, and more.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Image%20Tools'> <div class='tool-icon'><i class='fas fa-image'/></div> <div class='tool-content'><h3>Image Tools <span class='tool-badge'>Popular</span></h3><p>Compress, resize, convert, and edit images online instantly.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Calculator%20Tools'> <div class='tool-icon'><i class='fas fa-calculator'/></div> <div class='tool-content'><h3>Calculator Tools <span class='tool-badge'>Popular</span></h3><p>Scientific, EMI, percentage, GST, and compound interest calculators.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Converter%20Tools'> <div class='tool-icon'><i class='fas fa-sync-alt'/></div> <div class='tool-content'><h3>Converter Tools <span class='tool-badge'>New</span></h3><p>Unit converter, currency, JSON to CSV, and more format conversions.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Finance%20Tools'> <div class='tool-icon'><i class='fas fa-coins'/></div> <div class='tool-content'><h3>Finance Tools <span class='tool-badge'>Popular</span></h3><p>EMI, percentage, GST, and compound interest calculators.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Writing%20Tools'> <div class='tool-icon'><i class='fas fa-pen'/></div> <div class='tool-content'><h3>Writing Tools <span class='tool-badge'>New</span></h3><p>Word counter, case converter, plagiarism checker, and more.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> <a class='tool-card' href='/search/label/Generator%20Tools'> <div class='tool-icon'><i class='fas fa-magic'/></div> <div class='tool-content'><h3>Generator Tools <span class='tool-badge'>Popular</span></h3><p>Password generator, QR code, barcode, and random generators.</p></div> <div class='tool-arrow'><i class='fas fa-arrow-right'/></div> </a> </div> </section> <section class='section' style='background:var(--dark); border-radius:40px; margin:0 20px 100px; max-width:calc(1320px + 56px); width:auto;'> <div class='section-header'> <div class='section-tag'>Categories</div> <h2>Browse by <span style='color:var(--primary)'>Category</span></h2> <p>Find the right tool for your specific needs</p> </div> <div class='category-grid'> <a class='cat-card' href='/search/label/Artificial%20Intelligence'><div class='cat-card-img'><i class='fas fa-robot'/></div><div class='cat-card-body'><h3>Artificial Intelligence</h3><p>AI-powered tools for text, images, and smart automation</p><div class='cat-card-meta'><span class='cat-count'>AI Tools</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Blog'><div class='cat-card-img'><i class='fas fa-blog'/></div><div class='cat-card-body'><h3>Blog</h3><p>Blogging tips, guides, and useful articles</p><div class='cat-card-meta'><span class='cat-count'>Articles</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Calculator%20Tools'><div class='cat-card-img'><i class='fas fa-calculator'/></div><div class='cat-card-body'><h3>Calculator Tools</h3><p>Scientific, EMI, percentage, and GST calculators</p><div class='cat-card-meta'><span class='cat-count'>Calculators</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Converter%20Tools'><div class='cat-card-img'><i class='fas fa-sync-alt'/></div><div class='cat-card-body'><h3>Converter Tools</h3><p>Unit, currency, JSON to CSV, and format conversions</p><div class='cat-card-meta'><span class='cat-count'>Converters</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Finance'><div class='cat-card-img'><i class='fas fa-coins'/></div><div class='cat-card-body'><h3>Finance</h3><p>Financial calculators and money management tools</p><div class='cat-card-meta'><span class='cat-count'>Finance</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Finance%20Tools'><div class='cat-card-img'><i class='fas fa-chart-pie'/></div><div class='cat-card-body'><h3>Finance Tools</h3><p>Advanced financial planning and investment tools</p><div class='cat-card-meta'><span class='cat-count'>Tools</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Generator%20Tools'><div class='cat-card-img'><i class='fas fa-magic'/></div><div class='cat-card-body'><h3>Generator Tools</h3><p>Password, QR code, barcode, and random generators</p><div class='cat-card-meta'><span class='cat-count'>Generators</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Image%20Tools'><div class='cat-card-img'><i class='fas fa-images'/></div><div class='cat-card-body'><h3>Image Tools</h3><p>Compress, resize, convert, and edit images online</p><div class='cat-card-meta'><span class='cat-count'>Image</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Insurance%20Tools'><div class='cat-card-img'><i class='fas fa-shield-alt'/></div><div class='cat-card-body'><h3>Insurance Tools</h3><p>Insurance calculators and premium estimators</p><div class='cat-card-meta'><span class='cat-count'>Insurance</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Interest%20Tools'><div class='cat-card-img'><i class='fas fa-percentage'/></div><div class='cat-card-body'><h3>Interest Tools</h3><p>Simple and compound interest calculators</p><div class='cat-card-meta'><span class='cat-count'>Interest</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Scanner%20Tools'><div class='cat-card-img'><i class='fas fa-qrcode'/></div><div class='cat-card-body'><h3>Scanner Tools</h3><p>QR code scanner, barcode reader, and more</p><div class='cat-card-meta'><span class='cat-count'>Scanner</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/SEO%20Tools'><div class='cat-card-img'><i class='fas fa-chart-line'/></div><div class='cat-card-body'><h3>SEO Tools</h3><p>Meta tags, sitemap, keyword tools for better ranking</p><div class='cat-card-meta'><span class='cat-count'>SEO</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Tools'><div class='cat-card-img'><i class='fas fa-toolbox'/></div><div class='cat-card-body'><h3>Tools</h3><p>General purpose online tools and utilities</p><div class='cat-card-meta'><span class='cat-count'>Tools</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> <a class='cat-card' href='/search/label/Writing%20Tools'><div class='cat-card-img'><i class='fas fa-pen'/></div><div class='cat-card-body'><h3>Writing Tools</h3><p>Word counter, case converter, and text utilities</p><div class='cat-card-meta'><span class='cat-count'>Writing</span><span class='cat-link'>Explore <i class='fas fa-arrow-right'/></span></div></div></a> </div> </section> <div class='cta-section'> <div class='cta-box'> <h2>Need a Custom Tool?</h2> <p>We are constantly adding new tools based on user requests. Let us know what you need!</p> <a class='btn' href='mailto:deshmajtools@gmail.com'> <i class='fas fa-envelope'/> Request a Tool </a> </div> </div> </b:if> <!-- ===== MAIN LAYOUT ===== --> <b:if cond='data:blog.pageType == "index" or data:blog.searchLabel or data:blog.pageType == "item" or data:blog.pageType == "static_page"'> <div class='main-layout'> <div class='main-content'> <!-- Breadcrumb --> <b:if cond='data:blog.searchLabel or data:blog.pageType == "item" or data:blog.pageType == "static_page"'> <div class='breadcrumb'> <a expr:href='data:blog.homepageUrl'>Home</a> <i class='fas fa-chevron-right'></i> <b:if cond='data:blog.searchLabel'><span><data:blog.searchLabel/></span></b:if> <b:if cond='data:blog.pageType == "item"'><span>Tool</span></b:if> <b:if cond='data:blog.pageType == "static_page"'><span><data:blog.pageName/></span></b:if> </div> </b:if> <!-- BLOG POSTS (Index & Label pages) --> <b:if cond='data:blog.searchLabel or data:blog.pageType == "index"'> <section id='latest' style='padding:20px 0 60px;'> <div class='section-header' style='margin-bottom:40px;'> <div class='section-tag'> <b:if cond='data:blog.searchLabel'><data:blog.searchLabel/><b:else/>Latest Posts</b:if> </div> <h2> <b:if cond='data:blog.searchLabel'><data:blog.searchLabel/> <span style='color:var(--primary)'>Tools</span><b:else/>Latest <span style='color:var(--primary)'>Blog Posts</span></b:if> </h2> </div> <div class='posts-grid'> <b:loop values='data:posts' var='post'> <article class='post-card'> <a expr:href='data:post.url'> <div class='post-thumb'> <b:with value='data:post.featuredImage ? resizeImage(data:post.featuredImage, 600, "16:9") : "https://placehold.co/600x340/1E1E32/FF6B00?text=Deshmaj+Tools"' var='img'> <img expr:alt='data:post.title' expr:src='data:img'/> </b:with> <b:if cond='data:post.labels any (l => l.name != "")'> <b:loop values='data:post.labels' var='label'> <span class='post-category'><data:label.name/></span> <b:break/> </b:loop> </b:if> </div> </a> <div class='post-body'> <div class='post-date'><i class='far fa-calendar'/><data:post.date/></div> <a expr:href='data:post.url'><h3 class='post-title'><data:post.title/></h3></a> <p class='post-excerpt'><b:eval expr='data:post.snippet snippet { length: 120, links: false, linebreaks: false }'/></p> <a class='read-more' expr:href='data:post.url'>Use Tool <i class='fas fa-arrow-right'/></a> </div> </article> </b:loop> </div> <b:if cond='data:blog.pageType != "static_page"'> <div class='pagination'> <b:if cond='data:newerPageUrl'><a class='newer-link' expr:href='data:newerPageUrl'><i class='fas fa-chevron-left'/> Newer</a></b:if> <span class='current'>Page</span> <b:if cond='data:olderPageUrl'><a class='older-link' expr:href='data:olderPageUrl'>Older <i class='fas fa-chevron-right'/></a></b:if> </div> </b:if> </section> </b:if> <!-- SINGLE POST PAGE WITH ADS --> <b:if cond='data:blog.pageType == "item"'> <div class='post-page'> <b:loop values='data:posts' var='post'> <div class='post-page-header'> <h1 class='post-page-title'><data:post.title/></h1> <div class='post-meta'> <span><i class='far fa-calendar'/><data:post.date/></span> <span><i class='far fa-user'/><data:post.author.name/></span> <b:if cond='data:post.labels'><span><i class='fas fa-folder'/><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='!isLast'>, </b:if></b:loop></span></b:if> </div> </div> <!-- AD 1 - Top --> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement - Top</div><div class='ad-placeholder inline'>Replace with your Ad Code (728x90 or Responsive)</div></div> <div class='post-content'><data:post.body/></div> <!-- AD 2 - Middle --> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement - Middle</div><div class='ad-placeholder inline'>Replace with your Ad Code (300x250 or Responsive)</div></div> <!-- AD 3 - Bottom --> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement - Bottom</div><div class='ad-placeholder inline'>Replace with your Ad Code (728x90 or Responsive)</div></div> <!-- RELATED POSTS --> <div class='related-posts'> <h3><i class='fas fa-thumbs-up'></i> Related Posts</h3> <div class='related-grid'> <b:loop values='data:posts' var='related'> <b:if cond='data:related.id != data:post.id'> <a class='related-item' expr:href='data:related.url'> <b:with value='data:related.featuredImage ? resizeImage(data:related.featuredImage, 300, "16:9") : "https://placehold.co/300x170/1E1E32/FF6B00?text=Tool"' var='relImg'> <img expr:alt='data:related.title' expr:src='data:relImg'/> </b:with> <h4><data:related.title/></h4> </a> </b:if> </b:loop> </div> </div> <!-- COMMENTS --> <div class='comments-section'> <h3><i class='fas fa-comments'></i> Comments</h3> <b:include data='post' name='comments'/> </div> </b:loop> </div> </b:if> <!-- STATIC PAGE (No sidebar) --> <b:if cond='data:blog.pageType == "static_page"'> <div class='post-page'> <div class='post-page-header'><h1 class='post-page-title'><data:blog.pageName/></h1></div> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement</div><div class='ad-placeholder inline'>Replace with your Ad Code</div></div> <div class='post-content'><b:loop values='data:posts' var='post'><data:post.body/></b:loop></div> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement</div><div class='ad-placeholder inline'>Replace with your Ad Code</div></div> </div> </b:if> </div> <!-- SIDEBAR (Only on posts, NOT on static pages) --> <b:if cond='data:blog.pageType != "static_page"'> <aside class='sidebar'> <!-- SIDEBAR AD --> <div class='sidebar-widget sidebar-ad'> <h4><i class='fas fa-ad'></i> Sponsored</h4> <div class='ad-container' style='margin:0;'><div class='ad-label'>Advertisement</div><div class='ad-placeholder skyscraper'>Place Ad Code Here<br/>(300x600 Skyscraper)</div></div> </div> <!-- POPULAR POSTS --> <b:section class='sidebar-popular' id='sidebar-popular' maxwidgets='1' name='Popular Posts' showaddelement='no'> <b:widget id='PopularPosts1' locked='true' title='Popular Posts' type='PopularPosts'> <b:includable id='main'> <div class='sidebar-widget'> <h4><i class='fas fa-fire'></i> Popular Posts</h4> <ul><b:loop values='data:posts' var='post'><li><a expr:href='data:post.href'><i class='fas fa-chevron-right'></i><data:post.title/></a></li></b:loop></ul> </div> </b:includable> </b:widget> </b:section> <!-- SEARCH --> <b:section class='sidebar-search' id='sidebar-search' maxwidgets='1' name='Search' showaddelement='no'> <b:widget id='BlogSearch1' locked='true' title='Search' type='BlogSearch'> <b:includable id='main'> <div class='sidebar-widget'> <h4><i class='fas fa-search'></i> Search</h4> <form expr:action='data:blog.searchUrl' style='display:flex;gap:8px;'> <input name='q' placeholder='Search...' style='flex:1;padding:10px 14px;background:var(--surface);border:1px solid var(--card-hover);border-radius:var(--radius-sm);color:var(--white);font-family:inherit;font-size:13px;outline:none;' type='text'/> <button style='padding:10px 14px;background:var(--primary);border:none;border-radius:var(--radius-sm);color:var(--white);cursor:pointer;' type='submit'><i class='fas fa-search'></i></button> </form> </div> </b:includable> </b:widget> </b:section> <!-- CATEGORIES --> <b:section class='sidebar-labels' id='sidebar-labels' maxwidgets='1' name='Categories' showaddelement='no'> <b:widget id='Label1' locked='true' title='Categories' type='Label'> <b:includable id='main'> <div class='sidebar-widget'> <h4><i class='fas fa-th-large'></i> Categories</h4> <ul><b:loop values='data:labels' var='label'><li><a expr:href='data:label.url'><i class='fas fa-chevron-right'></i><data:label.name/></a></li></b:loop></ul> </div> </b:includable> </b:widget> </b:section> <!-- ARCHIVES --> <b:section class='sidebar-archive' id='sidebar-archive' maxwidgets='1' name='Archives' showaddelement='no'> <b:widget id='BlogArchive1' locked='true' title='Archives' type='BlogArchive'> <b:includable id='main'> <div class='sidebar-widget'> <h4><i class='fas fa-archive'></i> Archives</h4> <ul><b:loop values='data:posts' var='post'><li><a expr:href='data:post.url'><i class='fas fa-chevron-right'></i><data:post.title/></a></li></b:loop></ul> </div> </b:includable> </b:widget> </b:section> </aside> </b:if> </div> </b:if> <!-- AD BEFORE FOOTER --> <b:if cond='data:blog.pageType == "item" or data:blog.pageType == "static_page"'> <div style='max-width:1320px;margin:0 auto;padding:0 28px;'> <div class='ad-container'><div class='ad-label'><i class='fas fa-ad'></i> Advertisement - Footer Ad</div><div class='ad-placeholder leaderboard'>Replace with your Ad Code (728x90 or 970x90 Leaderboard)</div></div> </div> </b:if> <!-- ===== FOOTER ===== --> <b:section class='footer-section' id='footer-section' maxwidgets='1' name='Footer' showaddelement='no'> <b:widget id='HTML1' locked='true' title='Footer' type='HTML'> <b:includable id='main'> <footer class='footer'> <div class='footer-inner'> <div class='footer-grid'> <div class='footer-brand'> <a class='logo' expr:href='data:blog.homepageUrl'> <div class='logo-icon'><i class='fas fa-tools'/></div> Deshmaj<span>Tools</span> </a> <p>Your one-stop destination for free, fast, and reliable online tools. No sign-up required, no data stored — just tools that work.</p> <div class='social-links'> <a href='https://facebook.com/deshmajtools' aria-label='Facebook' target='_blank'><i class='fab fa-facebook-f'/></a> <a href='https://twitter.com/deshmajtools' aria-label='Twitter' target='_blank'><i class='fab fa-twitter'/></a> <a href='https://instagram.com/deshmajtools' aria-label='Instagram' target='_blank'><i class='fab fa-instagram'/></a> <a href='https://youtube.com/deshmajtools' aria-label='YouTube' target='_blank'><i class='fab fa-youtube'/></a> <a href='https://pinterest.com/deshmajtools' aria-label='Pinterest' target='_blank'><i class='fab fa-pinterest-p'/></a> <a href='https://linkedin.com/company/deshmajtools' aria-label='LinkedIn' target='_blank'><i class='fab fa-linkedin-in'/></a> </div> </div> <div class='footer-col'> <h4>Quick Links</h4> <ul> <li><a expr:href='data:blog.homepageUrl'>Home</a></li> <li><a href='/p/about-us.html'>About Us</a></li> <li><a href='/p/contact-us.html'>Contact</a></li> <li><a href='/p/faqs.html'>FAQs</a></li> </ul> </div> <div class='footer-col'> <h4>Legal</h4> <ul> <li><a href='/p/privacy-policy.html'>Privacy Policy</a></li> <li><a href='/p/terms-and-conditions.html'>Terms & Conditions</a></li> <li><a href='/p/disclaimer.html'>Disclaimer</a></li> </ul> </div> <div class='footer-col'> <h4>Newsletter</h4> <div class='newsletter-box'> <p>Subscribe to get notified about new tools and updates.</p> <form class='newsletter-form' onsubmit='return false;'> <input placeholder='Enter your email' type='email'/> <button type='submit'><i class='fas fa-paper-plane'></i></button> </form> <p style='margin-top:12px;font-size:12px;'><i class='fas fa-envelope' style='color:var(--primary);margin-right:6px;'></i>deshmajtools@gmail.com</p> </div> </div> </div> <div class='footer-ad-space'> <div class='ad-label'><i class='fas fa-ad'></i> Advertisement Space</div> <div class='ad-placeholder leaderboard'>Replace with your Ad Code (970x90 or 728x90 Leaderboard)</div> </div> <div class='footer-bottom'> <p>© <data:blog.title/> - All Rights Reserved. | Designed with <i class='fas fa-heart' style='color:var(--primary)'/> by Deshmaj Tools</p> <div class='footer-bottom-links'> <a href='/p/privacy-policy.html'>Privacy</a> <a href='/p/terms-and-conditions.html'>Terms</a> <a href='/p/contact-us.html'>Contact</a> <a href='/p/about-us.html'>About</a> </div> </div> </div> </footer> </b:includable> </b:widget> </b:section> <script>//<![CDATA[ function toggleMobile() { var nav = document.getElementById('mobileNav'); var overlay = document.getElementById('overlay'); nav.classList.toggle('active'); overlay.classList.toggle('active'); document.body.style.overflow = nav.classList.contains('active') ? 'hidden' : ''; } function toggleSearch() { var search = document.getElementById('searchOverlay'); search.classList.toggle('active'); if (search.classList.contains('active')) { setTimeout(function() { document.querySelector('.search-box input').focus(); }, 300); } } document.addEventListener('keydown', function(e) { if (e.key === 'Escape') { document.getElementById('searchOverlay').classList.remove('active'); document.getElementById('mobileNav').classList.remove('active'); document.getElementById('overlay').classList.remove('active'); document.body.style.overflow = ''; } }); window.addEventListener('scroll', function() { var navbar = document.getElementById('navbar'); if (window.scrollY > 50) { navbar.classList.add('scrolled'); } else { navbar.classList.remove('scrolled'); } }); if ('IntersectionObserver' in window) { var observer = new IntersectionObserver(function(entries) { entries.forEach(function(entry) { if (entry.isIntersecting) { entry.target.style.opacity = '1'; entry.target.style.transform = 'translateY(0)'; } }); }, { threshold: 0.1 }); document.querySelectorAll('.tool-card, .cat-card, .post-card, .feature-item').forEach(function(el) { el.style.opacity = '0'; el.style.transform = 'translateY(20px)'; el.style.transition = 'all 0.5s cubic-bezier(0.4, 0, 0.2, 1)'; observer.observe(el); }); } //]]></script> <script async='' src='https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID'></script> <script>//<![CDATA[ window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'GA_MEASUREMENT_ID'); //]]></script> </body> </html> --------------------------------------------------------------------
menue me kuch aa hi nahi rha or me ne "add a gedget " per clich kiy to gedget failed aya or layout me koi bhi gedget theek nahi hai posts bhi show nahi ho rhi or Browse by Category
, Most Used Tools
k gedgets one chahiye or blog posts k bhi gedgets hone chaiye or matlab her cheeze k gedgets hone chaiey side bar me bhi gedegts hone chahiye homepage per koi side bar nah ho only posts me hi side bar show ho jo page create kiye jaine unn me bhi sidebar nahi ho or footer bhi bahi show ho rha hai footer boht hi acha or professional ho
her cheeze ka ek aleda gedgets and widgets hone chahiye professional and properly
-----------------------------------------------------------
step by step "gedgets" for blogger dashboard layout widgets
1.Main Header set main logo
2.Main Menu edit menu and submenu links here
3.Header Featured set homepage tital,caption,images etc.
4.most popular tools important best 20 tools
5.Header posts set tital for categories
6.Featured Categories set different categories for here
7.add unit 729 by 90 her post or home-page me with out pages
8.All posts & sidebar Right recent posts, Comments, no. of posts and sidebar gedgets for lable, seach, archives, ads etc.
9.related posts in posts arter the full article
10.ad unit gedgets
11.professional gadgets and widgets pro level
-----------------------------------------------------