شرح قالب بريد إلكتروني احترافي (HTML) لجعل الرسائل البريدة محترفة وجميلة

[codeNET ✓]

قالب بريد إلكتروني احترافي (HTML) لإطلاق مبادرة دعم المواقع الحيوية

أهلاً بكم يا مجتمع المطورين وأصحاب المواقع في كود نت، المنصة الأولى لتطوير منتديات زين فورو.

في إطار سعينا لتنشيط المبادرات داخل المنتديات، واستهداف أصحاب المواقع الحيوية والنشطة عبر حملات البريد الإلكتروني، نطرح لكم اليوم قالب بريد إلكتروني احترافي كامل ومبني بلغة HTML. القالب مصمم بأسلوب عصري وخفيف (Modern Clean) ليتوافق تماماً مع الهوية البصرية المتطورة، وجاهز للإرسال البريدي المباشر لأعضائك.

مميزات القالب:

• تصميم متجاوب (Responsive): متوافق تماماً مع الهوية البصرية ويتكيف تلقائياً مع شاشات الهواتف الذكية والحواسب.
• مظهر زجاجي عصري: يعتمد على تدرجات زرقاء مريحة للعين وخلفيات راقية تناسب الطابع التقني.
• أزرار كبسولية (Capsule UI): تمنح أزرار الاتصال وتحفيز الإجراء (CTA) مظهراً جذاباً يزيد من نسبة النقر.
• أمان التكوين البرمجي: الكود نظيف ومحمي ضد التشويه الذي يحدث عادةً من قِبل محررات البريد مثل Gmail و Outlook.

كود القالب الكامل (HTML):
يمكنك نسخ الكود التالي وتعديل الروابط الداخلية بما يناسب منتدانا قبل إرساله:

    <style>
        body {
            margin: 0;
            padding: 0;
            background-color: #f4f7f9;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            color: #333333;
            line-height: 1.8;
        }
        .wrapper {
            width: 100%;
            table-layout: fixed;
            background-color: #f4f7f9;
            padding-top: 40px;
            padding-bottom: 40px;
        }
        .container {
            max-width: 600px;
            margin: 0 auto;
            background-color: #ffffff;
            border-radius: 16px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
            overflow: hidden;
            border: 1px solid rgba(0, 134, 255, 0.1);
        }
        .header {
            background: linear-gradient(135deg, #005691 0%, #0086ff 100%);
            padding: 35px 20px;
            text-align: center;
            color: #ffffff;
        }
        .header h1 {
            margin: 0;
            font-size: 26px;
            font-weight: bold;
            letter-spacing: 0.5px;
        }
        .header p {
            margin: 5px 0 0 0;
            font-size: 14px;
            opacity: 0.9;
        }
        .content {
            padding: 30px 25px;
        }
        .welcome-text {
            font-size: 16px;
            font-weight: 600;
            color: #005691;
            margin-bottom: 15px;
        }
        .offer-box {
            background-color: rgba(0, 134, 255, 0.04);
            border-right: 4px solid #0086ff;
            padding: 15px 20px;
            border-radius: 4px 12px 12px 4px;
            margin: 20px 0;
        }
        .offer-box p {
            margin: 0;
            font-size: 15px;
            font-weight: 500;
        }
        .section-title {
            font-size: 18px;
            font-weight: bold;
            color: #111111;
            margin-top: 25px;
            margin-bottom: 10px;
            border-bottom: 1px solid #eeeeee;
            padding-bottom: 5px;
        }
        .features-list {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        .features-list li {
            position: relative;
            padding-right: 25px;
            margin-bottom: 12px;
            font-size: 15px;
        }
        .features-list li::before {
            content: "✦";
            position: absolute;
            right: 0;
            color: #0086ff;
            font-weight: bold;
        }
        .btn-container {
            text-align: center;
            margin: 35px 0 20px 0;
        }
        .btn-action {
            display: inline-block;
            background: linear-gradient(90deg, #0086ff 0%, #005691 100%);
            color: #ffffff !important;
            text-decoration: none;
            padding: 12px 35px;
            font-size: 16px;
            font-weight: bold;
            border-radius: 50px;
            box-shadow: 0 4px 10px rgba(0, 134, 255, 0.3);
        }
        .footer {
            background-color: #fcfdfe;
            border-top: 1px solid #eeeeee;
            padding: 20px;
            text-align: center;
            font-size: 12px;
            color: #777777;
        }
        .footer a {
            color: #0086ff;
            text-decoration: none;
        }
    </style>

    <div class="wrapper">
        <div class="container">
        
            <div class="header">
                <h1>codeNET</h1>
                <p>المنصة الأولى لتطوير منتديات زين فورو</p>
            </div>

            <div class="content">
                <div class="welcome-text">أهلاً بك يا مجتمع المطورين وأصحاب المواقع،</div>
            
                <p>في إطار دعمنا المستمر للمحتوى العربي وتطوير المنتديات، يسر إدارة <strong>منتدى كود نت</strong> أن تقدم لك عرضاً استثنائياً وخاصاً بأصحاب المواقع والمنتديات الحيوية والنشطة.</p>
            
                <div class="offer-box">
                    <p><strong>💡 المبادرة باختصار:</strong> عند وضع البنر الإعلاني الخاص بـ (كود نت) في موقعك، ستحصل في المقابل على <strong>خدمات دعم فني متكاملة ومتقدمة (مدفوعة)</strong> لمنتداك بشكل مجاني تماماً طوال فترة بقاء البنر!</p>
                </div>

                <div class="section-title">🛠️ ما الذي يشمله الدعم الفني المجاني؟</div>
                <ul class="features-list">
                    <li><strong>تطوير وتخصيص XenForo:</strong> تركيب الإضافات، وتعديل القوالب، وتنسيق الاستايلات باحترافية.</li>
                    <li><strong>الحماية والأمان:</strong> فحص الثغرات وسدها، وتأمين الخوادم ضد هجمات حجب الخدمة (DDoS).</li>
                    <li><strong>المشاكل البرمجية:</strong> حل أخطاء قواعد البيانات، مشاكل الـ cURL والجلسات (Sessions).</li>
                    <li><strong>تحسين الأداء:</strong> تسريع تصفح المنتدى وضبط الإعدادات لضمان أفضل أداء خفيف وسريع.</li>
                </ul>

                <div class="section-title">📌 شروط الانضمام للمبادرة:</div>
                <ul class="features-list">
                    <li><strong>حيوية الموقع:</strong> أن يكون الموقع نشطاً ويحتوي على تفاعل حقيقي ومستمر (لا نقبل المواقع المهجورة).</li>
                    <li><strong>مكان البنر:</strong> يتم إدراج البنر في مكان واضح (الهيدر، الفوتر، أو القائمة الجانبية).</li>
                </ul>

                <div class="btn-container">
                    <a href="https://yourforumurl.com/link-to-thread" class="btn-action">انضم إلينا وقدم طلبك الآن</a>
                </div>
            
            </div>

            <div class="footer">
                <p>هذه الرسالة مرسلة من قِبل إدارة <a href="https://yourforumurl.com">منتدى كود نت</a>.</p>
                <p>&copy; 2026 codeNET. جميع الحقوق محفوظة.</p>
            </div>

        </div>
    </div>

طريقة الاستخدام لإرسال البريد الجماعي في XenForo:

1. توجه إلى لوحة تحكم الإدارة (ACP) الخاصة بمنتداك.
2. من القائمة الجانبية، انتقل إلى: التواصل -> بريد الالكتروني للمستخدمين (Email users).
3. قم بضبط خيارات استهداف الأعضاء (مثل المجموعات أو الأعضاء النشطين فقط) - او اتركها فارغه للارسال للكل .
4. في صندوق نص الرسالة، تأكد من تفعيل خيار إرسال بريد إلكتروني بتنسيق HTML (Send email as HTML).
5. ضع العنوان المناسب للحملة، ثم الصق كود الـ HTML المرفق أعلاه في حقل الرسالة بعد تعديل الروابط
   https://yourforumurl.com
   برابط منتدانا الفعلي ورابط موضوع المبادرة.
6. اضغط على إرسال (Send) لتبدأ المنصة في جدولة الحملة البريدية وإيصالها لكافة الأعضاء بشكل منسق واحترافي.

أتمنى أن ينال القالب إعجابكم، وبانتظار تفاعلكم ومقترحاتكم لتطوير المزيد من التصاميم الحصرية لمنصتنا!

كود نت.. المنصة الأولى لتطوير منتديات زين فورو نحو آفاق احترافية جديدة.

 

[Admin]

قالب جميل ومميز
يعطيك العافية أخي مهدي