Drupal/C3/Controlling-Display-of-Images/Hindi

From Script | Spoken-Tutorial
Revision as of 13:03, 2 September 2016 by Shruti arya (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search
Time Narration
00:01 Controlling Display of Images पर स्पोकन ट्यूटोरियल में आपका स्वागत है।
00:06 इस ट्यूटोरियल में हम Image styles और photo gallery view के बारे में सीखेंगे।
00:12 इस ट्यूटोरियल को रिकॉर्ड करने के लिए मैं उपोयग कर रही हूँ
  • उबंटु ऑपरेटिंग सिस्टम
  • Drupal 8 और
  • Firefox वेब ब्राउजर
00:21 आप अपने पसंद का कोई भी वेब ब्राउजर उपयोग कर सकते हैं।
00:25 अपनी वेबसाइट को खोलें जिसे हमने पहले ही बनाया है।
00:29 Drupal में, site की आवश्यकता अनुसार हम इमैज के साइज और स्केल को बदल सकते हैं।
00:37 Drupal मूल इमैज लेता है और हमारे अनुसार इसका साइज औऱ स्केल बदलता है।
00:43 फिर, फाइल के इस वर्जन को सेव करता है।
00:46 Configuration पर क्लिक करें।
00:48 हम यहाँ 2 image styles बनाने जा रहे हैं।
00:51 नीचे स्क्रोल करें और MEDIA tab. पर जाएँ।
00:54 यहाँ हम Image Styles देख सकते हैं इस पर क्लिक करें।
00:58 हम table के लिए Image style बनायेंगे जिसे हमने सेट किया है।
01:03 और अगले view के लिए भी जिसे हम बनाने जा रहे हैं जो कि logos का ग्रिड है।
01:09 Add image styles. पर क्लिक करें।
01:12 Image style name, में, हम टाइप करेंगे "Upcoming Events 150 x 150".
01:19 ध्यान दें कि Drupal हमारे लिए मशीन का नाम भरता है।
01:23 यह हमारा Image style name.' है।
01:26 अब Create new style पर क्लिक करें।
01:29 बाईं ओर, मूल इमैज है 600 by 800 pixels है और इमैज का एडिट किया हुआ वर्जन दाईं ओर है।
01:38 EFFECT में, Select a new effect ड्रॉपडाउन में क्लिक करें।
01:42 इस सूची में कई ऑप्शन्स प्रदर्शित होते हैं। इन ऑप्शन्स में से मैं Scale and crop इफेक्ट चुनूँगी।
01:49 आप अपने अनुसार किसी भी ऑप्शन को चुन सकते हैं, उदाहरणस्वरूप, Rotate, Resize या अन्य।
01:56 Add बटन पर क्लिक करें।
01:58 Width 150 और Height 150 प्रविष्ट करें।
02:02 याद रखें कि मूल इमैज से अधिक Width और Height न रखें।
02:07 ऐसा करना, इमैज को पिक्सलेट करने का कारण होगा।
02:11 Add effect पर क्लिक करें।
02:13 यहाँ हमारा नया Image Style है। दाईं ओर की इमैज में, हम देख सकते हैं कि यह अब स्केल और क्रोप हो चुकी है।
02:22 एक और बनाएँ। Image styles पर क्लिक करें और फिर Add image styles बटन पर क्लिक करें।
02:29 इस समय, Image style name में हम टाइप करेंगे: "photo gallery of logos"
02:35 Create new style बटन पर क्लिक करें।
02:38 यह इमैज आपके मशीन पर किसी भी photo gallery में हो सकती है।
02:42 आप यह किसी भी इमैज के लिए, किसी भी field में औऱ किसी भी कंटेंट में कर सकते हैं।
02:47 फिर से Select a new effect पर क्लिक करें औऱ फिर Scale and cropऑप्शन पर क्लिक करें।
02:53 Add बटन पर क्लिक करें। अब Width 300 और Height 300 प्रविष्ट करें।
03:00 और फिर Add effect बटन पर क्लिक करें।
03:03 ध्यान दें कि दाईं ओर की इमैज अब 300 by 300 के नये डाइमेंसन में है।
03:09 यह दर्शाता है कि Drupal प्रत्येक के लिए स्वत: ही प्रत्येक Image style के लिए इमैज का वर्जन बनाता है औऱ फिर उन्हें site पर स्टोर करता है।
03:18 Structure पर क्लिक करें, फिर Views. पर क्लिक करें।
03:21 अब Edit पर क्लिक करें अपने Upcoming Events view को अपडेट करें।
03:27 Event Logo पर क्लिक करें और Image Style Upcoming Events. में बदलें।
03:33 फिर Apply पर क्लिक करें।
03:36 प्रिव्यू सेक्सन पर नीचे स्क्रोल करें और हम देखेंगे कि हमारे सभी लॉगोज समान हैं।
03:42 अब Save पर क्लिक करें।
03:45 Back to site पर क्लिक करें। यह हमारी वेबसाइट पर हमारा व्यू है।
03:50 इस तरह Image Styles कार्य करता है।
03:53 अब इन सभी इवेंट्स के लिए ग्रिड लेआउट के रूप में नया view बनाएँ।
03:59 ऐसा करने के लिए, Structures पर क्लिक करें, फिर Views और Add new view पर क्लिक करें।
04:05 हम इसे Photo Gallery नाम देंगे।
04:09 view सेटिंग को Content - of type को - Events करें।
04:14 यह विशेष view photo-of-the-day या इवेंट के लिए इमैजेस की गैलरी के रूप में उपयोग कर सकते हैं।
04:22 Create a page. पर क्लिक करें।
04:25 नीचे स्क्रोल करें और fields के Grid पर क्लिक करें।
04:29 कृपया ध्यान रखें, हम ड्रॉप-डाउन में Drupal द्वारा दिए गए किसी भी अन्य ऑप्शन को चुन सकते हैं।
04:36 Items to display फिल्ड में, 9 चुनें क्योंकि यह 3 by 3 grid दर्शाता है।
04:42 Create a menu link चैक करें।
04:46 Menu ड्रॉप-डाउन में, Main navigation. ऑप्शन चुनें।
04:51 फिर Save and Edit पर क्लिक करें।
04:54 अपने 5 मानदंडों को फिर से जाँचें।

Display Page है।

04:59 Format Grid, है।
05:01 यहाँ Title नामक केवल एक Field है।
05:04 और अंतत: Filter और Sort Criteria
05:08 अभी के लिए, हम उन्हें ऐसे ही छोडेंगे।
05:12 नीचे स्क्रोल करें। यहाँ हम देखेंगे कि हमारे पास 4 columns और 9 events हैं।
05:17 Format में कॉलम्स की संख्या बदलने के लिए, Settings ऑप्शन पर क्लिक करें।
05:22 फिर कॉलम्स की संख्या 3 करें और Apply पर क्लिक करें।
05:28 यह हमें 3 by 3 grid देगा।
05:31 Fields में , Add. पर क्लिक करें।
05:34 Event Logo पर जाएँ, इस पर चैक-मार्क करें और फिर Apply पर क्लिक करें।
05:40 इस समय, Image style में photo gallery of logos चुनें।
05:45 Link image to, में Content चुनें और Apply पर क्लिक करें।
05:50 तुरंत ही, नीचे Preview सेक्शन में, ग्रिड प्रदर्शत होता है।
05:55 अत:, आप देखें, कि ग्रिड लेआउट table से भिन्न है।
06:00 सभी fields जिन्हें आपने नोड से चुना, एक सेल में है।
06:05 और, हम निर्धारित कर सकते हैं कि हमें कितने सेल्स प्रदर्शित करनी है।
06:09 Save पर क्लिक करें।
06:12 Back to site बटन पर क्लिक करें औऱ फिर Photo Gallery पर क्लिक करें।
06:17 यह बेहतर दिख रहा है।
06:19 छोटे डिवाइज जैसे कि मोबाइल पर, अपने 3 by 3 grid को बनाये रखने के लिए सभी इमैजेस का स्केल कम हो जाता है
06:26 और यह है जो Drupal ग्रिड के साथ करता है।
06:29 इसी के साथ हम, इस ट्यूटोरियल के अंत में पहुँच गए हैं। संक्षेप में...
06:34 इस ट्यूटोरियल में हमने Image styles और photo gallery view. के बारे में सीखा।
06:44 यह वीडियो Acquia और OS ट्रेनिंग से लिया गया है और स्पोकन ट्यूटोरियल प्रोजेक्ट, आईआईटी बॉम्बे द्वारा संशोधित किया गया है।
06:53 इस लिंक पर उपलब्ध वीडियो, स्पोकन ट्यूटोरियल प्रोजेक्ट को सारांशित करता है। कृपया इसे डाउनलोड करके देखें।
07:00 स्पोकन ट्यूटोरियल प्रोजेक्ट टीम कार्यशालाओं का आयोजन करती है और प्रमाणपत्र देती है। अधिक जानकारी के लिए, हमें लिखें।
07:08 स्पोकन ट्यूटोरियल प्रोजेक्ट

NMEICT, मानव संसाधन विकास मंत्रायल और NVLI, संस्कृति मंत्रालय, भारत सरकार द्वारा निधिबद्ध है।

07:19 यह स्क्रिप्ट बिंदु पांडे द्वारा अनुवादित है। आईआईटी बॉम्बे की ओर से मैं श्रुति आर्य अब आपसे विदा लेती हूँ। धन्यवाद...

Contributors and Content Editors

Devraj, Shruti arya