বিষয়বস্তুতে যান
ডেভেলপার ডকুমেন্টেশনসাপোর্ট ডেমো অনুরোধ করুন সাইন ইন করুন
Pushwoosh.com

HTML কোড এডিটর দিয়ে ইমেল কন্টেন্ট তৈরি করুন

ইউটিউব ভিডিও: HTML দিয়ে স্ক্র্যাচ থেকে আপনার ইমেল কন্টেন্ট তৈরি করুন

আপনি যদি HTML-এ পারদর্শী হন এবং নিজের কোড লিখতে পছন্দ করেন, তাহলে আপনি Pushwoosh HTML কোড এডিটর ব্যবহার করে ইমেল তৈরি করতে পারেন।

ইমেল কন্টেন্ট তৈরি করুন

Anchor link to

ইমেল কন্টেন্ট তৈরি শুরু করতে, আপনার HTML কোডটি HTML ট্যাবে পেস্ট করুন। এডিটরটি আপনার কাজ করার সময় রিয়েল-টাইম ইমেল প্রিভিউ প্রদান করে।

বিকল্পভাবে, আপনি নীচের প্যানেলে অবস্থিত Upload HTML File-এ ক্লিক করে একটি HTML ফাইল আপলোড করতে পারেন।

আপনার ইমেলগুলিতে একটি ব্যক্তিগত ছোঁয়া যোগ করতে, কাস্টম ট্যাগ ব্যবহার করুন। এর জন্য:

  1. এডিটরের নীচে অবস্থিত ট্যাগ আইকনে ক্লিক করুন।
  2. পছন্দসই ট্যাগ এবং এর মডিফায়ার নির্বাচন করুন, এবং প্রয়োজনে একটি ডিফল্ট মান প্রদান করুন।
  3. আপনার ইমেল কন্টেন্টে কাস্টম ট্যাগ অন্তর্ভুক্ত করতে Insert-এ ক্লিক করুন।
কাস্টম ট্যাগ সন্নিবেশ ইন্টারফেস যা ট্যাগ নির্বাচন এবং ডিফল্ট মান বিকল্পগুলি দেখাচ্ছে

আপনার ইমেলে একটি ইমোজি অন্তর্ভুক্ত করতে, এডিটরের নীচে অবস্থিত ইমোজি আইকনে ক্লিক করুন।

লোকালাইজেশন ব্যবহার করুন

Anchor link to

লোকালাইজেশন আপনাকে বিভিন্ন ভাষার ব্যবহারকারীদের জন্য ব্যক্তিগত অভিজ্ঞতা প্রদান করার ক্ষমতা দেয়।

HTML কোড এডিটরে, আপনি একটি ডিফল্ট ভাষা নির্ধারণ করে এবং একাধিক ভাষার বিকল্প যোগ করে লোকালাইজেশন ব্যবহার করতে পারেন। উদাহরণস্বরূপ, আপনি ইংরেজিতে একটি ডিফল্ট বার্তা সেট করতে পারেন এবং তারপরে জার্মান এবং স্প্যানিশ ভাষায় অনুবাদ অন্তর্ভুক্ত করতে পারেন। এটি নিশ্চিত করে যে আপনার ইমেল কন্টেন্ট প্রতিটি ব্যবহারকারীর ভাষার পছন্দের সাথে খাপ খাইয়ে নেয়।

আপনার লোকালাইজেশন ডেটা কীভাবে গঠন করবেন তার একটি উদাহরণ নীচে দেওয়া হল। এটি ইংরেজিকে ডিফল্ট ভাষা এবং জার্মান ও স্প্যানিশ অনুবাদ ব্যবহার করে।

{
  "default": {
    "button": "Shop now",
    "description": "For a limited time, you can enjoy a 20% discount on all our premium coffee blends",
    "subtitle": "Don't miss it",
    "title": "☕ Coffee Promotion Alert!"
  },
  "de": {
    "button": "Jetzt einkaufen",
    "description": "Für kurze Zeit erhalten Sie einen Rabatt von 20% auf alle unsere Premium-Kaffeemischungen",
    "subtitle": "Verpassen Sie es nicht",
    "title": "☕ Kaffee-Promotion Benachrichtigung!"
  },
  "es": {
    "button": "Comprar ahora",
    "description": "Por tiempo limitado, puedes disfrutar de un descuento del 20% en todas nuestras mezclas de café premium",
    "subtitle": "No te lo pierdas",
    "title": "☕ ¡Alerta de Promoción de Café!"
  }
}

একবার আপনার লোকালাইজেশন ডেটা গঠন করা হয়ে গেলে এবং এডিটরের Localization Tab-এ যোগ করা হলে, প্লেসহোল্ডার ব্যবহার করে এটিকে আপনার HTML কন্টেন্টে অন্তর্ভুক্ত করুন। প্লেসহোল্ডারগুলি ব্যবহারকারীর ভাষার পছন্দের উপর ভিত্তি করে আপনার কন্টেন্টে গতিশীলভাবে স্থানীয়করণ করা পাঠ্য সন্নিবেশ করায়। এখানে আপনার HTML-এ এটি কীভাবে প্রয়োগ করবেন তা দেখানো হলো

{{title|text|}}
{{subtitle|text|}}
{{description|text|}}
{{button|text|}}

এই দৃশ্যটি বিবেচনা করুন: আপনি কফি ব্লেন্ডে একটি সীমিত সময়ের ডিসকাউন্টের বিজ্ঞাপন দিচ্ছেন। উপরে উল্লিখিত লোকালাইজেশন কাঠামো ব্যবহার করে, আপনি বিভিন্ন ভাষায় কথা বলা ব্যবহারকারীদের কাছে আপনার প্রচারমূলক বার্তা কার্যকরভাবে পৌঁছে দিতে পারেন। প্রচারের জন্য আপনার HTML কোডটি এইরকম হতে পারে:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>☕ Coffee Promotion Alert</title>
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
    background-color: #f4f4f4;
  }
  .container {
    background-color: #fff;
    padding: 20px;
    margin: 10px auto;
    max-width: 600px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  }
  .button {
    display: inline-block;
    padding: 10px 20px;
    margin-top: 20px;
    background-color: #ff6f61;
    color: white;
    text-decoration: none;
    border-radius: 5px;
  }
  .button:hover {
    background-color: #ff5733;
  }
  .footer {
    text-align: center;
    margin-top: 20px;
    font-size: 0.8em;
    color: #888;
  }
</style>
</head>
<body>
  <div class="container">
    <h1>{{title|text|}}</h1>
    <p>{{description|text|}}</p>
    <a href="https://www.example.com/promotion" class="button">{{button|text|}}</a>


  </div>
</body>
</html>

এই সেটআপের সাথে, যদি কোনো ব্যবহারকারীর ভাষা জার্মান হয়, তবে তারা ইমেলটি জার্মান ভাষায় দেখবে। যে ব্যবহারকারীরা ইংরেজিতে ইমেল পেতে বেছে নিয়েছেন তারা এটি ইংরেজিতে দেখবেন। যারা স্প্যানিশ ভাষায় এটি পেতে বেছে নিয়েছেন তারা এটি স্প্যানিশ ভাষায় পাবেন। এটি নিশ্চিত করে যে সমস্ত প্রাপক তাদের পছন্দের ভাষায় আপনার বার্তা পান।

ইমেল কন্টেন্ট ব্লক সন্নিবেশ এবং একত্রিত করুন

Anchor link to

Pushwoosh আপনাকে একটি ইমেল কন্টেন্টের মধ্যে অন্য একটি ইমেল কন্টেন্ট সন্নিবেশ করে ইমেল কন্টেন্ট একত্রিত করার অনুমতি দেয়। এটি বিভিন্ন ইমেল জুড়ে হেডার, ফুটার বা নির্দিষ্ট কন্টেন্ট ব্লকের মতো উপাদানগুলি পুনরায় ব্যবহার করা সহজ করে তোলে।

উদাহরণস্বরূপ, যদি আপনার কাছে ইমেল কন্টেন্ট A (একটি হেডার) এবং ইমেল কন্টেন্ট B (একটি নিউজলেটার) থাকে, তবে আপনি প্রতিবার ম্যানুয়ালি কন্টেন্ট অনুলিপি না করেই ইমেল কন্টেন্ট B-তে ইমেল কন্টেন্ট A সন্নিবেশ করতে পারেন।

সিনট্যাক্স

Anchor link to

একটি কন্টেন্টের মধ্যে অন্য একটি কন্টেন্ট সন্নিবেশ করতে, নিম্নলিখিত সিনট্যাক্স ব্যবহার করুন:

{% email_content "AAAAA-BBBBB" %}

যেখানে “AAAAA-BBBBB” হল সেই ইমেল কন্টেন্টের আইডি যা আপনি সন্নিবেশ করতে চান। আপনি আপনার ইমেল কন্টেন্টের তালিকায় কন্টেন্টের নামের নীচে অবস্থিত আইডিটি খুঁজে পেতে পারেন।

ইমেল কন্টেন্ট আইডি প্রদর্শন যা কন্টেন্টের নাম এবং অনন্য শনাক্তকারী দেখাচ্ছে

উদাহরণ

ধরা যাক আপনার কাছে দুটি কন্টেন্ট আছে:

  • হেডার কন্টেন্ট (আইডি: “AAAAA-BBBBB”) একটি পূর্বনির্ধারিত হেডার ডিজাইন সহ।
  • নিউজলেটার কন্টেন্ট, যেখানে আপনি হেডারটি অন্তর্ভুক্ত করতে চান।

নিউজলেটারে হেডারটি সন্নিবেশ করতে, আপনি নিম্নলিখিতটি ব্যবহার করবেন:

{% email_content "AAAAA-BBBBB" %}

এটি আপনাকে একাধিক ইমেল প্রচারাভিযানে একটি পূর্বনির্ধারিত হেডার সহজেই পুনরায় ব্যবহার করার অনুমতি দেয়। এটি সময় বাঁচায় এবং আপনার ইমেল জুড়ে সামঞ্জস্যতা নিশ্চিত করে।

একটি আনসাবস্ক্রাইব লিঙ্ক যোগ করুন

Anchor link to

আপনার ইমেলে একটি আনসাবস্ক্রাইব লিঙ্ক অন্তর্ভুক্ত করুন যাতে প্রাপকরা নিয়মাবলী এবং তাদের পছন্দ অনুযায়ী অপ্ট-আউট করতে পারে। Pushwoosh তিনটি ভেরিয়েবল সরবরাহ করে যা আপনি আপনার HTML-এ ব্যবহার করতে পারেন।

আনসাবস্ক্রাইব লিঙ্ক

Anchor link to

এই লিঙ্কটি যোগ করুন যাতে ব্যবহারকারীরা তাদের প্রাপ্ত বার্তা থেকে অপ্ট-আউট করতে পারে:

<a href=%%PW_EMAIL_UNSUBSCRIBE%%> Unsubscribe </a>

আপনি যখন ইমেল পাঠান তখন ভেরিয়েবলটি Pushwoosh আনসাবস্ক্রাইব URL দিয়ে প্রতিস্থাপিত হয়।

  • যখন সাবস্ক্রিপশন প্রেফারেন্স সেন্টার সক্রিয় থাকে, তখন প্রাপকরা শুধুমাত্র সেই ইমেলের জন্য নির্ধারিত বিভাগ থেকে আনসাবস্ক্রাইব হন (যেমন, নিউজলেটার)। একটি নিশ্চিতকরণ স্ক্রিন প্রদর্শিত হয় যেখানে তারা সেই বিভাগে পুনরায় সাবস্ক্রাইব করতে পারে বা সমস্ত ইমেল বিভাগ সামঞ্জস্য করতে প্রেফারেন্স পরিচালনা করতে পারে। আরও জানুন

  • যখন সাবস্ক্রিপশন প্রেফারেন্স সেন্টার সক্রিয় না থাকে, তখন প্রাপকরা সমস্ত মার্কেটিং ইমেল থেকে আনসাবস্ক্রাইব হন।

Message History-তে সেই বার্তার জন্য আনসাবস্ক্রাইব হারে ক্লিকগুলি গণনা করা হয়।

সমস্ত বিভাগ থেকে আনসাবস্ক্রাইব করুন

Anchor link to

একটি লিঙ্ক যোগ করুন যা ব্যবহারকারীকে একবারে সমস্ত ইমেল বিভাগ থেকে আনসাবস্ক্রাইব করে:

<a href=%%PW_EMAIL_UNSUBSCRIBE_ALL%%> Unsubscribe from all emails </a>

প্রেফারেন্স সেন্টার লিঙ্ক

Anchor link to

যেখানে ব্যবহারকারীরা কোন কোন বিভাগগুলি গ্রহণ করবেন তা পরিচালনা করেন, সেই প্রেফারেন্স সেন্টারে একটি সরাসরি লিঙ্ক যোগ করুন:

<a href=%%PW_EMAIL_PREFERENCE_CENTER_LINK%%> Manage preferences </a>

প্রেফারেন্স সেন্টার কীভাবে কাজ করে তা জানুন

নীচের স্ক্রিনশটটি একটি ফুটার দেখাচ্ছে যা তিনটি লিঙ্কের প্রকারই ব্যবহার করে।

ইমেল ফুটারের উদাহরণ যেখানে তিনটি আনসাবস্ক্রাইব লিঙ্ক রয়েছে: আনসাবস্ক্রাইব, প্রেফারেন্স পরিচালনা করুন, সমস্ত ইমেল থেকে আনসাবস্ক্রাইব করুন

ইমেল কন্টেন্ট সংরক্ষণ করুন

Anchor link to

আপনার ইমেল তৈরি করা শেষ হয়ে গেলে, এডিটরের শীর্ষে অবস্থিত Save বোতামে ক্লিক করুন।

ইমেল কন্টেন্ট সংরক্ষণ ডায়ালগ যা নাম এবং লেবেল ক্ষেত্রগুলি দেখাচ্ছে

যে নতুন উইন্ডোটি প্রদর্শিত হবে, সেখানে আপনার ইমেলকে একটি স্পষ্ট নাম দিন, যা আপনার বিষয় লাইনের মতোই হতে পারে। এছাড়াও, একটি লেবেল তৈরি করুন যা আপনাকে আপনার ইমেলের তালিকায় সহজেই এটি খুঁজে পেতে সহায়তা করবে।

আপনি যদি এখনও প্রেরকের বিবরণ সেট আপ না করে থাকেন, তবে নিশ্চিত করুন যে আপনি সেটিও করেছেন। তারপর, Save-এ ক্লিক করুন।

এখন আপনার ইমেল কন্টেন্ট প্রস্তুত, এটি ইমেল প্রচারাভিযানে ব্যবহার করা যেতে পারে। আরও জানুন

একটি পরীক্ষামূলক ইমেল পাঠান

Anchor link to

আপনার ইমেল প্রচারাভিযান পাঠানোর আগে, কন্টেন্টটি প্রাপকদের ইনবক্সে কীভাবে প্রদর্শিত হবে তা প্রিভিউ করার জন্য আপনি একটি পরীক্ষামূলক ইমেল পাঠাতে পারেন। এটি আপনাকে প্রচারাভিযান চূড়ান্ত করার আগে লেআউট, কন্টেন্ট এবং যেকোনো ব্যক্তিগতকৃত উপাদান পর্যালোচনা করে নির্ভুলতা নিশ্চিত করতে দেয়। প্রয়োজনে, পরীক্ষার ফলাফলের উপর ভিত্তি করে কন্টেন্ট সামঞ্জস্য করুন।

একটি পরীক্ষামূলক ইমেল পাঠাতে, ইমেল এডিটরে Test email-এ ক্লিক করুন।

ইমেল এডিটর ইন্টারফেসে পরীক্ষামূলক ইমেল বোতাম

যে উইন্ডোটি খুলবে:

  1. Email address ক্ষেত্রে, আপনি যেখানে পরীক্ষামূলক ইমেলটি পেতে চান সেই ইমেল ঠিকানাটি লিখুন।

যদি KYC সম্পন্ন না হয়ে থাকে, তবে আপনাকে একটি ইমেল প্রবেশ করানোর পরিবর্তে পরীক্ষামূলক ঠিকানাগুলির তালিকা থেকে একটি যাচাইকৃত ইমেল ঠিকানা নির্বাচন করতে হবে।

যাচাইকৃত পরীক্ষামূলক ইমেল ঠিকানা নির্বাচন ড্রপডাউন
  1. যদি আপনার ইমেলে ডাইনামিক কন্টেন্ট (ব্যক্তিগত ডেটার জন্য প্লেসহোল্ডার) থাকে, তবে পরীক্ষার উদ্দেশ্যে নমুনা মান যোগ করুন।

উদাহরণস্বরূপ:

  • Age (integer): বয়স প্লেসহোল্ডারটি উপস্থাপন করার জন্য একটি সংখ্যা লিখুন (যেমন, 21)।
  • FirstName (string): একটি নমুনা প্রথম নাম লিখুন (যেমন, David)।

এই মানগুলি পরীক্ষামূলক ইমেলে প্রকৃত প্রাপকের ডেটা প্রতিস্থাপন করবে, যা আপনাকে ডাইনামিক কন্টেন্ট কীভাবে প্রদর্শিত হয় তা যাচাই করার অনুমতি দেবে।

  1. একবার আপনি প্রয়োজনীয় বিবরণ পূরণ করলে, প্রদত্ত ইমেল ঠিকানায় পরীক্ষামূলক বার্তাটি পাঠাতে Send test email-এ ক্লিক করুন।
নমুনা ডেটা ক্ষেত্র সহ পরীক্ষামূলক ইমেল পাঠানোর নিশ্চিতকরণ ডায়ালগ