GrapesJS ईमेल क्या है?

यह कोई अलग उत्पाद नहीं है। GrapesJS एक ओपन-सोर्स वेब और ईमेल बिल्डर फ्रेमवर्क है, और "GrapesJS ईमेल" इसे ईमेल-उन्मुख कॉन्फ़िगरेशन के साथ चलाने के लिए संदर्भित करता है - आमतौर पर MJML प्लगइन या न्यूज़लेटर प्रीसेट - इसलिए कैनवास वेब पेज मार्कअप के बजाय ईमेल मार्कअप का उत्पादन करता है।

क्या GrapesJS उत्तरदायी ईमेल बना सकते हैं?

हाँ। MJML प्लगइन के साथ, उपयोगकर्ता जिन घटकों को कैनवास पर खींचता है, वे उत्तरदायी, तालिका-आधारित HTML में संकलित होते हैं। कॉलम स्टैकिंग और मीडिया क्वेरी प्रत्येक टेम्पलेट में हाथ से बनाए रखने के बजाय MJML कंपाइलर द्वारा उत्पन्न की जाती हैं।

क्या GrapesJS MJML का समर्थन करता है?

हाँ, grapesjs-mjml के माध्यम से, GrapesJS संगठन में npm पर बनाए रखा जाता है। यह MJML घटकों को संपादक ब्लॉक के रूप में पंजीकृत करता है और MJML स्रोत को पढ़ने और इसे HTML में संकलित करने के लिए कमांड जोड़ता है।

क्या GrapesJS HTML ईमेल निर्यात कर सकते हैं?

हाँ। MJML प्लगइन के साथ, editor.runCommand('mjml-code-to-html') संकलित, CSS-इनलाइन HTML लौटाता है। न्यूज़लेटर प्रीसेट के साथ, editor.runCommand('gjs-get-inlined-html') सीधे HTML इनलाइन रिटर्न करता है। या तो आउटपुट किसी भी चीज़ द्वारा भेजा जा सकता है जो HTML ईमेल स्वीकार करता है।

MJML और HTML ईमेल के बीच क्या अंतर है?

MJML एक उच्च-स्तरीय मार्कअप भाषा है जो HTML ईमेल को संकलित करती है। आप सिमेंटिक घटक लिखते हैं और कंपाइलर नेस्टेड टेबल, इनलाइन CSS और क्लाइंट-विशिष्ट मार्कअप का उत्सर्जन करता है जो मेल क्लाइंट की अपेक्षा करते हैं। कच्चा HTML ईमेल संकलन चरण को छोड़ देता है लेकिन उस काम को आप पर छोड़ देता है, प्रति टेम्पलेट।

क्या मैं अपने डेटाबेस में ईमेल टेम्पलेट्स स्टोर कर सकता हूं?

हाँ। Storage Manager आपके द्वारा उजागर किए गए किसी भी समापन बिंदु पर इंगित कर सकता है, इसलिए प्रोजेक्ट JSON और टेम्पलेट मेटाडेटा आपके अपने डेटाबेस में सहेजे जाते हैं। आपके बुनियादी ढांचे को छोड़ने के लिए टेम्पलेट डेटा की आवश्यकता नहीं है।

क्या मैं GrapesJS को अपने API से कनेक्ट कर सकता हूँ?

हाँ। भंडारण, संपत्ति अपलोड और कोई भी कस्टम कमांड आपके स्वयं के एंडपॉइंट को कॉल कर सकता है, जिसमें आपके स्वयं के प्रमाणीकरण हेडर भी शामिल हैं। संपादक आपके एप्लिकेशन के अंदर चलने वाली एक क्लाइंट-साइड लाइब्रेरी है, न कि एक होस्ट की गई सेवा जिसे आप कॉल करते हैं।

क्या मैं GrapesJS को ESP के साथ एकीकृत कर सकता हूँ?

हां, और एकीकरण जानबूझकर ढीला है: संपादक HTML का उत्पादन करता है, और आपका बैकएंड उस HTML को भेजता है जो भी प्रदाता आप पहले से उपयोग करते हैं, अपने स्वयं के क्रेडेंशियल्स और भेजने वाले डोमेन के साथ। GrapesJS कभी भी आपके ESP से बात नहीं करता है।

क्या मैं लेन-देन संबंधी ईमेल के लिए GrapesJS का उपयोग कर सकता हूँ?

हाँ। लेन-देन संबंधी टेम्पलेट आमतौर पर एक बार लिखे जाते हैं और फिर भेजने के समय पॉप्युलेट किए जाते हैं, इसलिए सामान्य पैटर्न संपादक में लेआउट बनाना है, सामग्री में मर्ज टैग या प्लेसहोल्डर रखना है, और भेजने से पहले अपने बैकएंड को उन्हें भरना है।

क्या मैं SaaS के साथ एक ईमेल मार्केटिंग GrapesJS बना सकता हूँ?

हाँ - संपादक लाइसेंस व्यावसायिक उपयोग की अनुमति देता है। GrapesJS आपको संपादन परत देता है; उपयोगकर्ता, योजनाएं, सूचियाँ, शेड्यूलिंग, भेजना और विश्लेषण निर्माण के लिए आपका एप्लिकेशन बने रहेंगे।

क्या मैं कस्टम ईमेल ब्लॉक बना सकता हूँ?

हाँ। Blocks और घटक एक सार्वजनिक API हैं, इसलिए एक कस्टम ईमेल ब्लॉक एक छोटा प्लगइन है। MJML प्लगइन के साथ, कस्टम ब्लॉक MJML घटकों से बनाए जाते हैं, इसलिए वे उसी तरह संकलित होते हैं जैसे अंतर्निहित करते हैं।

क्या मैं पुनः प्रयोज्य ईमेल टेम्पलेट बना सकता हूँ?

हाँ। एक तैयार ईमेल के प्रोजेक्ट JSON को सहेजें और इसे नए लोगों के लिए शुरुआती बिंदु के रूप में लोड करें। एक प्लगइन जैसे कि टेम्प्लेट-मैनेजर एक इन-एडिटर टेम्पलेट परत जोड़ता है यदि आप इसे स्वयं नहीं बनाना चाहते हैं।

क्या मैं ईमेल संपादक को व्हाइट-लेबल कर सकता हूं?

हाँ। पैनल, आइकन, थीम और लेआउट सभी अनुकूलन योग्य हैं, और लाइसेंस को आपके इंटरफ़ेस में एट्रिब्यूशन की आवश्यकता नहीं है, इसलिए संपादक आपके उत्पाद के मूल भाग की तरह दिख सकता है।

क्या मैं GrapesJS के साथ React का उपयोग कर सकता हूँ?

हाँ। आधिकारिक @grapesjs/react रैपर (MIT) माउंटिंग और जीवनचक्र को संभालता है, या आप रेफरी के खिलाफ प्रभाव में कोर लाइब्रेरी को इनिशियलाइज़ कर सकते हैं। React-विशिष्ट सेटअप हमारे React पृष्ठों पर कवर किया गया है।

क्या मैं GrapesJS के साथ Next.js का उपयोग कर सकता हूँ?

हां, एक चेतावनी के साथ: संपादक को DOM की आवश्यकता होती है, इसलिए इसे केवल क्लाइंट-साइड लोड किया जाना चाहिए - आमतौर पर SSR अक्षम के साथ गतिशील आयात के माध्यम से। MJML प्लगइन सहित बाकी सब कुछ, किसी भी React एप्लिकेशन की तरह व्यवहार करता है।

क्या वाणिज्यिक परियोजनाओं के लिए GrapesJS मुफ़्त है?

हाँ। कोर BSD-3-Clause है, जो व्यावसायिक उपयोग, संशोधन और वितरण की अनुमति देता है। कोई लाइसेंस शुल्क नहीं है और प्रति सीट कोई लागत नहीं है। व्यक्तिगत GJS.Market प्लगइन्स की अपनी कीमतें और शर्तें हैं।

ईमेल बिल्डर के लिए मुझे किन प्लगइन्स की आवश्यकता होगी?

कम से कम एक ईमेल प्रीसेट - MJML प्रीसेट या न्यूज़लेटर प्रीसेट। इसके अलावा यह इस बात पर निर्भर करता है कि आपने पहले से क्या नहीं बनाया है: भंडारण यदि आपके पास अभी तक कोई समापन बिंदु नहीं है, तो छवि होस्टिंग के लिए एक परिसंपत्ति प्लगइन, खरोंच से अनुभागों को लिखने से बचने के लिए एक ब्लॉक सेट, और यदि आपको संपादक से फ़ाइलों की आवश्यकता है तो निर्यात करें।

क्या GrapesJS Unlayer का विकल्प है?

यह एक ही समस्या को अलग तरह से हल करता है। Unlayer एक होस्टेड, व्यावसायिक रूप से समर्थित संपादक है, जिसकी योजना $250/mo से शुरू होती है और इसके Enterprise स्तर पर ऑन-प्रिमाइसेस तैनाती है। GrapesJS एक स्व-होस्टेड ओपन-सोर्स फ्रेमवर्क है जिसमें कोई लाइसेंस शुल्क नहीं है, जहां समर्थन और आसपास के बुनियादी ढांचे की व्यवस्था करने के लिए आपका है। मूल्य निर्धारण सत्यापित 2026-08-27।

क्या GrapesJS स्ट्रिपो का विकल्प है?

एम्बेड करने योग्य संपादक उपयोग के मामले के लिए, हाँ। स्ट्रिपो Plugin एक होस्ट किया गया एम्बेड करने योग्य संपादक है जिसकी योजना $100/mo से शुरू होती है और इसके Enterprise स्तर पर सर्वर घटकों की स्व-होस्टिंग है। GrapesJS शुरू से ही पूरी तरह से आपके एप्लिकेशन में चलता है, जिसमें कोई योजना स्तर नहीं है। मूल्य निर्धारण सत्यापित 2026-08-27।

GrapesJS + MJML

अपना खुद का ईमेल बिल्डर बनाएं GrapesJS के साथ

MJML के साथ नेत्रहीन रूप से उत्तरदायी ईमेल बनाएं, उत्पादन-तैयार HTML निर्यात करें, और अपने टेम्प्लेट, डेटा और एकीकरण को अपने स्वयं के बुनियादी ढांचे में रखें।

GrapesJS के साथ बनाएं ईमेल प्लगइन्स ब्राउज़ करें

खुला स्रोतBSD-3-Clause कोरMJML grapesjs-mjml के माध्यम सेस्व-होस्टेड$0 प्लेटफ़ॉर्म शुल्क

संपादक कहाँ बैठता है

आपका उत्पाद
अभियान
ईमेल संपादक
MJML से HTML
आपका भेजने वाला प्रदाता

26k+

GitHub सितारे

100+

GJS.Market पर प्लगइन्स

10 साल

सक्रिय विकास

लाइसेंस शुल्क, हमेशा

अपना खुद का निर्माण क्यों करें

एक ईमेल संपादक एक दर्जन सबसिस्टम है, कैनवास नहीं

ब्लॉकों को इधर-उधर खींचना वह हिस्सा है जिसे हर कोई चित्रित करता है। वह काम जो वास्तव में एक रोडमैप का उपभोग करता है, वह कैनवास के पीछे बैठा सब कुछ है - और यह वही सूची है चाहे आप सीआरएम, ईकॉमर्स प्लेटफॉर्म या मार्केटिंग SaaS में ईमेल जोड़ रहे हों।

कैनवास के पीछे क्या बैठता है

उत्तरदायी लेआउट इंजन
CSS इनलाइनिंग
Outlook सशर्त मार्कअप
डार्क-मोड वेरिएंट
टैग और वैयक्तिकरण मर्ज करें
सदस्यता समाप्त करें और वरीयता लिंक
छवि होस्टिंग और ट्रैकिंग पिक्सेल
टेम्पलेट संस्करण
ड्राफ्ट और autosave राज्य
भूमिका और अनुमति नियम
प्रदाता हैंड-ऑफ
ग्राहकों के बीच परीक्षण प्रस्तुत करें

संपादक स्वयं बनाएं

महीने

आप ऊपर दिए गए हर सबसिस्टम के मालिक हैं
ईमेल विचित्रताएँ आपके रोडमैप पर उतरती हैं
प्रत्येक नया ब्लॉक इंजीनियरिंग कार्य है
रखरखाव कभी खत्म नहीं होता
यहां कुछ भी आपका उत्पाद नहीं है

GrapesJS से शुरू करें

दिन

कैनवास, ब्लॉक और स्टाइल मैनेजर मौजूद हैं
MJML ईमेल-विशिष्ट मार्कअप को संभालता है
प्लगइन्स भंडारण, संपत्ति और निर्यात को कवर करते हैं
आप उत्पत्ति के बजाय विस्तार करते हैं
आपकी टीम इसके चारों ओर उत्पाद बनाती है

आपके ईमेल बिल्डर को आपके उत्पाद के आसपास काम करना चाहिए - इसके विपरीत नहीं।

क्यों MJML

ईमेल के लिए MJML का उपयोग क्यों करें?

ईमेल HTML वेब HTML की तरह व्यवहार नहीं करता है। MJML ईमेल के लिए डिज़ाइन की गई एक मार्कअप भाषा है: आप सिमेंटिक घटक लिखते हैं, और इसका कंपाइलर टेबल-आधारित, इनलाइन HTML का उत्सर्जन करता है जिसकी मेल क्लाइंट अपेक्षा करते हैं। यह वही है जो एक विज़ुअल एडिटर को ईमेल एडिटर में बदल देता है।

ईमेल-विशिष्ट घटक

अनुभाग, स्तंभ, बटन और डिवाइडर पहले से ही घटकों के रूप में मौजूद हैं, इसलिए एक ब्लॉक जिसे आप ब्राउज़र के बजाय ईमेल के लिए लिखा गया था, मार्कअप करने के लिए कैनवास मानचित्रों पर छोड़ते हैं।

उत्तरदायी लेआउट, संकलित

कॉलम स्टैकिंग और मीडिया-क्वेरी हैंडलिंग कंपाइलर द्वारा प्रति टेम्पलेट हाथ से बनाए रखने के बजाय उत्पादित किए जाते हैं।

आपके लिए इनलाइन की गई शैलियाँ

संकलन चरण CSS को इनलाइन करता है, जो कि अधिकांश मेल क्लाइंट की आवश्यकता होती है। आप पाइपलाइन में एक अलग इनलाइनर को तार नहीं करते हैं।

एक समझदार संलेखन परत

MJML स्रोत पठनीय और विसारणीय है, इसलिए एक टेम्पलेट नेस्टेड टेबल की दीवार के बजाय कोड की तरह समीक्षाओं को बदलता है।

अंत में अभी भी सादा HTML

आउटपुट साधारण HTML है। जो कुछ भी HTML ईमेल भेज सकता है वह इसे भेज सकता है - भेजने के समय MJML पर कोई रनटाइम निर्भरता नहीं।

ओपन सोर्स, दोनों हिस्से

mjml MIT है; grapesjs-mjml प्लगइन जो इसे GrapesJS में लाता है वह BSD-3-Clause है। न तो लाइसेंस शुल्क जोड़ता है।

MJML बनाम कच्चा HTML

कंपाइलर क्या करता है जो आप अन्यथा करेंगे

दोनों रास्ते HTML में समाप्त होते हैं। अंतर यह है कि आप ईमेल-विशिष्ट कार्य का कितना हिस्सा हाथ से बनाए रखते हैं, और प्रत्येक बचत पर आपके लिए कितना उत्पन्न होता है।

व्‍यापारिक संस्‍था	MJML	हाथ से लिखा HTML
उत्तरदायी लेआउट	घटकों से उत्पन्न	प्रति टेम्पलेट मैन्युअल रूप से बनाए रखा गया
ईमेल-विशिष्ट घटक	भाषा द्वारा प्रदान किया गया	आप अपना खुद का निर्माण और रखरखाव करते हैं
CSS इनलाइनिंग	संकलन चरण का हिस्सा	आपकी पाइपलाइन में एक अलग उपकरण
ग्राहक विचित्रता	कंपाइलर में संभाला गया, केंद्रीय रूप से	प्रत्येक टेम्पलेट में संभाला गया
लेखन	सिमेंटिक मार्कअप, पठनीय अंतर	नेस्टेड टेबल, समीक्षा करने के लिए कठिन
दृश्य संपादन	Components ब्लॉक के लिए साफ-सफाई से नक्शा बनाएं	प्रति ब्लॉक अधिक मानचित्रण कार्य
उत्पादन	HTML	HTML

MJML को प्रमुख ईमेल क्लाइंट में उत्तरदायी ईमेल विकास को सरल बनाने के लिए डिज़ाइन किया गया है। यह कार्य की एक श्रेणी को हटा देता है; यह आपके द्वारा भेजे गए कार्यों का परीक्षण करने की आवश्यकता को समाप्त नहीं करता है।

पाइपलाइन

आपका ईमेल बिल्डर क्या उत्पादन करता है?

संपादक से तीन कलाकृतियाँ निकलती हैं और प्रत्येक का एक काम होता है। यह जानना कि कौन सा है जो वास्तुकला का अधिकांश निर्णय है।

चरण 01
दृश्य संपादक
उपयोगकर्ता कैनवास पर ब्लॉक की व्यवस्था करता है। संपादक की अपनी प्रोजेक्ट स्थिति JSON है - यह वही है जिसे आप सहेजते हैं ताकि ईमेल को बाद में फिर से खोला और संपादित किया जा सके।
editor.getProjectData()
को serializes to
चरण 02
MJML
संलेखन प्रतिनिधित्व। पठनीय, विपरिवर्तनीय, और संस्करण के लिए सही बात जब आप यह देखना चाहते हैं कि टेम्पलेट के दो संशोधनों के बीच वास्तव में क्या बदल गया है।
editor.runCommand('mjml-code')
को संकलित करता है
चरण 03
उत्तरदायी HTML
संकलित, तालिका-आधारित, CSS-इनलाइन आउटपुट। यह वह कलाकृति है जिसे आप प्रसारित करते हैं, और केवल एक ही जिसे आपके भेजने वाले बुनियादी ढांचे को समझना है।
editor.runCommand('mjml-code-to-html')
को सौंप दिया जाता है
चरण 04
आपका ESP या API
डिलीवरी आपके पक्ष में रहती है। कोई भी प्रदाता या इन-हाउस सेवा जो HTML स्वीकार करती है, वह इसे आपके स्वयं के क्रेडेंशियल्स और आपके स्वयं के भेजने वाले डोमेन के साथ भेज सकती है।
पोस्ट /आपका-एपीआई/अभियान/:आईडी/भेजें

GrapesJS दृश्य संपादन परत को संभालता है। आपका एप्लिकेशन उपयोगकर्ताओं, टेम्प्लेट, डेटा, भंडारण और वितरण को नियंत्रित करता है।

स्‍वामित्‍व

आपका ईमेल बिल्डर। आपका डेटा। आपका बुनियादी ढांचा।

संपादक एक परत है। ईमेल के बारे में व्यावसायिक रूप से संवेदनशील सब कुछ - सूची, भेजने वाला डोमेन, आपके द्वारा इसके साथ बनाई गई प्रतिष्ठा - वहीं रहती है जहां यह पहले से ही है।

आपका उत्पाद

अभियान और कार्यक्रम
ग्राहक सूची और खंड
डोमेन और DKIM भेजना

GrapesJS ईमेल संपादक

कैनवास और ब्लॉक
MJML घटक
शैली प्रबंधक

ईमेल ब्लॉक
टेम्पलेट प्रबंधक
संपत्ति अपलोड

ईमेल प्लगइन्स का अन्वेषण करें

आपका बुनियादी ढांचा

आपका डेटाबेस
आपका मीडिया संग्रहण
आपके प्रदाता क्रेडेंशियल्स

इस आरेख में कुछ भी आपके टेम्पलेट या आपके प्राप्तकर्ताओं को रखने के लिए किसी तीसरे पक्ष की आवश्यकता नहीं है।

मौजूदा एप्लिकेशन के अंदर संपादक को माउंट करने के यांत्रिकी के लिए, जिसमें प्रमाणीकरण और iframe रणनीति शामिल है: एम्बेड करने योग्य पेज बिल्डर गाइड देखें

लाइव डेमो

एक बनाने से पहले एक GrapesJS ईमेल संपादक देखें

न्यूज़लेटर संपादक डेमो GrapesJS प्रोजेक्ट द्वारा प्रकाशित किया गया है। यह केवल तभी लोड होता है जब आप इसके लिए पूछते हैं, इसलिए तब तक पृष्ठ पर इसकी कोई कीमत नहीं होती है।

एक नए टैब में खोलें

grapesjs.com से ओपन-सोर्स न्यूज़लेटर संपादक डेमो — ब्लॉक खींचें, सामग्री संपादित करें, और HTML निर्यात करें।

GrapesJS प्रोजेक्ट द्वारा होस्ट किया गया डेमो। यह मुख्य संपादन अनुभव दिखाता है, न कि इस पृष्ठ के नीचे सूचीबद्ध प्लगइन्स।

वर्कफ़्लो

टेम्पलेट से भेजे गए ईमेल तक

1
चरण 1
एक टेम्पलेट चुनें
उपयोगकर्ता एक खाली कैनवास के बजाय एक सहेजे गए टेम्पलेट से शुरू होता है। टेम्पलेट आपके डेटाबेस में पंक्तियाँ हैं, इसलिए आप तय करते हैं कि कौन कौन सा देखता है।
2
चरण 2
विज़ुअल रूप से संपादित करें
Blocks को खींचा जाता है, पाठ को इनलाइन संपादित किया जाता है, स्टाइल मैनेजर में शैलियों को समायोजित किया जाता है। संपादक में MJML घटक होते हैं, इसलिए प्रत्येक संपादन ईमेल-सुरक्षित मार्कअप के अंदर रहता है।
3
चरण 3
ड्राफ्ट सहेजें
प्रोजेक्ट JSON को Storage Manager के माध्यम से अपने स्वयं के API तक जारी रखें। ऑटोसेव, ड्राफ्ट और संस्करण इतिहास आपके एप्लिकेशन का व्यवहार है, संपादक का नहीं।
4
चरण 4
पूर्वावलोकन और परीक्षण
समीक्षा के लिए संकलित HTML को रेंडर करें और अपने प्रदाता के माध्यम से परीक्षण संदेश भेजें। क्लाइंट-दर-क्लाइंट रेंडर परीक्षण एक ऐसी क्षमता है जिसे आप जोड़ते हैं - यह अंतर्निहित नहीं है।
5
चरण 5
HTML निर्यात करें
MJML को इनलाइन HTML में संकलित करें। इसे JSON और MJML के साथ स्टोर करें ताकि आप हमेशा जान सकें कि वास्तव में क्या भेजा गया था।
6
चरण 6
भेजें और ट्रैक करें
HTML को अपनी ESP या अपनी स्वयं की भेजने वाली सेवा को सौंपें। खुलता है, क्लिक और बाउंस उस प्रदाता के माध्यम से, आपकी रिपोर्टिंग में वापस आते हैं।

चरण 1, 3, 4 और 6 आपका आवेदन है। GrapesJS और MJML चरण 2 और चरण 5 के मालिक हैं - जो कि बिल्कुल वही हिस्सा है जिसमें अन्यथा महीनों लगेंगे।

बक्सों का इस्तेमाल करें

आप क्या बना सकते हैं?

एक ही नींव, विभिन्न उत्पादों की ओर इशारा करती है। इनमें से प्रत्येक एक संपादक के साथ-साथ आपका अपना भंडारण, अनुमतियाँ और वितरण है।

ईमेल मार्केटिंग SaaS

ग्राहकों को कहीं और से HTML पेस्ट करने के लिए कहने के बजाय अपने उत्पाद के अंदर एक विज़ुअल कैंपेन बिल्डर दें।

ड्रैग-एंड-ड्रॉप दृष्टिकोण देखें

सीआरएम

बिक्री और सफलता टीमों को इंजीनियरिंग के साथ टिकट दाखिल किए बिना आउटबाउंड ईमेल बनाने और समायोजित करने दें।

टेम्पलेट प्रबंधन देखें

विपणन स्वचालन

उन ईमेल को लिखें जो जीवनचक्र और ड्रिप वर्कफ़्लो भेजते हैं, उसी संपादक के साथ जो आपके उपयोगकर्ता पहले से जानते हैं।

React कार्यान्वयन देखें

ईकॉमर्स

प्रचार भेजता है, आदेश पुष्टिकरण और कार्ट-पुनर्प्राप्ति ईमेल, सभी एक ब्लॉक लाइब्रेरी और आपके अपने ब्रांड नियमों से बनाया गया है।

SaaS वास्तुकला देखें

SaaS ऑनबोर्डिंग

ऑनबोर्डिंग, सक्रियण और प्रतिधारण ईमेल जिन्हें आपकी उत्पाद टीम बिना परिनियोजन के बदल सकती है।

ईमेल प्लगइन्स ब्राउज़ करें

एजेंसियों

प्रति ग्राहक पुनः प्रयोज्य ब्रांडेड ईमेल सिस्टम, प्रति सीट प्लेटफॉर्म के बजाय आपके द्वारा नियंत्रित बुनियादी ढांचे पर चल रहा है।

व्हाइट-लेबल विकल्प देखें

क्यों GrapesJS

ईमेल के लिए GrapesJS का उपयोग क्यों करें?

GrapesJS एक होस्ट किए गए उत्पाद के बजाय एक संपादक ढांचा है। यही अंतर है कि यह आपके बगल में बैठने के बजाय आपका ईमेल बिल्डर बन सकता है।

खुला स्रोत

कोर BSD-3-Clause के तहत प्रकाशित किया गया है और व्यावसायिक उपयोग के लिए निःशुल्क है। आप इसे पढ़ सकते हैं, इसे फोर्क कर सकते हैं और इसे भुगतान किए गए उत्पाद के अंदर भेज सकते हैं।

स्व-होस्टेड

संपादक आपके अपने एप्लिकेशन के अंदर चलता है। कोई भी तीसरा पक्ष आपके उपयोगकर्ताओं और उनके टेम्पलेट्स के बीच नहीं बैठता है।

एक्स्टेंसिबल

Blocks, घटक, कमांड और पैनल सभी एक्सटेंशन पॉइंट हैं। एक कस्टम ईमेल ब्लॉक एक प्लगइन है, कांटा नहीं।

MJML समर्थन

grapesjs-mjml, GrapesJS संगठन में बनाए रखा गया है, MJML घटकों को प्रथम श्रेणी के ब्लॉक के रूप में संपादक में लाता है।

अनुकूलन UI

पैनल, आइकन और थीम आपको बदलने के लिए हैं, इसलिए संपादक एक एम्बेडेड टूल के बजाय आपके उत्पाद के हिस्से की तरह दिखता है।

Plugin पारिस्थितिकी तंत्र

100+ पर प्लगइन्स GJS.Market भंडारण, संपत्ति, ब्लॉक और निर्यात को कवर करते हैं, इसलिए आसपास का अधिकांश काम स्प्रिंट के बजाय खरीदारी है।

GrapesJS ट्यूटोरियल पढ़ें

GrapesJS बनाम होस्टेड ईमेल बिल्डर्स

GrapesJS बनाम Unlayer बनाम स्ट्रिपो

Unlayer और स्ट्रिपो होस्ट किए गए हैं, व्यावसायिक रूप से समर्थित उत्पाद हैं, और कई टीमों के लिए यह सही व्यापार है। यह तालिका इस बारे में है कि आप क्या नियंत्रित करते हैं और आप क्या भुगतान करते हैं, न कि इस बारे में कि कौन सा संपादक बेहतर है।

व्‍यापारिक संस्‍था	GrapesJS	Unlayer	स्ट्रिपो Plugin
स्रोत उपलब्ध और खुला स्रोत	हाँ — BSD-3-Clause	Not publicly documented	Not publicly documented
फ्री टियर	संपूर्ण संपादक, $0	निःशुल्क योजना, $0	निःशुल्क योजना, $0
सशुल्क योजनाएं	कोई नहीं - प्लगइन्स एकबारगी हैं	$250/mo / $750/mo / $2,000/mo	$100/mo / $550/mo
संपादक को स्व-होस्ट करना	हमेशा - यह आपके ऐप में चलता है	Enterprise पर ऑन-प्रिमाइसेस	Enterprise पर सर्वर घटक
MJML संलेखन परत के रूप में	हाँ — grapesjs-mjml	Not publicly documented	Not publicly documented
आपके अपने डेटाबेस में टेम्पलेट	हाँ - आप भंडारण परत लिखते हैं	योजना और तैनाती पर निर्भर करता है	योजना और तैनाती पर निर्भर करता है

विक्रेता योजना के नाम और कीमतें 2026-08-27 पर विक्रेताओं के स्वयं के सार्वजनिक मूल्य निर्धारण पृष्ठों से पढ़ी गईं और किसी भी समय बदल सकती हैं - उनके खिलाफ बजट बनाने से पहले स्रोत की जांच करें। स्रोत: Unlayer मूल्य निर्धारण · स्ट्रिपो Plugin. "Not publicly documented" का अर्थ है कि विक्रेता इसे सार्वजनिक रूप से नहीं बताता है। यह दावा नहीं है कि क्षमता अनुपस्थित है।

पूर्ण GrapesJS बनाम Unlayer तुलना पढ़ें

प्लगइन पारिस्थितिकी तंत्र

GJS.Market प्लगइन्स के साथ अपने ईमेल बिल्डर का विस्तार करें

नीचे दी गई प्रत्येक सूची एक वास्तविक उत्पाद है जिसकी कीमत लाइव है। साथ में वे कैनवास के चारों ओर परतों को कवर करते हैं - प्रीसेट, ब्लॉक, भंडारण, संपत्ति और निर्यात।

MJML और प्रीसेट

शुरुआती बिंदु: एक संपादक जो पहले से ही ईमेल के लिए कॉन्फ़िगर किया गया है।

इस श्रेणी को ब्राउज़ करें

MJML

MJML Preset

संपादक में MJML घटक लाता है ताकि कैनवास वेब मार्कअप के बजाय ईमेल मार्कअप का उत्पादन करे।

निःशुल्कप्लगइन देखें

पूर्व निर्धारित

Newsletter Preset

एक न्यूज़लेटर-उन्मुख संपादक कॉन्फ़िगरेशन शुरू करने के लिए जब आपको MJML संकलन चरण की आवश्यकता नहीं होती है।

निःशुल्कप्लगइन देखें

ब्लॉक और टेम्प्लेट

तैयार अनुभाग और उन्हें व्यवस्थित करने के लिए एक टेम्पलेट परत।

इस श्रेणी को ब्राउज़ करें

ब्लॉक

GrapesJS Email Blocky – Premium Responsive Email Blocks

उत्तरदायी ईमेल ब्लॉक का एक प्रीमियम सेट, इसलिए आपका पहला टेम्पलेट एक बिल्ड के बजाय एक व्यवस्था है।

US$69,00प्लगइन देखें

टेम्पलेट्स

Templates Manager

संपादक में एक टेम्पलेट परत जोड़ता है — उन लेआउट को सहेजें, सूचीबद्ध करें और फिर से खोलें जिनसे आपके उपयोगकर्ता शुरू करते हैं।

US$39,00प्लगइन देखें

संपादक एक्सटेंशन

मार्कअप चाहने वाले लोगों के लिए अतिरिक्त संपादन सतह।

इस श्रेणी को ब्राउज़ करें

कोड

Grapesjs Component Code Editor

उन मामलों के लिए प्रति-घटक कोड संपादन जहां किसी को सीधे मार्कअप तक पहुंचने की आवश्यकता होती है।

निःशुल्कप्लगइन देखें

भंडार

प्रोजेक्ट JSON और टेम्पलेट मेटाडेटा को बनाए रखें जहां आप चुनते हैं।

इस श्रेणी को ब्राउज़ करें

भंडार

Grapesjs Firebase Storage

संपादक परियोजनाओं को Firebase तक बना रहता है जब आप पहले भंडारण समापन बिंदु नहीं लिखना चाहते हैं।

निःशुल्कप्लगइन देखें

भंडार

Directus Storage

प्रोजेक्ट को Directus के माध्यम से संग्रहीत करता है, आपके बाकी सामग्री मॉडल के साथ टेम्पलेट रखता है।

निःशुल्कप्लगइन देखें

छवियाँ और अपलोड

ईमेल छवियों को कहीं भी होस्ट किया जाना चाहिए जहां आप नियंत्रित करते हैं।

इस श्रेणी को ब्राउज़ करें

संपत्ति

Grapesjs Cloudinary

छवि चयन को Cloudinary के माध्यम से रूट करता है, इसलिए ईमेल छवियों को आपके खाते के तहत होस्ट और रूपांतरित किया जाता है।

निःशुल्कप्लगइन देखें

अपलोड

Grapesjs Uppy

ईमेल में अपनी खुद की छवियां डालने वाली टीमों के लिए एसेट मैनेजर में अपलोड फ़्लो जोड़ता है.

निःशुल्कप्लगइन देखें

निर्यातित माल

आउटपुट को संपादक से बाहर निकालें और अपनी पाइपलाइन में डालें।

इस श्रेणी को ब्राउज़ करें

निर्यातित माल

Export Zip

संपादक आउटपुट को हैंड-ऑफ या संग्रह के लिए डाउनलोड करने योग्य संग्रह के रूप में निर्यात करता है।

निःशुल्कप्लगइन देखें

सभी ईमेल प्लगइन्स ब्राउज़ करें

अनुशंसित ढेर

आपको जिस ईमेल बिल्डर स्टैक की आवश्यकता है उसका निर्माण करें

ऊपर दी गई लिस्टिंग से चार असेंबली। प्रत्येक एक प्रारंभिक बिंदु है - जब आपके पास एक हो तो अपने स्वयं के कार्यान्वयन के लिए किसी भी परत को स्वैप करें।

मार्केटिंग ईमेल बिल्डर

अभियान और न्यूज़लेटर भेजने के लिए

ड्रैग-एंड-ड्रॉप गाइड देखें

SaaS ईमेल बिल्डर

अपने उत्पाद के अंदर ग्राहक-सामना करने वाले संपादन के लिए

SaaS वास्तुकला देखें

लेन-देन ईमेल संपादक

रसीदों, सूचनाओं और सिस्टम मेल के लिए

टेम्पलेट प्रबंधन देखें

एजेंसी ईमेल बिल्डर

प्रति ग्राहक पुनः प्रयोज्य ब्रांडेड सिस्टम के लिए

कार्यान्वयन सेवाएँ देखें

कीमतें कैटलॉग से लाइव आती हैं और बदल सकती हैं।

टीमें कहां से शुरू होती हैं

तैयार ईमेल से शुरुआत करें

छह आकृतियाँ जो पहले बनाई जाती हैं उनमें से अधिकांश को कवर करती हैं। उन्हें अपनी खुद की ब्लॉक लाइब्रेरी के लिए ब्रीफ के रूप में पढ़ें, कैटलॉग के रूप में नहीं।

स्वागत है

साइनअप के बाद पहला संदेश। एक स्पष्ट अगली कार्रवाई, न्यूनतम क्रोम, और सामग्री जो एक सप्ताह बाद भी समझ में आती है जब यह देर से आग लगती है।

न्यूज़ लैटर

दोहराई जाने वाली संरचना - एक हेडर, कहानियों का एक रन, एक पाद लेख। टेम्पलेट जो पुनः प्रयोज्य ब्लॉकों से सबसे अधिक लाभान्वित होता है, क्योंकि यह हर मुद्दे को फिर से बनाया जाता है।

उत्पाद अद्यतन

फ़ीचर घोषणाएँ और रिलीज़ नोट्स। आमतौर पर एक hero, दो या तीन आइटम ब्लॉक, और उत्पाद में एक लिंक।

प्रोमोशनल

एक मजबूत hero, उत्पाद पंक्तियों और एक प्रमुख कॉल टू एक्शन के साथ ऑफ़र-एलईडी लेआउट। वह टेम्पलेट जिसे आपकी मार्केटिंग टीम सबसे अधिक बार संपादित करना चाहेगी।

लेन-देन

रसीदें, पुष्टिकरण और सूचनाएं। डेटा-भारी, ज्यादातर जनरेटेड, और वह जहां मर्ज टैग और लॉक किए गए क्षेत्र सबसे अधिक मायने रखते हैं।

पुनः सगेयता

निष्क्रिय उपयोगकर्ताओं के लिए विन-बैक संदेश, आमतौर पर वरीयता और सदस्यता समाप्त करने वाले लिंक के साथ सामान्य से अधिक प्रमुखता दी जाती है।

न्यूज़लेटर प्रीसेट ब्राउज़ करें

ये सामान्य ईमेल प्रकारों का विवरण हैं, बिक्री के लिए उत्पाद नहीं। ऊपर दिए गए प्रीसेट में से किसी एक से शुरू करें और उन्हें अपने स्वयं के ब्लॉक के रूप में बनाएं।

आउटपुट स्वरूप

तीन कलाकृतियाँ, तीन नौकरियाँ

केवल HTML को संग्रहीत करना बचने लायक गलती है: यह एक ऐसा प्रतिनिधित्व है जिसे आप फिर से मज़बूती से संपादित नहीं कर सकते।

JSON

परियोजनाओं को स्टोर और पुनर्स्थापित करें

संपादक की अपनी परियोजना की स्थिति। इसे सहेजें ताकि उपयोगकर्ता किसी ईमेल को ठीक उसी तरह फिर से खोल सके जैसे उन्होंने इसे छोड़ा था। यह वह कलाकृति है जो आपका Storage Manager लिखता है।

MJML

संलेखन प्रतिनिधित्व

पठनीय मार्कअप जो कोड की तरह समीक्षा करता है और भिन्न होता है। इसे तब संस्करण करें जब आप ब्लॉब्स के इतिहास के बजाय टेम्पलेट में क्या बदला है इसका इतिहास चाहते हैं।

HTML

आप वास्तव में क्या भेजते हैं

संकलित, तालिका-आधारित और इनलाइनर्ड। इसे अपने भेजने वाले बुनियादी ढांचे को सौंप दें और रिकॉर्ड के लिए आपके द्वारा भेजी गई सटीक प्रति संग्रहीत करें।

output.jsJS

editor.getProjectData();                // JSON - you store this
editor.runCommand('mjml-code');         // MJML - you version this
editor.runCommand('mjml-code-to-html'); // HTML - you send this

तीनों पर कायम रहें। JSON ईमेल को संपादन योग्य रखता है, MJML इसे समीक्षा योग्य रखता है, HTML इसे भेजने योग्य रखता है।

कार्यान्वयन खाका

ईमेल बिल्डर कैसे बनाएं

1
01
Editor
GrapesJS और MJML प्लगइन से शुरू करें। इस बिंदु पर आपके पास एक कार्यशील ईमेल कैनवास है और आप पहले से ही HTML का उत्पादन कर सकते हैं।
2
02
टेम्पलेट्स और ब्लॉक
अपने मौजूदा ईमेल को पुनः उपयोग करने योग्य ब्लॉक में बदलें और तय करें कि उपयोगकर्ता किन क्षेत्रों में बदलाव कर सकते हैं और कौन से लॉक रहेंगे.
3
03
भंडार
Storage Manager को अपने API पर इंगित करें। प्रोजेक्ट JSON प्लस टेम्पलेट मेटाडेटा सहेजें - मालिक, नाम, अपडेट-एट, जो भी आपके उत्पाद की आवश्यकता है।
4
04
पूर्वावलोकन और सत्यापन
समीक्षा के लिए संकलित HTML को रेंडर करें, और डिलीवरी के लिए कुछ भी कतारबद्ध होने से पहले लिंक, चित्र और आवश्यक सामग्री की जांच करें।
5
05
निर्यात और वितरण
HTML तक संकलित करें और इसे अपनी ESP या अपनी स्वयं की प्रेषण सेवा को सौंप दें, फिर परिणामी मेट्रिक्स को अपनी रिपोर्टिंग में वापस फीड करें।

GrapesJS ट्यूटोरियल पढ़ें

चरण 1 और 5 को इस पृष्ठ पर दिए गए पैकेजों द्वारा काफी हद तक हल किया जाता है। चरण 2 से 4 वे हैं जहां आपके उत्पाद की वास्तविक आवश्यकताएं रहती हैं।

जल्दी शुरू

मिनटों में निर्माण शुरू करें

फ्रेमवर्क-न्यूट्रल कोर प्लस आधिकारिक MJML प्लगइन। यदि आप React या Next.js में काम कर रहे हैं, तो फ्रेमवर्क-विशिष्ट सेटअप नीचे लिंक किया गया है।

npm install grapesjs grapesjs-mjml

editor.jsJS

import grapesjs from 'grapesjs';
import grapesjsMjml from 'grapesjs-mjml';
import 'grapesjs/dist/css/grapes.min.css';

// The editor core plus the official MJML plugin. Both BSD-3-Clause.
const editor = grapesjs.init({
  container: '#email-editor',
  fromElement: true,
  plugins: [grapesjsMjml],
  pluginsOpts: {
    [grapesjsMjml]: {
      // Serve the drag-in placeholder from your own CDN, not a third party.
      imagePlaceholderSrc: 'https://cdn.your-app.com/email/placeholder.png',
    },
  },
});

एक बार संपादक माउंट हो जाने के बाद, तीन कमांड आपको तीन कलाकृतियां देते हैं:

export.jsJS

// 1 - the MJML source the editor is currently holding.
const mjml = editor.runCommand('mjml-code');

// 2 - the compiled, table-based, CSS-inlined HTML you actually send.
const { html } = editor.runCommand('mjml-code-to-html');

// 3 - store all three; hand only the HTML to your sending provider.
await fetch(`/api/campaigns/${campaignId}/template`, {
  method: 'PUT',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    project: editor.getProjectData(), // re-openable in the editor
    mjml,                             // diffable source of truth
    html,                             // what your provider receives
  }),
});

यदि आप एक संकलन चरण नहीं चाहते हैं, तो न्यूज़लेटर प्रीसेट पुराना, सरल पथ है - CSS इनलाइनर और कोई MJML के साथ टेबल ब्लॉक:

newsletter.jsJS

import newsletter from 'grapesjs-preset-newsletter';

// The pre-MJML path: table blocks and a CSS inliner, no compile step.
const editor = grapesjs.init({
  container: '#email-editor',
  plugins: [newsletter],
  pluginsOpts: {
    'grapesjs-preset-newsletter': { inlineCss: true },
  },
});

const html = editor.runCommand('gjs-get-inlined-html');

2026-08-27 पर सत्यापित संस्करण: grapesjs 0.23.6, grapesjs-mjml 1.0.8, grapesjs-preset-newsletter 1.0.2।

GrapesJS React के साथ React ईमेल बिल्डर Next.js पेज बिल्डर

बिल्ड बनाम खरीदें

स्क्रैच से एक ईमेल संपादक बनाएं या GrapesJS का उपयोग करें?

सवाल शायद ही कभी होता है कि क्या आप एक संपादक का निर्माण कर सकते हैं। यह है कि एक के कौन से हिस्से आपकी टीम के समय के लायक हैं।

तह	खरोंच से	GrapesJS + GJS.Market
Editor कैनवास	आप इसे बनाते हैं और बनाए रखते हैं	ओपन-सोर्स कोर, BSD-3-Clause
खींचें और छोड़ें	आप इसे बनाते हैं और बनाए रखते हैं	में निर्मित
ईमेल मार्कअप	आप क्लाइंट की विचित्रताओं को हल करते हैं	MJML grapesjs-mjml के माध्यम से
Blocks और घटक	हर ब्लॉक इंजीनियरिंग का काम है	प्लगइन्स, साथ ही एक ही API पर आपका अपना
भंडारण और संपत्ति	आप इसे बनाते हैं और बनाए रखते हैं	प्लगइन्स, या आपका अपना समापन बिंदु
बैकएंड, डेटाबेस और ESP	तुम्हारा	तुम्हारा - अपरिवर्तित
चल रहा रखरखाव	पूरा संपादक	आपके एक्सटेंशन

अपना ईमेल उत्पाद बनाएं - स्क्रैच से कोई अन्य ईमेल संपादक नहीं।

ईमेल प्लगइन्स ब्राउज़ करें

उत्पाद की कीमत

ईमेल संपादन को उत्पाद सुविधा में बदलें

ईमेल संपादन केवल एक इंजीनियरिंग निर्णय नहीं है। यह कहाँ रहता है यह आपके उत्पाद के उपयोग के तरीके को बदल देता है।

कम इंजीनियरिंग अनुरोध

नियमित कॉपी, छवि और लेआउट परिवर्तन टिकट के रूप में आना बंद कर देते हैं, क्योंकि जो लोग उन्हें चाहते हैं वे उन्हें बना सकते हैं।

एक अधिक संपूर्ण उत्पाद

ईमेल निर्माण उपयोगकर्ताओं को एक अलग टूल पर भेजने और फिर से वापस भेजने के बजाय आपके एप्लिकेशन के अंदर रहता है।

प्रीमियम स्तरों के लिए कमरा

उन्नत संपादन, टेम्पलेट लाइब्रेरी या ब्रांड नियंत्रण उच्च योजनाओं पर बैठ सकते हैं, क्योंकि आप किसी और की पुनर्विक्रय के बजाय सुविधा को नियंत्रित करते हैं।

रहने का और कारण

टेम्प्लेट, ब्रांड नियम और इतिहास आपके प्लेटफ़ॉर्म के अंदर जमा हो जाते हैं, जो इसे काम करते रहने के लिए प्राकृतिक स्थान बनाता है।

अनुमानित लागत

आपके विकास और आपके मार्जिन के बीच कोई प्रति-सीट या प्रति-भेजें प्लेटफ़ॉर्म शुल्क नहीं है।

डेटा आपका रहता है

प्राप्तकर्ता, टेम्पलेट और अभियान सामग्री आपके डेटाबेस में रहते हैं, जो अनुपालन उत्तरों और माइग्रेशन दोनों को सरल बनाता है।

ये वे परिणाम हैं जो टीमें बनाती हैं। हम रूपांतरण या समय बचाने वाले आंकड़े प्रकाशित नहीं करते हैं जिन्हें हमने मापा नहीं है।

यह किसके लिए है

उन टीमों के लिए बनाया गया जिन्हें ईमेल संपादन की आवश्यकता है

यह पेज उन लोगों के लिए लिखा गया है जिन्हें यह तय करना है कि ईमेल एडिटिंग खरीदी, किराए पर ली गई है या बनाई गई है।

SaaS संस्थापक

पहले इसके नीचे संपादक के बुनियादी ढांचे को वित्तपोषित किए बिना ईमेल संपादन शिप करें।

सीटीओ और आर्किटेक्ट

डेटा मॉडल, होस्टिंग और वितरण पथ को आपके पास पहले से मौजूद निर्णयों के अंदर रखें।

उत्पाद टीम

ईमेल को एम्बेडेड तृतीय-पक्ष सतह के बजाय अपने स्वयं के UX के साथ एक मूल सुविधा बनाएं।

डेवलपर्स

कस्टम ब्लॉक, घटकों और आदेशों के साथ एक प्रलेखित संपादक API का विस्तार करें।

ईकॉमर्स टीमें

एक ब्लॉक लाइब्रेरी और ब्रांड नियमों के एक सेट से प्रचार और लेन-देन संबंधी ईमेल चलाएं।

एजेंसियों

प्रति सीट प्लेटफ़ॉर्म लागत के बिना प्रति ग्राहक पुनः प्रयोज्य ब्रांडेड ईमेल सिस्टम बनाएं।

कस्टम विकास

एक कस्टम ईमेल बिल्डर की आवश्यकता है?

कस्टम ब्लॉक, एकीकरण, भंडारण, व्हाइट-लेबल UI या एक पूर्ण ईमेल बिल्डर कार्यान्वयन - हम इसे आपके उत्पाद के बजाय इसके आसपास बना सकते हैं।

अपने ईमेल बिल्डर पर चर्चा करें सभी सेवाएं देखें

संबंधित समाधान

कुछ और विशिष्ट खोज रहे हैं?

यह पृष्ठ नींव के रूप में GrapesJS और MJML के बारे में है। ये पड़ोसी प्रश्नों को कवर करते हैं।

FAQ

अक्सर पूछे जाने वाले प्रश्न

शुरू हो जाओ