बिल्डिंग ब्लॉक

आप अपनी वेबसाइट को बिल्डिंग ब्लॉक्स को ड्रैग और ड्रॉप करके डिज़ाइन कर सकते हैं, फिर अपने कॉन्टेंट और लेआउट की ज़रूरतों के मुताबिक उन्हें एडिट करके

बिल्डिंग ब्लॉक जोड़ें

किसी वेबसाइट पेज पर ब्लॉक जोड़ने के लिए, पेज पर ऐक्सेस करें, एडिट पर क्लिक करें, फिर मनचाहे बिल्डिंग ब्लॉक को सही जगह पर ड्रैग और ड्रॉप करें। दो तरह के बिल्डिंग ब्लॉक उपलब्ध हैं: कैटेगरी और इनर कॉन्टेंटइनर कॉन्टेंट बिल्डिंग ब्लॉक सिर्फ़ कैटेगरी बिल्डिंग ब्लॉक के अंदर ही जोड़े जा सकते हैं।

किसी कैटगरी ब्लॉक पर क्लिक करने पर, एक पॉपअप दिखाई देता है, जो आपको प्रत्येक कैटगरी के लिए कई टेम्प्लेट के बीच सेलेक्ट करने की अनुमति देता है।

सलाह

सर्च बार का उपयोग करके इन्सर्ट ए ब्लॉक पॉपअप में किसी विशिष्ट ब्लॉक को खोजें।

पॉप-अप ब्लॉक सिलेक्शन

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

टिप्पणी

  • आप लॉगिन पेज पर भी बिल्डिंग ब्लॉक जोड़ सकते हैं। ऐसा करने के लिए, वेबसाइट के होमपेज पर जाएं, यूआरएल में /web/login जोड़ें और Enter दबाएं।

  • कुछ ब्लॉक तक ऐक्सेस के लिए उनके संबंधित ऐप्लिकेशन या मॉड्यूल को इंस्टॉल करना आवश्यक है (जैसे, प्रॉडक्ट ब्लॉक के लिए ई-कॉमर्स)।

Example

अपने सभी सोशल मीडिया अकाउंट एक जगह इनर कॉन्टेंट सोशल मीडिया ब्लॉक से जोड़ें। मनचाहे प्लेटफ़ॉर्म के आगे स्विच ऑन या ऑफ़ करें और अपना अकाउंट यूआरएल कॉपी/पेस्ट करें।

सोशल मीडिया इनर कॉन्टेंट ब्लॉक

फार्म

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

फ़ॉर्म ब्लॉक का उदाहरण

कार्रवाई

डिफ़ॉल्ट रूप से, जब फ़ॉर्म सबमिट होता है, तो विज़िटर द्वारा दर्ज की गई जानकारी वाला एक ईमेल ऑटोमैटिकली भेजा जाता है। आपके डेटाबेस पर इंस्टॉल किए गए ऐप्लिकेशन के आधार पर, अतिरिक्त ऐक्शन उपलब्ध हो सकते हैं जो ऑटोमैटिकली रिकॉर्ड बना सकते हैं। कोई अलग ऐक्शन चुनने के लिए, Edit पर क्लिक करें, फ़ॉर्म पर क्लिक करें, Style टैब पर जाएं, और इच्छित Action चुनें:

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

फ़ील्ड

फ़ॉर्म में नया फ़ील्ड जोड़ने के लिए, Style टैब पर जाएं और Form या Field सेक्शन के बगल में + Field बटन पर क्लिक करें। फ़ॉर्म पर किसी भी फ़ील्ड में बदलाव करने के लिए, फ़ील्ड चुनें, फिर Style टैब के Field सेक्शन में उपलब्ध ऑप्शन का इस्तेमाल करें। उदाहरण के लिए, आप:

  • फ़ीलड का टाइप बदलें।

    सलाह

    डेटाबेस से किसी मौजूदा फ़ीलड को सिलेक्ट करना और उसमें मौजूद डेटा का इस्तेमाल करना भी संभव है। उपलब्ध फ़ीलड सिलेक्ट किए गए ऐक्शन पर निर्भर करते हैं। डेटाबेस में जोड़ी गई प्रॉपर्टी फ़ीलड का भी इस्तेमाल किया जा सकता है।

    सभी तरह की फ़ॉर्म फ़ीलड

    कुछ फ़ीलड देखने में एक जैसी होती हैं, लेकिन दर्ज किया गया डेटा किसी खास फ़ॉर्मैट में होना चाहिए।

  • फ़ीलड के लेबल को बदलाव करें और उसकी Position को एडजस्ट करें।

  • किसी फ़ील्ड का Description एनेबल करें। स्विच ऑन करें और इसे बदलने के लिए फ़ॉर्म पर डिफ़ॉल्ट डिस्क्रिप्शन पर क्लिक करें।

  • प्लेसहोल्डर या डिफ़ॉल्ट वैल्यू जोड़ें।

  • बताएं कि क्या फ़ीलड Required है।

  • फ़ीलड की विज़िबिलिटी सेटिंग को बदलाव करें।

  • एनिमेशन जोड़ें।

जब आप वांछित बदलाव कर लें, तो सेव करें पर क्लिक करें।

गैर-Odoo वेबसाइट पर Odoo संपर्क फ़ॉर्म जोड़ें

आप iframe का उपयोग करके किसी अन्य वेबसाइट पर Odoo संपर्क फ़ॉर्म प्रदर्शित कर सकते हैं। ऐसा करने के लिए, इन चरणों का पालन करें:

  1. Prepare the Odoo form: Create a contact form on a page in Odoo Website and remove the header and footer. Make sure only the contact form remains on the page.

  2. एम्बेड करने योग्य कोड जनरेट करें: Odoo फ़ॉर्म पेज का यूआरएल कॉपी करें और इसे iframe जनरेटर में पेस्ट करें, जैसे La Digitale.dev या iFrame Generator। उचित प्रदर्शन के लिए चौड़ाई और ऊंचाई को समायोजित करें।

  3. गैर-Odoo वेबसाइट में एम्बेडेड कोड जोड़ें: संबंधित पेज का एचटीएमएल खोलें (कोड एडिटर या सीएमएस में) और एम्बेडेड कोड को वहां डालें जहां फ़ॉर्म प्रदर्शित होना चाहिए।

Example

एम्बेडेड कोड का उदाहरण:

<iframe src="https://example.com/odoo-form"
        style="border:0;"
        name="odooForm"
        scrolling="no"
        frameborder="0"
        marginheight="0"
        marginwidth="0"
        height="400px"
        width="600px"
        allowfullscreen>
 </iframe>

कोड एम्बेड करें

कोड एम्बेड करने से आप थर्ड-पार्टी सर्विस के कॉन्टेंट को पेज में इंटीग्रेट कर सकते हैं, जैसे YouTube से वीडियो, Google Maps से मैप, Instagram से सोशल मीडिया पोस्ट, आदि।

Inner Content सेक्शन से Embed Code ब्लॉक को ड्रैग करके पेज में ड्रॉप करने के बाद, ब्लॉक पर क्लिक करें, फिर Style टैब पर जाएं और Edit पर क्लिक करें। प्लेसहोल्डर कोड को अपने कस्टम embed कोड से बदलें।

जिस एम्बेडेड कोड को आप पॉइंट करना चाहते हैं, उसका लिंक जोड़ें

चेतावनी

जिस कोड को आप समझते नहीं हैं उसे कॉपी/पेस्ट न करें, क्योंकि यह आपके डेटा को जोखिम में डाल सकता है।

बिल्डिंग ब्लॉक को मूव, स्विच, डुप्लीकेट या मिटाएं

ब्लॉक के ऊपर या नीचे की जगह को कम या बढ़ाने के लिए ब्लॉक पर फ़िरोज़ी बॉर्डर को खींचें।

(chevron up) या (chevron down) पर क्लिक करके ब्लॉक का ऑर्डर बदलें और (arrows) पर क्लिक करके ब्लॉक को पेज पर मूव करें। जब आपके पास एकाधिक कॉलम हों, तो (chevron left) या (chevron right) पर क्लिक करके किसी कॉलम को बाएं या दाएं मूव करें।

किसी बिल्डिंग ब्लॉक को डुप्लीकेट करने के लिए, (duplicate) पर क्लिक करें। डुप्लीकेट होने के बाद, नया ब्लॉक ओरिजिनल के नीचे पेज पर दिखाई देता है।

सलाह

वैकल्पिक रूप से, चुने गए ब्लॉक को डुप्लीकेट करने के लिए Style टैब के ऊपर (duplicate) आइकॉन पर क्लिक करें।

ब्लॉक को मिटाने के लिए, (ट्रैश) पर क्लिक करें।

बिल्डिंग ब्लॉक पर मार्जिन बढ़ाएं

बिल्डिंग ब्लॉक को बदलाव करें

बिल्डिंग ब्लॉक के कॉन्टेंट में बदलाव करने के लिए, इस पर क्लिक करें और Style टैब पर जाएं। उपलब्ध कस्टमाइज़ेशन ऑप्शन चुने गए ब्लॉक के टाइप के आधार पर अलग-अलग होते हैं।

इतिहास

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

सलाह

  • Send to back या Bring to front आइकॉन का उपयोग करके किसी एलिमेंट (इमेज, टेक्स्ट, आदि) को दूसरे एलिमेंट के पीछे या सामने पोज़िशन करें।

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

    ब्लॉक साइज़ एडैप्ट करें

यह भी देखें

जनरल थीम

लेआउट: ग्रिड और कॉलम

ज़्यादातर बिल्डिंग ब्लॉक के लिए, आप दो लेआउट स्टाइल में से चुन सकते हैं: grid या columns (cols)। डिफ़ॉल्ट लेआउट स्टाइल बदलने के लिए, ब्लॉक पर क्लिक करें, Style टैब पर जाएं, और Layout फ़ील्ड को Grid या Cols पर सेट करें।

ग्रिड

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

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

कॉल्स

Cols लेआउट चुनने से आप ब्लॉक के भीतर प्रति लाइन एलिमेंट की संख्या निर्धारित कर सकते हैं। ऐसा करने के लिए, बदलने के लिए ब्लॉक चुनें, Cols फ़ील्ड के बगल में ड्रॉपडाउन पर क्लिक करें, और संख्या एडजस्ट करें। फिर आप Style टैब के Column सेक्शन में ऑप्शन का इस्तेमाल करके किसी विशिष्ट कॉलम की सेटिंग में बदलाव कर सकते हैं।

टिप्पणी

डिफ़ॉल्ट रूप से, मोबाइल डिवाइस पर, प्रति लाइन केवल एक एलिमेंट (कॉलम) विज़िबल होता है ताकि यह सुनिश्चित हो सके कि छोटी स्क्रीन पर कॉन्टेंट आसानी से पढ़ने योग्य और एक्सेसिबल रहे। वैल्यू एडजस्ट करने के लिए, वेबसाइट एडिटर के टॉप पर (मोबाइल आइकॉन) पर क्लिक करें और कॉलम की संख्या एडैप्ट करें। शेप्स डिफ़ॉल्ट रूप से मोबाइल पर हिडन होते हैं।

कस्टम बिल्डिंग ब्लॉक सेव करें

आप कस्टमाइज़ किए गए बिल्डिंग ब्लॉक को कहीं और फिर से इस्तेमाल करने के लिए सेव कर सकते हैं। ऐसा करने के लिए, इसे चुनें, Style टैब पर जाएं, और (floppy disk) आइकॉन पर क्लिक करें। अपने कस्टम ब्लॉक को सेव करने की पुष्टि करने के लिए पॉपअप में Save बटन पर क्लिक करें।

पेज पर सेव किए गए बिल्डिंग ब्लॉक को जोड़ने के लिए, ब्लॉक्स टैब पर नेविगेट करें और कैटेगरी सेक्शन से कस्टम ब्लॉक को ड्रैग और ड्रॉप करें। खुलने वाले पॉपअप में, कस्टम कैटेगरी में डिज़ायर्ड ब्लॉक पर क्लिक करें।

सलाह

इन्सर्ट अ ब्लॉक पॉपअप में, कस्टम ब्लॉक को रीनेम करने के लिए (बदलाव करें) पर क्लिक करें या इसे मिटाने के लिए (मिटाएं) पर क्लिक करें।