Wix प्रो गैलरी: अपनी गैलरी डिज़ाइन करना
10 मिनट
कुछ डिज़ाइन कस्टमाइज़ेशन जोड़कर अपनी गैलरी को अपनी साइट पर सबसे अलग बनाएँ। आप लेआउट, कलर, फ़ॉन्ट और बहुत कुछ कस्टमाइज़ करके अपनी गैलरी को एक प्रोफेशनल टच दे सकते हैं।
अपनी प्रो गैलरी के डिज़ाइन को कस्टमाइज़ करने के लिए:
- अपने एडिटर पर जाएँ।
- अपने पेज पर प्रो गैलरी एलिमेंट पर क्लिक करें।
- Settings पर क्लिक करें।
- Design टैब पर क्लिक करें।
- चुनें कि आप क्या कस्टमाइज़ करना चाहते हैं:
ओवरले और आइकन्स
ओवरले इमेज के ऊपर रहता है और जब आप अपने माउस से इमेज पर होवर करते हैं, तो यह एक एक्स्ट्रा इफेक्ट जोड़ता है। आप इस इफेक्ट के साथ-साथ अपने किसी भी आइकन को कस्टमाइज़ कर सकते हैं।
- Overlay & Icons पर क्लिक करें।
- Full या Partial ओवरले में से चुनें और उपलब्ध विकल्पों का उपयोग करके कस्टमाइज़ करें:
- Full Overlay: ओवरले पूरी गैलरी आइटम को कवर करता है।
- Gradient: ग्रेडिएंट ओवरले को इनेबल करने के लिए टॉगल पर क्लिक करें।
- Color & Opacity 1 and 2: ग्रेडिएंट के रंगों को कस्टमाइज़ करने के लिए संबंधित कलर बॉक्स पर क्लिक करें। फिर रंगों की ओपेसिटी (पारदर्शिता) को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।
- Gradient Direction: ग्रेडिएंट की ओवरले दिशा को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।
- Icon Color: होवर करने पर दिखाई देने वाले गैलरी आइकन का रंग बदलने के लिए कलर बॉक्स पर क्लिक करें।
- Color overlay: रंग चुनने के लिए कलर बॉक्स पर क्लिक करें। फिर कलर ओवरले की ट्रांसपेरेंसी बदलने के लिए स्लाइडर को ड्रैग करें।
- Icon color: कलर बॉक्स पर क्लिक करें और अपने गैलरी आइकन के लिए एक नया रंग चुनें।

- Gradient: ग्रेडिएंट ओवरले को इनेबल करने के लिए टॉगल पर क्लिक करें।
- Partial Overlay: ओवरले गैलरी आइटम के केवल एक हिस्से को कवर करता है।
- Set size in: अपने ओवरले के साइज को प्रतिशत या पिक्सेल में मैनेज करें।
- Size: ओवरले साइज चुनने के लिए स्लाइडर को ड्रैग करें या वैल्यू दर्ज करें।
- Overlay starts from: चुनें कि आपका ओवरले कहाँ स्थित है।
- Padding: गैलरी बॉर्डर और आपके ओवरले के बीच की जगह को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।
- Gradient: ग्रेडिएंट ओवरले को इनेबल करने के लिए टॉगल पर क्लिक करें।
- Color & Opacity 1 and 2: ग्रेडिएंट के रंगों को कस्टमाइज़ करने के लिए संबंधित कलर बॉक्स पर क्लिक करें। फिर रंगों की ओपेसिटी को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।
- Gradient Direction: ग्रेडिएंट की ओवरले दिशा को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।
- Icon Color: होवर करने पर दिखाई देने वाले गैलरी आइकन का रंग बदलने के लिए कलर बॉक्स पर क्लिक करें।
- Color overlay: रंग चुनने के लिए कलर बॉक्स पर क्लिक करें। फिर कलर ओवरले की ट्रांसपेरेंसी बदलने के लिए स्लाइडर को ड्रैग करें।
- Icon color: कलर बॉक्स पर क्लिक करें और अपने गैलरी आइकन के लिए एक नया रंग चुनें।

- Full Overlay: ओवरले पूरी गैलरी आइटम को कवर करता है।
- उपलब्ध विकल्पों में से एक ओवरले इफेक्ट चुनें:
- No effect: ओवरले कोई इफेक्ट लागू नहीं करता है।
- Fade in: होवर करने पर ओवरले धीरे-धीरे दिखाई देता है।
- Expand: होवर करने पर ओवरले फैलता है।
- Slide up: होवर करने पर ओवरले ऊपर की ओर स्लाइड करता है।
- Slide right: होवर करने पर ओवरले दाईं ओर स्लाइड करता है।
टेक्स्ट
आप टाइटल और डिस्क्रिप्शन टेक्स्ट के डिज़ाइन को कस्टमाइज़ कर सकते हैं, बशर्ते आपने उन्हें Layout टैब पर डिस्प्ले करने के लिए चुना हो। यदि आपको Texts विकल्प (नीचे स्टेप 1) नहीं दिखते हैं, तो Layout टैब पर जाएँ, Customize Layout पर क्लिक करें और उन्हें डिस्प्ले करने के लिए Title और Description के बगल वाले चेकबॉक्स चुनें।
- Texts पर क्लिक करें।
- नीचे दिए गए विकल्पों का उपयोग करके टेक्स्ट कस्टमाइज़ करें:
- डिस्प्ले करने के लिए जानकारी: उस जानकारी के बगल वाले चेकबॉक्स को चुनें जिसे आप डिस्प्ले करना चाहते हैं (टाइटल, डिस्क्रिप्शन, स्लाइड शो काउंटर)।
नोट: स्लाइड शो काउंटर विकल्प केवल स्लाइड शो लेआउट में उपलब्ध है यदि आपने स्लाइड ऑटोमैटिकली इनेबल किया है।

- टाइटल स्टाइल और कलर: टाइटल टेक्स्ट का फ़ॉन्ट और कलर चुनें।
- डिस्क्रिप्शन फ़ॉन्ट स्टाइल और कलर: डिस्क्रिप्शन टेक्स्ट का फ़ॉन्ट और कलर चुनें।
- हॉरिजॉन्टल एलाइनमेंट: हॉरिजॉन्टल टेक्स्ट को बाईं ओर, बीच में या दाईं ओर एलाइन करना चुनें।
- वर्टिकल एलाइनमेंट: वर्टिकल टेक्स्ट को बाईं ओर, बीच में या दाईं ओर एलाइन करना चुनें।
- टेक्स्ट वर्टिकल पैडिंग: वर्टिकल टेक्स्ट और बॉर्डर के बीच की जगह बदलने के लिए स्लाइडर को ड्रैग करें।
- टेक्स्ट हॉरिजॉन्टल पैडिंग: हॉरिजॉन्टल टेक्स्ट और बॉर्डर के बीच की जगह बदलने के लिए स्लाइडर को ड्रैग करें।

- डिस्प्ले करने के लिए जानकारी: उस जानकारी के बगल वाले चेकबॉक्स को चुनें जिसे आप डिस्प्ले करना चाहते हैं (टाइटल, डिस्क्रिप्शन, स्लाइड शो काउंटर)।
बटन
यह सेक्शन तब दिखाई देगा यदि आपने Layout टैब में Load More बटन दिखाने का विकल्प चुना है।
यहाँ आप Load more बटन का टेक्स्ट, फ़ॉन्ट, कलर और बॉर्डर रेडियस बदल सकते हैं।
यहाँ आप Load more बटन का टेक्स्ट, फ़ॉन्ट, कलर और बॉर्डर रेडियस बदल सकते हैं।
- Buttons पर क्लिक करें।
- नीचे दिए गए विकल्पों का उपयोग करके बटन कस्टमाइज़ करें:
- बटन टेक्स्ट: वह टेक्स्ट दर्ज करें जो बटन पर दिखाई देता है।
- फ़ॉन्ट स्टाइल और कलर: बटन का फ़ॉन्ट और कलर चुनें।
- बटन कलर और ओपेसिटी: बटन का कलर और ओपेसिटी बदलने के लिए स्लाइडर को ड्रैग करें और कलर चुनने के लिए कलर बॉक्स पर क्लिक करें।
- बॉर्डर की चौड़ाई और कलर: बॉर्डर की चौड़ाई बदलने के लिए स्लाइडर को ड्रैग करें और कलर चुनने के लिए कलर बॉक्स पर क्लिक करें।
- कॉर्नर रेडियस: कॉर्नर रेडियस बदलने के लिए स्लाइडर को ड्रैग करें।

नेविगेशन एरो
आप थंबनेल्स, स्लाइडर, स्लाइडशो और कॉलम लेआउट में नेविगेशन एरो (तीर) इनेबल कर सकते हैं। आप उनकी पोजीशन, साइज और कलर को कस्टमाइज़ कर सकते हैं ताकि आपके साइट विज़िटर्स आसानी से आपकी गैलरी देख सकें।
- Navigation Arrows पर क्लिक करें।
- अपनी गैलरी पर एरो इनेबल करने के लिए टॉगल पर क्लिक करें।
- इन ऑप्शन्स का इस्तेमाल करके एरो को कस्टमाइज़ करें:
- Arrow style: एरो डिज़ाइन चुनने के लिए क्लिक करें, या अपना खुद का डिज़ाइन अपलोड करने के लिए ऐड आइकन
पर क्लिक करें। - Arrow background: शैडो, बॉक्स या कोई बैकग्राउंड नहीं चुनने के लिए ड्रॉप-डाउन पर क्लिक करें।
- Shadow: एरो के चारों ओर एक हल्की शैडो जोड़ता है।
- Box: एरो के चारों ओर एक बॉक्स जोड़ता है। बॉक्स का रंग बदलने के लिए कलर बॉक्स पर क्लिक करें, और इसकी ट्रांसपेरेंसी और कोनों को राउंड करने के लिए संबंधित स्लाइडर्स को ड्रैग करें।
- None: एरो में कोई बैकग्राउंड नहीं जोड़ा जाता है।
- Arrow size: नेविगेशन एरो का साइज बढ़ाने या घटाने के लिए स्लाइडर को ड्रैग करें।
- Arrow color: नेविगेशन एरो का रंग चुनने के लिए कलर बॉक्स पर क्लिक करें। अपनी साइट के रंगों में से कोई रंग चुनें या अपना खुद का रंग चुनें।
- Arrow position: गैलरी के ऊपर या बाहर नेविगेशन एरो दिखाने के लिए संबंधित चेकबॉक्स चुनें। नोट: अपनी गैलरी पर नेविगेशन एरो दिखाने से आपके गैलरी आइटम्स का कुछ हिस्सा ढक सकता है।
- Center arrows to: अपने एरो को गैलरी, उसकी इमेज या टेक्स्ट के किसी भी तरफ सेंटर में रखने के लिए चुनें।
- Horizontal Padding: अपने एरो और गैलरी के बॉर्डर के बीच की जगह को एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।

- Arrow style: एरो डिज़ाइन चुनने के लिए क्लिक करें, या अपना खुद का डिज़ाइन अपलोड करने के लिए ऐड आइकन
आइटम स्टाइल
गैलरी में प्रत्येक इमेज या वीडियो एक आइटम है। आप रेगुलर और होवर दोनों मोड के लिए आइटम का लुक बदल सकते हैं।
- Item Style पर क्लिक करें।
- Item Style के तहत आइटम के रेगुलर व्यू को कस्टमाइज़ करें:
- Border width & color: बॉर्डर की चौड़ाई बदलने के लिए स्लाइडर को ड्रैग करें और रंग चुनने के लिए कलर बॉक्स पर क्लिक करें।
- Corner radius: कोनों को अधिक गोल या चौकोर बनाने के लिए स्लाइडर को ड्रैग करें।
नोट: Border width & color और Corner radius विकल्प केवल तभी उपलब्ध होते हैं जब आप अपने लेआउट की सेटिंग्स में अपने थंबनेल को क्रॉप करना चुनते हैं और यह केवल मुख्य इमेज पर लागू होते हैं (थंबनेल पर नहीं)।

- Shadow: शैडो को इनेबल या डिसेबल करने के लिए टॉगल पर क्लिक करें:
- Enabled: गैलरी आइटम के चारों ओर एक शैडो है। ओपेसिटी, कलर, ब्लर, शैडो की दिशा और शैडो साइज को कस्टमाइज़ करें।
- Disabled: गैलरी आइटम के चारों ओर कोई शैडो नहीं है।
- चुनें कि क्या होता है जब कोई अपने माउस से गैलरी आइटम पर होवर करता है:
- No effect: होवर पर कोई इफेक्ट लागू नहीं होता है।
- Zoom in: होवर करने पर इमेज ज़ूम इन होती है।
- Blur: होवर करने पर इमेज ब्लर हो जाती है।
- Grayscale: होवर करने पर इमेज ब्लैक एंड व्हाइट हो जाती है।
- Shrink: होवर करने पर इमेज छोटी हो जाती है।
- Invert: होवर करने पर इमेज का रंग उल्टा (इनवर्ट) हो जाता है।
- Color in: होवर करने पर इमेज ब्लैक एंड व्हाइट से रंगीन हो जाती है।
- Darken: होवर करने पर इमेज थोड़ी डार्क हो जाती है।
- चुनें कि इमेज लोड होने के दौरान क्या होता है:
- Blurred image: लोड होने के दौरान इमेज का एक ब्लर वर्जन दिखाई देता है।
- Color placeholder: इमेज लोड होने के दौरान एक रंगीन प्लेसहोल्डर दिखाई देता है।

स्क्रॉल / स्लाइड एनिमेशन
एक एनिमेटेड इफेक्ट जोड़ें जो तब दिखाई देता है जब विज़िटर आपकी गैलरी को स्क्रॉल करते हैं। आप ट्रांज़िशन स्टाइल जोड़कर और उसकी अवधि (ड्यूरेशन) को एडजस्ट करके अपने चुने हुए एनीमेशन को और अधिक कस्टमाइज़ कर सकते हैं।
नोट्स:
- उपलब्ध एनिमेशन आपके द्वारा चुने गए गैलरी लेआउट पर निर्भर करते हैं।
- एनीमेशन सेटिंग्स का कस्टमाइज़ेशन केवल horizontal scroll वाले लेआउट में उपलब्ध है।
स्क्रॉल एनीमेशन जोड़ना:
- Scroll Animations पर क्लिक करें।
- चुनें कि जब विज़िटर आपकी गैलरी को स्क्रॉल करते हैं तो क्या होता है:
- No effect: स्क्रॉल पर कोई इफेक्ट लागू नहीं होता है।
- Fade in: स्क्रॉल के दौरान इमेज धीरे-धीरे दिखाई देती हैं।
- Grayscale: स्क्रॉल करते समय इमेज ब्लैक एंड व्हाइट हो जाती है।
- Slide up: स्क्रॉल करते समय इमेज ऊपर की ओर स्लाइड करती है।
- Expand: स्क्रॉल करते समय इमेज बड़ी हो जाती है।
- Shrink: स्क्रॉल करते समय इमेज छोटी हो जाती है।
- Zoom out: स्क्रॉल करते समय इमेज ज़ूम आउट होती है।
- One color: स्क्रॉल करते समय इमेज पर एक ही रंग लागू होता है।

अपने एनीमेशन को कस्टमाइज़ करना:
- Customize Animations पर क्लिक करें।
- अपनी एनीमेशन सेटिंग्स को अपनी ज़रूरत के अनुसार बदलें:
- Transition style: अपने गैलरी आइटम पर मोशन इफेक्ट लागू करने के लिए ड्रॉप-डाउन पर क्लिक करें। यह इफेक्ट स्क्रॉल करने पर लागू होता है, जैसे-जैसे विज़िटर एक आइटम से दूसरे आइटम पर जाते हैं।
- Duration: आपका एनीमेशन कितने समय तक चलता है, इसे एडजस्ट करने के लिए स्लाइडर को ड्रैग करें।

एक्सपैंड मोड
यह सेक्शन तब दिखाई देता है जब किसी यूजर द्वारा गैलरी आइटम पर क्लिक करने पर आपने प्रो गैलरी के सेटिंग्स पैनल में "Open in Expand Mode" चुना हो। यहाँ से आप अपनी गैलरी के एक्सपैंड मोड को अपनी साइट के डिज़ाइन और ब्रांड के अनुरूप कस्टमाइज़ कर सकते हैं।
- Expand Mode पर क्लिक करें।
- Customize Expand Mode पर क्लिक करें और नीचे दिए गए ऑप्शंस का इस्तेमाल करके गैलरी के एक्सपैंड मोड को पर्सनलाइज़ करें:
- What info is shown? (कौन सी जानकारी दिखाई जाए?): टाइटल, डिस्क्रिप्शन और/या लिंक दिखाने का चुनाव करें।
- Where does it appear? (यह कहाँ दिखाई देता है?): चुनें कि आप जानकारी को कहाँ रखना चाहते हैं:
- Side (साइड): जानकारी गैलरी आइटम के दाईं ओर दिखाई देती है।
- Bottom (नीचे): जानकारी गैलरी आइटम के नीचे दिखाई देती है।
- When does it show? (यह कब दिखाई देता है?): चुनें कि जानकारी कब दिखाई दे:
- Always (हमेशा): जानकारी हमेशा दिखाई देती है।
- When clicking info icon (इन्फो आइकन पर क्लिक करने पर): जानकारी केवल तब दिखाई देती है जब कोई विजिटर एक्सपैंड मोड के ऊपरी बाएं कोने में इन्फो आइकन पर क्लिक करता है।
- Allow full screen (फुल स्क्रीन की अनुमति दें): विजिटर्स को गैलरी आइटम्स को फुल-स्क्रीन मोड में देखने की अनुमति देने का विकल्प चुनें।
- Background color (बैकग्राउंड कलर): एक्सपैंड मोड के लिए बैकग्राउंड कलर चुनने के लिए कलर बॉक्स पर क्लिक करें। अपनी साइट के कलर्स में से चुनें या कोई नया कलर जोड़ें।
- Icon color (आइकन कलर): एक्सपैंड मोड में आइकन के लिए कलर चुनने के लिए कलर बॉक्स पर क्लिक करें। अपनी साइट के कलर्स में से चुनें या कोई नया कलर जोड़ें।
- Title style (टाइटल स्टाइल):
- Font Picker से फॉन्ट, स्टाइल और साइज को कस्टमाइज़ करने के लिए ड्रॉप-डाउन मेनू पर क्लिक करें।
- टाइटल के टेक्स्ट का कलर बदलने के लिए कलर बॉक्स पर क्लिक करें।
- Description style (डिस्क्रिप्शन स्टाइल):
- Font Picker से फॉन्ट, स्टाइल और साइज को कस्टमाइज़ करने के लिए ड्रॉप-डाउन मेनू पर क्लिक करें।
- डिस्क्रिप्शन के टेक्स्ट का कलर बदलने के लिए कलर बॉक्स पर क्लिक करें।
- Text alignment (टेक्स्ट एलाइनमेंट): टेक्स्ट का एलाइनमेंट चुनें: लेफ्ट (बाएं), सेंटर (बीच में) या राइट (दाएं)।

क्या इससे मदद मिली?
|

