Drupal/C2/Editing-Existing-Content/Tamil
From Script | Spoken-Tutorial
|
|
00:01 | வணக்கம் Editing Existing Content குறித்த Spoken tutorialக்கு நல்வரவு |
00:06 | இந்த டுடோரியலில் நாம் கற்கபோவது Inline editing |
00:10 | CKEditorஐப் பயன்படுத்துதல் மற்றும் |
00:12 | CKEditorஐ configure செய்தல். |
00:15 | இந்த டுடோரியலை பதிவுசெய்ய நான் பயன்படுத்துவது:
Ubuntu இயங்குதளம் Drupal 8 மற்றும் Firefox web browser. |
00:24 | உங்களுக்கு விருப்பமான எந்த web browserஐயும் பயன்படுத்தலாம். |
00:28 | நாம் ஏற்கனவே உருவாக்கிய websiteஐ திறப்போம். |
00:32 | முதலில் Inline Editing பற்றி கற்போம். |
00:36 | Title மீது cursorஐ கொண்டுவரவும். வலப்பக்கம் ஒரு pencil iconஐ காணலாம். |
00:43 | இது blockஐ configure செய்யசொல்லி கேட்கும் |
00:48 | Configure blockஐ க்ளிக் செய்க. இந்த block... Page Titleக்கான general block. |
00:54 | இதை மாற்றினால் ஒவ்வொரு nodeலும் Page Titleன் தோற்றம் மாறுபடும் . |
00:59 | Back to siteஐ க்ளிக் செய்க. இங்கே pencil ஐ க்ளிக் செய்து Configure blockஐ க்ளிக் செய்க |
01:06 | tabகளை மாற்ற விரும்பினால், இங்கேயே மாற்றலாம். |
01:10 | அதை அவ்வாறே விடுகிறேன். |
01:13 | Back to siteஐ க்ளிக் செய்க. |
01:16 | Content areaல் pencilஐ க்ளிக் செய்க. |
01:20 | இங்கு மூன்று optionகளை காணலாம்– Quick edit, Edit மற்றும் Delete. |
01:25 | Quick edit என்பது inline windowல் front end editing ஆகும் |
01:29 | Edit அந்த nodeன் main editing windowக்கு கொண்டுசெல்லும். |
01:33 | Delete உறுதிசெய்து அந்த node ஐ நீக்கும். |
01:37 | inline windowல் நம் node ஐ edit செய்ய Quick editஐ க்ளிக் செய்க. |
01:41 | நாம் cursorஐ நகர்த்துகையில், அந்த nodeன் வெவ்வேறு sectionகளுக்கு செல்கிறோம். |
01:47 | இங்கே க்ளிக் செய்யும்போது, மேலும் contentஐ சேர்க்கலாம், sourceஐ காணலாம், சில textஐயும் bold ஆக்கலாம். |
01:53 | மாற்றியபின், Drupal அதை சேமிக்க சொல்கிறது. nodeஐ update செய்ய Saveஐ க்ளிக் செய்க. |
02:00 | இப்போது ஒரு article node, Welcome to Drupalvilleஐ மாற்ற கற்போம் |
02:06 | Quick editஐ க்ளிக் செய்க. Title மற்றும் body fieldகளை front endல் edit செய்யலாம் என்பதைக் காண்க. |
02:14 | ஆனால் imageஐ edit செய்ய முடியாது. |
02:17 | imageஐ edit செய்ய, edit screenன் உள் செல்ல வேண்டும் |
02:22 | இப்போது bodyல் மாற்றங்களை செய்து சேமிப்போம். |
02:26 | Quick edit windowல் tagகளையும் edit செய்யலாம். |
02:30 | Drupalல் சிறுசிறு மாற்றங்களை செய்ய front end editing உதவும். |
02:34 | contentஐ எந்தநேரமும் update செய்யவதற்கான ஒரு அம்சம் Edit tab. |
02:40 | ஏற்கனவே Wysiwyg Editor என்ற சொல்லை பார்த்தோம். |
02:44 | அது what you see is what you get. |
02:48 | Wysiwyg Editor மிகவும் பயனுள்ளது. |
02:52 | Text Format ஐ Full HTMLக்கு மாற்றுவோம். |
02:58 | இது Wysiwyg Editorல் உள்ள formatting optionகளை பற்றி தெரிந்துகொள்ள உதவும் |
03:04 | Drupalல் Drupal coreஉடன் CKEditor வருகிறது. |
03:09 | முன்னருப்பாக இது செயலில் இருக்கும். அதை configure செய்யகூடிய நிலையில் இருக்கும் |
03:14 | அதுபற்றி காண்போம். "Welcome to our site"ஐ எடுத்துக்கொள்வோம். |
03:20 | formatஐ Normalல் இருந்து Heading 2க்கு மாற்றுவோம் |
03:24 | உடனடியாக, அந்த textன் previewஐ Drupal காட்டுகிறது. |
03:30 | இது theme மற்றும் அந்த themeஐ கொடுக்கும் cascading style sheets அல்லது CSS மூலம் நிர்ணயிக்கபடுகிறது. |
03:38 | மேலும் சில textஐ சேர்ப்போம், “Editing Drupal nodes is really fun!”. |
03:44 | அந்த textல், Italicsஐ நீக்குவோம். அந்த textக்கு ஒரு hyperlinkஐ உருவாக்குவோம். |
03:52 | இங்கே http://drupal.org/ என்போம். Saveஐ க்ளிக் செய்க |
04:00 | mouseஐ அதன் மீது நகர்த்தி அந்த hyperlinkஐ உறுதிசெய்வோம். |
04:04 | hyperlinkஐ நீக்க, textஐ highlight செய்து Unlinkஐ க்ளிக் செய்க |
04:10 | மாற்றத்தை undo செய்ய Ctrl+Zஐ அழுத்துக |
04:14 | ordered மற்றும் unordered listகளை சேர்க்க Bullets மற்றும் numbering iconகளை அழுத்தலாம். |
04:21 | Unordered listஐ க்ளிக் செய்க. பின் bulletகள் - one, two, three. |
04:28 | அடுத்து Ordered listஐ க்ளிக் செய்க பின் one, two மற்றும் three. |
04:34 | Block quotesஐ பயன்படுத்த, சில textஐ highlight செய்து Block Quote linkஐ க்ளிக் செய்க. |
04:40 | இப்போதும் நம் theme மூலம் formatting நிர்வகிக்கப்படுகிறது |
04:46 | நாம் சுலபமாக imageகளையும் சேர்க்கலாம். முதல் nodeல் நான் upload செய்த இந்த file ஐ தேர்ந்தெடுக்கிறேன். |
04:56 | Alternative Text fieldல், “Drupal Logo” என டைப் செய்கிறேன். |
05:02 | Alignல், Rightஐ தேர்ந்தெடுக்கிறேன். Caption வேண்டுமெனில் சேர்த்துக்கொள்ளலாம். |
05:08 | கடைசியாக Saveல் க்ளிக் செய்க |
05:12 | இப்போது இது அந்த nodeன் bodyல் சேர்க்கப்படுகிறது. தேவையெனில் image மீது க்ளிக் செய்து நகர்த்திக்கொள்ளலாம். |
05:22 | அதற்கு முதலில் editing windowன் அளவை சற்று மாற்றவேண்டும். இப்போது imageஐ வேறுஇடத்திற்கு இழுத்து விடலாம். |
05:30 | Cursorஐ image மீது வைக்கும்போது அதை மறுஅளவாக்க தேர்வுகள் காட்டப்படுகின்றன. |
05:36 | Drupal nodeக்கு imageகளை சேர்க்கும் முன், அவை சரியான அளவில் சரியான இடத்தில் உள்ளதா என்பதை உறுதிசெய்க. |
05:43 | இது nodeல் contentஐ ஒழுங்கு செய்கையில் உதவும். |
05:47 | இங்கும் ஒரு table அல்லது horizontal lineஐயும் சேர்க்க முடியும் |
05:51 | nodeக்கு உருவாக்கிய blocksஐயும் பார்க்கலாம். |
05:55 | இங்கே ஒரு H2 block, ஒரு block code, paragraph, tag போன்றவை. |
06:01 | உங்களுக்கு HTML தெரிந்தால், இந்த iconஐ க்ளிக் செய்து sourceஐ காணலாம். |
06:07 | மேலும் செல்வதற்கு முன் இந்த தேர்வுகளை ஆராய்ந்தறியவும். |
06:12 | Full HTML செயலில் உள்ளதை நினைவு கொள்க. |
06:16 | இதை Basic HTMLக்கு மாற்றினால் அது நம்மை எச்சரிக்கும். |
06:21 | இது contentஐ நிரந்தரமாக இழக்க நேரிடும் என்கிறது. |
06:26 | உதாரணமாக, ஒரு JavaScript, I-frame, youtube video, google map போல ஏதேனும் ஒன்றை உள்நுழைத்துள்ளோம் எனில். |
06:33 | அப்போது Basic HTMLக்கு மாற்றும்போது அவை அனைத்தையும் Drupal நீக்கிவிடும். |
06:38 | இந்த பிரச்சனைகளைத் தவிர்க்க தேவையானவற்றை மட்டும் வைத்துக்கொள்ளவும். |
06:43 | Cancelஐ க்ளிக் செய்து இந்த இழப்பை தவிர்ப்போம். |
06:48 | இதுதான் CKEditor பற்றிய சிறு விளக்கம். |
06:52 | இதை customize செய்யவும் நாம் கற்றோம். |
06:55 | Save and keep publishedஐ க்ளிக் செய்க |
06:58 | மாற்றப்பட்ட node காட்டப்படுகிறது. |
07:01 | அடுத்து CKEditorஐ configure செய்ய கற்போம். |
07:05 | மேலே Configurationல் க்ளிக் செய்க. |
07:09 | இப்போது Text formats and editorsஐ க்ளிக் செய்க |
07:13 | Basic HTML மற்றும் Full HTML, CKEditorஐ பயன்படுத்துகிறது என்பதைக் காணலாம் |
07:19 | அவை Authenticated User மற்றும் Administratorக்கு assign செய்யப்பட்டுள்ளது. |
07:24 | இவை இரண்டும் தனித்தன்மையான user roles. |
07:27 | Drupalன் நம் userக்கு வெவ்வேறு roleகள் உள்ளன. ஒவ்வொரு role க்கும் permissionகளை கொடுக்க வேண்டும். |
07:34 | இங்கு, Basic HTMLஐ Authenticated userஉம் Administratorஉம் பயன்படுத்தலாம் |
07:41 | இந்த இரு roleகளுக்கும் CKEditor assign செய்யப்படுகிறது. |
07:45 | இதேபோல, Full HTML ஐ Administrator பயன்படுத்தலாம் |
07:50 | இப்போது Basic HTMLல் CKEditorஐ சோதிப்போம். |
07:54 | Configureஐ க்ளிக் செய்க இங்கு வேறு roleகளுக்கு அதை assign செய்ய முடியும். |
07:59 | விருப்பமான ஏதேனும் Text editorஐ assign செய்க. அவர்கள் பயன்படுத்தக்கூடிய buttonகளுக்கு அனுமதிக் கொடுக்கவும். |
08:07 | இதுதான் Basic HTML Text Formatக்கு Authenticated Userக்கான Active toolbar |
08:15 | அடுத்து இந்த buttonகளை Active toolbarக்கு சேர்க்க கற்போம். |
08:21 | Available buttonsல் Paste from Word iconஐ தேர்ந்தெடுப்போம். |
08:26 | அதன் மீது க்ளிக் செய்து இழுக்கவும். ஒரு நீல நிறப்பெட்டி திறக்கும். அதனுள் இந்த icon ஐ வைக்கவும். |
08:33 | ஒரு புது groupஐ சேர்க்க, Add group buttonஐ க்ளிக் செய்க. அதற்கு “copy and paste” என பெயரிட்டு Applyல் க்ளிக் செய்க |
08:41 | இப்போது Paste from Word iconஐ copy and paste sectionக்கு இழுத்து விடவும். |
08:47 | அனைத்து paste iconகளையும் இதில் சேர்ப்போம். |
08:51 | Basic HTML formatக்கு மூன்று புது buttonகளை சேர்த்துள்ளோம் |
08:57 | பலசமயங்களில் text copy-paste செய்யப்படுவதால் Paste iconகள் toolbarக்கு தேவைப்படும், . |
09:04 | inline-imageகளையும் upload செய்வோம். அதிகபட்சம் 32MB அளவுகொண்ட imageகளை upload செய்வோம். |
09:14 | உங்கள் கணினியில் இந்த அதிகபட்ட அளவு வரம்பு வேறுபட்டிருக்கலாம். |
09:18 | நம் தேவைக்கேற்ப இந்த அமைப்புகளை நாம் மாற்றிகொள்ளலாம். |
09:23 | உதாரணமாக, ஒரு URL எப்போதும் ஒரு linkஆகவே நமக்கு வேண்டும். |
09:29 | அதற்கு Convert URLs into links optionஐ தேர்ந்தெடுக்கவும். |
09:34 | இங்கே Filter settingsஉம் உள்ளது. Limit allowed HTML tagsஐ க்ளிக் செய்க |
09:41 | இப்போது இந்த HTML tagகளை sourceல் நாம் பயன்படுத்தலாம். |
09:47 | இதுதான் சக்திவாய்ந்த WYSIWYG editor மற்றும் அதன் configuration பகுதி. |
09:54 | அனைத்து மாற்றங்களையும் செய்தவுடன் Save configuration buttonஐ க்ளிக் செய்க. |
09:59 | இப்போது நம் Contentஐ காண்போம் |
10:02 | Welcome to Drupalville nodeல் Edit optionஐ க்ளிக் செய்க |
10:07 | Full HTML செயலில் உள்ளதால் ஏதும் மாறவில்லை. |
10:12 | இதை Basic HTMLக்கு மாற்றுவோம். மாற்றங்கள் அனைத்தும் உள்ளன. |
10:18 | இங்கு blockகளை காணமுடியவில்லை, ஆனால் Paste iconகள் உள்ளன. |
10:23 | இந்த image எனக்கு தேவையில்லை. எனவே இதை நீக்க Backspace அல்லது Delete keyஐ அழுத்துகிறேன். |
10:32 | Save and keep publishedஐ க்ளிக் செய்க. |
10:35 | மீண்டும் Configurationஐ க்ளிக் செய்து கீழே வந்து Text formats and editorsஐ க்ளிக் செய்க |
10:43 | இம்முறை Full HTML toolbarஐ configure செய்வோம் |
10:47 | இங்கே மேலும் சில buttonகள் உள்ளன ஆனால் Paste iconகள் இல்லை |
10:52 | Show group namesஐ க்ளிக் செய்து இரண்டாம் வரியில் Add groupஐ க்ளிக் செய்க. |
10:57 | இதை “copy and paste” என்க. இப்போது இந்த buttonகளை copy and paste sectionக்கு இழுத்து விடவும். |
11:05 | ஏற்கனவே பார்த்ததுபோல இங்கேயும் optionகள் உள்ளன. இப்போதைக்கு Save configuration buttonஐ க்ளிக் செய்க. |
11:13 | மீண்டும் நம் Welcome to Drupalvilleக்கு சென்று அதை Full HTMLக்கு மாற்றுவோம் |
11:18 | Continueஐ க்ளிக் செய்க. buttonகளை இரண்டு வரிசையில் காண்கிறோம். |
11:23 | அதாவது நமது அமைப்புகள் சரியாக வேலைசெய்கிறது. |
11:26 | CKEditorல் மேலும் சற்று நேரம் வேலைசெய்து அது பற்றி ஆய்ந்தறியவும். |
11:32 | இத்துடன் இந்த டுடோரியல் முடிகிறது. |
11:37 | சுருங்க சொல்ல இந்த டுடோரியலில் நாம் கற்றது:
Inline editing CKEditorஐ பயன்படுத்துதல் மற்றும் CKEditorஐ configure செய்தல் |
11:50 | இந்த வீடியோ Acquia மற்றும் OSTraining இருந்து எடுக்கப்பட்டு ஸ்போகன் டுடோரியல் திட்டம், ஐஐடி பாம்பே ஆல் மாற்றப்பட்டது. |
11:59 | இந்த இணைப்பில் உள்ள வீடியோ spoken tutorial திட்டம் பற்றி சுருங்க சொல்கிறது. அதை தரவிறக்கி காணவும். |
12:06 | Spoken Tutorial திட்டக்குழு செய்முறை வகுப்புகள் நடத்தி இணையத்தில் பரிட்சை எழுதி தேர்வோருக்கு சான்றிதழ் அளிக்கிறது. மேலும் விவரங்களுக்கு எங்களுக்கு மின்னஞ்சல் செய்யவும். |
12:13 | ஸ்போகன் டுடொரியல் திட்டத்திற்க்கு நிதியுதவி இந்திய அரசின்
NMEICT, மத்திய மனித வள மேம்பாட்டு அமைச்சகம் மற்றும் NVLI - மத்திய கலாச்சார அமைச்சகம். |
12:25 | இந்த டுடோரியலைத் தமிழாக்கம் செய்து குரல் கொடுத்தது ஐஐடி பாம்பேயில் இருந்து ப்ரியா. நன்றி. |