पेजकिट - स्व-होस्टेड GrapesJS साइट बिल्डर, स्रोत के रूप में बेचा गया। जल्दी पहुंच प्राप्त करें

तेजी से उत्पादन के लिए जहाज: GrapesJS Shadcn में नया क्या है

अपने पेज बिल्डर को सुपरचार्ज करें! GrapesJS Shadcn तेजी से प्रोड करने के लिए शिप करने के लिए लाइव ड्रैग पूर्वावलोकन, रिच टेक्स्ट/कमांड, डायनेमिक डेटा और कैनवास प्रीसेट जोड़ता है।

Blocomposer
Blocomposer
11 जून 2026 • 4 महीने पहले
4 मिनट लाल1,856 दृश्य
एक विज़ुअल पेज बिल्डर का निर्माण आपको अपने मुख्य उत्पाद को परिष्कृत करने के बजाय संपादक यूआई को पिक्सेल-पुश करने में सप्ताह बिताने में धोखा दे सकता है। GrapesJS हुड के नीचे भारी उठाने को संभालता है, और हमारा GrapesJS Shadcn रैपर बॉक्स के ठीक बाहर उस पॉलिश, पेशेवर लुक प्रदान करता है।
हमारी नवीनतम रिलीज़ पूरी तरह से विकास घर्षण को दूर करने, उपयोगकर्ता अनुभव को चमकाने और संपादक को शक्तिशाली, डेटा-संचालित सुविधाओं के साथ पैक करने पर केंद्रित है। यहां नया क्या है इसका विवरण दिया गया है।

उत्पादन गति के लिए निर्मित

हमने निर्बाध वर्कफ़्लो सुनिश्चित करने के लिए पूरे कार्यक्षेत्र में विभिन्न बग फिक्स और UI/UX सुधार लागू किए हैं।

यह रिलीज एक मुख्य लक्ष्य पर लेजर-केंद्रित है: उपयोगकर्ताओं को जल्दी से उत्पादन के लिए प्राप्त करना। आपको एक खाली स्लेट के साथ छोड़ने के बजाय, हमने समझदार प्रीसेट और यूआई लेआउट पैटर्न में बेक किया है जो हमने टेम्पलेट-आधारित संपादकों के निर्माण के वर्षों में वास्तविक दुनिया के यूएक्स में सुधार पाया है।

स्मार्ट टेक्स्ट एडिटिंग और मैथ फॉर्मूला

रिच टेक्स्ट एडिटर (आरटीई) को दो बड़े पैमाने पर कार्यक्षमता उन्नयन प्राप्त हुए:

KaTeX एकीकरण: 

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

Katex formulasवेरिएबल इंसर्ट कमांड: 

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

Text variable

गतिशील डेटा स्रोत और चयनकर्ता सुधार

डिज़ाइन को डेटा से जोड़ना अब बहुत अधिक मजबूत है:

  • चयनकर्ता स्थिरता: हमने सीएसएस चयनकर्ताओं का नाम बदलने से संबंधित विरासत मुद्दों को ठीक कर दिया है, यह सुनिश्चित करते हुए कि लेआउट परिवर्तन के दौरान आपका डिज़ाइन सिस्टम टूट न जाए।

  • डेटा-बाउंड गुण: लक्षण और शैलियाँ अब सीधे डेटासोर्स मानों से जुड़ सकती हैं। आप सक्रिय डेटासेट के आधार पर घटक विशेषताओं (जैसे छवि URL या पाठ संरेखण) को गतिशील रूप से मैप कर सकते हैं।
    Data bound properties

घटक ड्रैगिंग और कस्टम ब्लॉक

हमने पूरी तरह से फिर से तैयार किया कि ब्लॉक कैनवास के साथ कैसे इंटरैक्ट करते हैं:

  • समझदार डिफ़ॉल्ट: नए कस्टम डिफ़ॉल्ट ब्लॉक पूर्वानुमानित खाली राज्यों, पूर्व-कॉन्फ़िगर किए गए लक्षणों और सबसे प्रासंगिक शैली गुणों से सुसज्जित हैं।

  • विज़ुअल ड्रैग पूर्वावलोकन: अब अंधा खींचना नहीं। जैसे ही आप साइड पैनल से किसी घटक को कैनवास पर खींचते हैं, आपको उस तत्व का एक लाइव पूर्वावलोकन दिखाई देगा जहां वह उतरने वाला है।

उन्नत चार्ट, टेबल और कस्टम चयन

हमारे ढांचे की गहरी क्षमताओं को प्रदर्शित करने के लिए, हमने कस्टम कैनवास स्पॉट और लक्षणों के शीर्ष पर निर्मित दो प्रमुख घटक पेश किए हैं:


चार्ट घटक: 

पृष्ठ लेआउट में सीधे डेटा को विज़ुअल रूप से प्लॉट करें।

Charts

तालिका घटक: 

सहजता से संरचित पंक्तियों और स्तंभों का निर्माण करें।

Table component

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

कैनवास स्पॉट के साथ बिजली की तेजी से इमारत

हम दोहराए जाने वाले ड्रैग-एंड-ड्रॉप क्रियाओं को कम करना चाहते हैं। यह अपडेट प्रासंगिक कैनवास स्पॉट पेश करता है जो आपको चयनित तत्व से पहले या बाद में घटकों को तुरंत जोड़ने के लिए क्लिक करने देता है।

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

Canvas spots

विजुअल पॉलिश और बेहतर आइकन

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

इसे आज़माने के लिए तैयार हैं? नवीनतम संस्करण यहां प्राप्त करें

प्रकाशित 11 जून 2026
अपडेट किया गया 17 अक्टूबर 2026
🔌 GJS.Market

GrapesJS प्लगइन्स खोज रहे हैं?

100 से अधिक क्यूरेटेड प्लगइन्स, प्रीसेट और टेम्प्लेट - गुणवत्ता के लिए हाथ से चुने गए और समुदाय द्वारा बनाए रखे गए।

इस पोस्ट को शेयर करेंTwitterFacebookLinkedIn
के माध्यम से प्रकाशित
Blocomposer
Blocomposer
दुकान → पर जाएँ

Blocomposer से अधिक

अन्य ज्ञानवर्धक पोस्ट खोजें और नवीनतम सामग्री से अपडेट रहें।

सभी पोस्ट देखें

Blocomposer से प्रीमियम प्लगइन्स

इस निर्माता द्वारा तैयार किए गए हाथ से चुने गए भुगतान किए गए परिवर्धन।

दुकान → पर जाएँ