Difference between revisions of "Drupal/C3/Controlling-Display-of-Images/Hindi"

From Script | Spoken-Tutorial
Jump to: navigation, search
Line 15: Line 15:
 
| 00:12
 
| 00:12
 
| इस ट्यूटोरियल को रिकॉर्ड करने के लिए मैं उपोयग कर रही हूँ
 
| इस ट्यूटोरियल को रिकॉर्ड करने के लिए मैं उपोयग कर रही हूँ
'उबंटु ऑपरेटिंग सिस्टम'
+
'उबंटु ऑपरेटिंग सिस्टम','Drupal' 8 और'Firefox' वेब ब्राउजर
'Drupal' 8 और
+
'Firefox' वेब ब्राउजर
+
  
 
|-
 
|-
Line 170: Line 168:
 
|-
 
|-
 
|  03:45
 
|  03:45
| 'Back to site' पर क्लिक करें। यह हमारी वेबसाइट पर हमारा व्यू है।
+
| 'Back to site' पर क्लिक करें। यह हमारी वेबसाइट पर हमारा व्यू है।
  
 
|-
 
|-
Line 214: Line 212:
 
|-
 
|-
 
|  04:46
 
|  04:46
| 'Menu' ड्रॉप-डाउन में, 'Main navigation' ऑप्शन चुनें।
+
| 'Menu' ड्रॉप-डाउन में, 'Main navigation' ऑप्शन चुनें।
  
 
|-
 
|-
Line 227: Line 225:
 
|-
 
|-
 
| 04:59
 
| 04:59
| 'Format', 'Grid' है।
+
| 'Format', 'Grid' है।
 
|-
 
|-
 
| 05:01
 
| 05:01
Line 252: Line 250:
 
|-
 
|-
 
|  05:31
 
|  05:31
| 'Fields' में , 'Add' पर क्लिक करें।  
+
| 'Fields' में , 'Add' पर क्लिक करें।  
  
 
|-
 
|-
Line 276: Line 274:
 
|-
 
|-
 
| 06:05
 
| 06:05
| और, हम निर्धारित कर सकते हैं कि हमें कितने सेल्स प्रदर्शित करनी है।
+
| और हम निर्धारित कर सकते हैं कि हमें कितने सेल्स प्रदर्शित करनी है।
 
|-
 
|-
 
|  06:09
 
|  06:09
Line 312: Line 310:
 
|-
 
|-
 
| 07:08
 
| 07:08
| स्पोकन ट्यूटोरियल प्रोजेक्ट  
+
| स्पोकन ट्यूटोरियल प्रोजेक्ट NMEICT, मानव संसाधन विकास मंत्रायल और NVLI, संस्कृति मंत्रालय, भारत सरकार द्वारा निधिबद्ध है।
NMEICT, मानव संसाधन विकास मंत्रायल और NVLI, संस्कृति मंत्रालय, भारत सरकार द्वारा निधिबद्ध है।
+
 
|-
 
|-
 
| 07:19
 
| 07:19
 
|यह स्क्रिप्ट बिंदु पांडे द्वारा अनुवादित है। आईआईटी बॉम्बे की ओर से मैं श्रुति आर्य अब आपसे विदा लेती हूँ। धन्यवाद...  
 
|यह स्क्रिप्ट बिंदु पांडे द्वारा अनुवादित है। आईआईटी बॉम्बे की ओर से मैं श्रुति आर्य अब आपसे विदा लेती हूँ। धन्यवाद...  
 
|}
 
|}

Revision as of 15:59, 7 October 2016

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