Difference between revisions of "Drupal/C2/Editing-Existing-Content/Gujarati"

From Script | Spoken-Tutorial
Jump to: navigation, search
 
(8 intermediate revisions by 2 users not shown)
Line 5: Line 5:
 
|-
 
|-
 
| 00:01
 
| 00:01
|  ''' Editing Existing Content.''' પરનાં સ્પોકન ટ્યુટોરીયલમાં સ્વાગત છે.
+
|  ''' Editing Existing Content''' પરનાં સ્પોકન ટ્યુટોરીયલમાં સ્વાગત છે.
  
 
|-
 
|-
Line 21: Line 21:
 
|-
 
|-
 
| 00:15
 
| 00:15
| આ ટ્યુટોરીયલ રેકોર્ડ કરવા માટે, હું વાપરી રહ્યો છું:
+
| આ ટ્યુટોરીયલ રેકોર્ડ કરવા માટે, હું વાપરી રહ્યો છું:'''Ubuntu Operating System''' , '''Drupal 8 ''' અને '''Firefox ''' વેબ બ્રાઉઝર.
 
+
* '''Ubuntu Operating System'''
+
* '''Drupal 8 ''' અને
+
* '''Firefox ''' વેબ બ્રાઉઝર.
+
  
 
|-
 
|-
Line 244: Line 240:
  
 
|-
 
|-
| 05:12
+
| 05:12
| It is now added to the''' node''' inside the''' body'''. Hover over the image, click and drag it to a new position, if you want.
+
| હવે આ ''' body''' અંતર્ગત ''' node''' માં ઉમેરાઈ ગયું છે. ઇમેજ પર માઉસ ફેરવો, જો તમે ચાહો તો તેને ક્લીક કરીને તેને નવી જગ્યાએ ડ્રેગ કરો.
  
 
|-
 
|-
| 05:22
+
| 05:22
| We will first have to re-size our editing window a little so that we can drag our image anywhere we want.
+
| આપણને સૌ પહેલા આપણા એડિટિંગ વિન્ડોને સેજ માપસર કરવું પડશે, જેથી કરીને આપણે આપણી ઇમેજને જોઈએ એ સ્થાને ડ્રેગ કરી શકીએ.
  
 
|-
 
|-
 
| 05:30
 
| 05:30
| Hovering over the image also allows us to '''resize''' our images.
+
| ઇમેજ પર માઉસ ફેરવવાથી પણ આપણી ઈમેજોને '''resize''' કરવાની પરવાનગી મળે છે.
  
 
|-
 
|-
| 05:36
+
| 05:36
|Before adding images to your''' Drupal node''', make sure that your images are properly sized and formatted.
+
| આપણા ''' Drupal node''' માં ઈમેજો ઉમેરીએ એ પહેલા, એ વાતની ખાતરી કરી લો કે આપણી ઇમેજ બરાબરથી માપસર કરેલ અને ફોર્મેટ કરેલ હોય.
  
 
|-
 
|-
| 05:43
+
| 05:43
| That will help a lot in aligning the content on the '''node'''.
+
| જેનાથી '''node''' પર કન્ટેન્ટને અલાઇન કરવામાં ઘણી મદદ મળશે.
  
 
|-
 
|-
| 05:47
+
| 05:47
| We can add a''' table''' or a''' horizontal line.'''
+
| આપણે એક ''' table''' અથવા  ''' horizontal line''' ઉમેરી શકીએ છીએ.
  
 
|-
 
|-
| 05:51
+
| 05:51
|And even show the''' blocks''' that we created in our node.
+
| અને ''' blocks''' પણ દર્શાવી શકીએ છીએ જે આપણે આપણી નોડમાં બનાવ્યા હતા.
  
 
|-
 
|-
| 05:55
+
| 05:55
| So, here is the''' H2 block''', a''' block code, paragraph, tag''' etc.
+
| તો, આ રહ્યું ''' H2 block''', એક ''' block code, paragraph, tag''' વગેરે.
  
 
|-
 
|-
| 06:01
+
| 06:01
|If you know''' HTML''', then you can view the''' source''' by clicking on this '''icon'''.
+
| તમને જો ''' HTML''' ની જાણકારી હોય તો, તમે આ '''icon''' પર ક્લીક કરીને ''' source''' જોઈ શકો છો.
  
 
|-
 
|-
 
| 06:07
 
| 06:07
| Explore each of these options thoroughly before proceeding ahead.
+
| આગળ વધો એ પહેલા આ દરેક વિકલ્પોનું બરાબરથી અન્વેષણ કરો.
  
 
|-
 
|-
| 06:12
+
| 06:12
| Recall that we have turned on '''Full HTML'''.
+
| યાદ કરો આપણે '''Full HTML''' ને ચાલુ કર્યું છે.
  
 
|-
 
|-
 
| 06:16
 
| 06:16
| If we change this to''' Basic HTML,''' it is going to warn us.
+
| જો આપણે આને ''' Basic HTML''' માં બદલીએ છીએ તો, તે આપણને ચેતવણી આપશે.
  
 
|-
 
|-
| 06:21
+
| 06:21
|There is a possibility of the content being permanently lost or deleted.
+
| કન્ટેન્ટ હંમેશા માટે ખોવાઈ જાય કે રદ્દ થઇ જાય એવી શક્યતા છે.
  
 
|-
 
|-
 
| 06:26
 
| 06:26
| Say, we have inserted a''' JavaScript, I-frame, youtube video''', a''' google map''' or something like that.
+
| માનો કે, આપણે દાખલ કરી છે એક ''' JavaScript, I-frame, youtube video''', એક ''' google map''' અથવા એના જ જેવું કંઈક.
  
 
|-
 
|-
| 06:33
+
| 06:33
|Changing to''' Basic HTML,''' will cause''' Drupal''' to remove those content.
+
| ''' Basic HTML''' માં બદલવાથી, ''' Drupal''' આ કન્ટેન્ટને રદ્દ કરશે.
  
 
|-
 
|-
| 06:38
+
| 06:38
| In order to avoid these kinds of problems, keep only what you actually need.
+
| આવી સમસ્યાને ઉકેલવા માટે, ફક્ત એ જ રાખો જે ખરેખર તમને જોઈએ છે.
  
 
|-
 
|-
| 06:43
+
| 06:43
| Let’s cancel the changes in the settings, so we won’t lose anything.
+
| ચાલો સેટિંગ્સમાં કરેલ ફેરફારને રદ્દ કરીએ, જેથી આપણું કંઈપણ ખોવાશે નહીં.
  
 
|-
 
|-
| 06:48
+
| 06:48
|This is a quick overview of''' CKEditor''' that comes with''' Drupal'''.
+
| '''Drupal''' સાથે આવેલ ''' CKEditor''' નું આ એક ઝડપી ઓવરવ્યુ છે.
  
 
|-
 
|-
| 06:52
+
| 06:52
| And we have learnt how to customize it.
+
| અને આપણે શીખ્યા કે તેને કેવી રીતે કસ્ટમાઇઝ કરવું.
  
 
|-
 
|-
| 06:55
+
| 06:55
| Now click''' Save and keep published.'''
+
| હવે ''' Save and keep published''' પર ક્લીક કરો.
  
 
|-
 
|-
| 06:58
+
| 06:58
|The modified''' node''' is displayed.
+
| મોડીફાય કરેલ ''' node''' દ્રશ્યમાન થાય છે.
  
 
|-
 
|-
| 07:01
+
| 07:01
| Next let's learn to configure the''' CKEditor'''.
+
| આગળ ચાલો ''' CKEditor''' ને કોન્ફીગર કરતા શીખીએ.
  
 
|-
 
|-
| 07:05
+
| 07:05
| Let’s click on''' Configuration''' at the top.
+
| ઉપર આવેલ ''' Configuration''' પર ચાલો ક્લીક કરીએ.
  
 
|-
 
|-
| 07:09
+
| 07:09
| Now click on''' Text formats and editors.'''
+
| હવે ''' Text formats and editors''' પર ક્લીક કરો.
  
 
|-
 
|-
| 07:13
+
| 07:13
|We will notice that''' Basic HTML''' and''' Full HTML''' use the''' CKEditor.'''
+
| આપણે નોંધ લેશું કે ''' Basic HTML''' અને ''' Full HTML''' ''' CKEditor''' ને વાપરે છે.   
  
 
|-
 
|-
| 07:19
+
| 07:19
|And, they are assigned to''' Authenticated User''' and''' Administrator'''.
+
| અને, તે ''' Authenticated User''' અને ''' Administrator''' ને એસાઇન કરાયેલું છે.
  
 
|-
 
|-
| 07:24
+
| 07:24
| These are two unique''' user roles'''.
+
| આ બે અનન્ય ''' user roles''' છે.
  
 
|-
 
|-
| 07:27
+
| 07:27
| In''' Drupal,''' our user has different roles and each role has to be given '''permission'''s.
+
| ''' Drupal''' માં, આપણો યુઝર વિભિન્ન ભૂમિકા ભજવે છે અને દરેક ભૂમિકાને પરવાનગીઓ અપાયી છે.
  
 
|-
 
|-
| 07:34
+
| 07:34
| In this case,''' Basic HTML''' can be used by an''' Authenticated user''' and''' Administrator.'''
+
| આ કિસ્સામાં, ''' Authenticated user''' અને ''' Administrator''' દ્વારા ''' Basic HTML''' નો ઉપયોગ થઇ શકે છે.
  
 
|-
 
|-
| 07:41
+
| 07:41
|The''' CKEditor''' has been assigned for these 2 roles.
+
| ''' CKEditor''' ને આ 2 ભૂમિકાઓ માટે એસાઇન કરાયું છે.
  
 
|-
 
|-
| 07:45
+
| 07:45
| Similarly,''' Full HTML''' can be used by an''' Administrator.'''
+
| એજ પ્રમાણે, ''' Administrator''' દ્વારા ''' Full HTML''' નો ઉપયોગ થઇ શકે છે.
  
 
|-
 
|-
| 07:50
+
| 07:50
| Now, let’s check''' CKEditor''' for the''' Basic HTML'''.
+
| હવે, ચાલો ''' Basic HTML''' માટે ''' CKEditor''' ચેક કરીએ.
  
 
|-
 
|-
| 07:54
+
| 07:54
|Click on''' Configure''' and you will be able to assign it to different roles.
+
| ''' Configure''' પર ક્લીક કરો અને તમે તેને વિભિન્ન ભૂમિકાઓને એસાઇન કરવા માટે સમર્થ બનાવશો.
  
 
|-
 
|-
| 07:59
+
| 07:59
| Assign any''' Text editor''' that you want. And then give them permissions for the buttons that they are allowed to use.
+
| તમને જોઈતું કોઈપણ ''' Text editor''' એસાઇન કરો. અને ત્યારબાદ તેને એ બટનો માટે પરવાનગી આપો જેને તમે વાપરવા માટે પરવાનગીઓ આપો છો.
  
 
|-
 
|-
| 08:07
+
| 08:07
| Recall - this is the''' Active toolbar''' we had, for the''' Authenticated User''' for''' Basic HTML Text Format.'''
+
| યાદ કરો - ''' Active toolbar''' છે જે આપણી પાસે હતું, ''' Basic HTML Text Format''' માટે ''' Authenticated User''' માટે.
  
 
|-
 
|-
| 08:15
+
| 08:15
| What if we want to add one of these buttons to our''' Active toolbar'''? This is very simple.
+
| કેટલાક બટનોને જો આપણા ''' Active toolbar''' માં ઉમેરવા હોય તો શું કરી શકાય? આ અત્યંત સરળ છે.
  
 
|-
 
|-
| 08:21
+
| 08:21
Let’s choose''' Paste from Word''' icon from''' Available buttons'''.
+
|  ''' Available buttons''' માંથી ''' Paste from Word''' આઇકોન પસંદ કરીએ.
  
 
|-
 
|-
| 08:26
+
| 08:26
| Then click and drag the '''mouse''' until a little blue box opens up where we can add the icon.
+
| ત્યારબાદ જ્યાંસુધી ભૂરું બોક્સ ખુલતું નથી ત્યાંસુધી, માઉસને ક્લીક કરીને ડ્રેગ કરો જ્યાં આપણે આઇકોનને ઉમેરી શકીએ છીએ.
  
 
|-
 
|-
| 08:33
+
| 08:33
| To add a new group, click on''' Add group''' button. Name it “copy and paste” and click on''' Apply.'''
+
| નવું ગ્રુપ ઉમેરવા માટે, ''' Add group''' બટન પર ક્લીક કરો. તેને “copy and paste” નામ આપો અને ''' Apply''' પર ક્લીક કરો.
  
 
|-
 
|-
 
| 08:41
 
| 08:41
| Now, click and drag''' Paste from Word''' icon into the''' copy and paste''' section.
+
| હવે, ''' copy and paste''' વિભાગમાં ''' Paste from Word''' આઇકોન ક્લીક કરીને ડ્રેગ કરો.
  
 
|-
 
|-
| 08:47
+
| 08:47
| Let’s now add all the''' paste icons''' here.
+
| ચાલો હવે અહીં તમામ ''' paste icons''' ઉમેરીએ.
  
 
|-
 
|-
| 08:51
+
| 08:51
| So, we have added three new buttons to our bar for''' Basic HTML format.'''
+
| તો, ''' Basic HTML format''' માટે આપણે ત્રણ નવા બટનો આપણા બારમાં ઉમેર્યા છે.
  
 
|-
 
|-
 
|  08:57
 
|  08:57
|'''Paste icons''' are something that every toolbar needs, as most text are copy-pasted from files.
+
|'''Paste icons''' એક એવું કઈ છે જે દરેક ટુલબારની જરૂરિયાત છે.કારણકે ઘણી ટેક્સ્ટ ફાઈલો માંથી કોપી અને પેસ્ટ થાય છે.
  
 
|-
 
|-
 
|  09:04
 
|  09:04
| We also upload''' inline-images.''' And upload images with a maximum file size of 32MB, with any width and height.
+
| આપણે ''' inline-images.''' પણ અપલોડ કરીએ છીએ અને અપલોડ ઈમેજો નું મહત્તમ માપ 32MB તેમજ પહોળાઈ અને ઉંચાઈ કઇં પણ હોઈ શકે છે.
  
 
|-
 
|-
 
|  09:14
 
|  09:14
|The maximum size may be different in your installation.  
+
|મહત્તમ માપ તમારા ઈન્સ્ટોલેશનમાં હોય એનાથી જુદું હોઈ શકે છે.
  
 
|-
 
|-
 
| 09:18
 
| 09:18
We can change any of these settings down here, as per our preference.
+
આપણી પસંદગી મુજબ આપણે આ સેટીંગો માની કોઈ પણ સેટિંગ અહીં બદલી શકીએ છીએ.
  
 
|-
 
|-
 
|  09:23
 
|  09:23
Say, we always want to change a''' URL''' into a''' link,''' instead of manually linking it.
+
માનો કે ''' URL''' મેન્યુલી લિંક કરવાના બદલે આપણે હંમેશા તેને એક લિંકમાં બદલવા ઇચ્છતા હોઈએ છીએ.
  
 
|-
 
|-
 
|  09:29
 
|  09:29
|We can do so by clicking''' Convert URLs into links''' option.
+
|આ આપણને ''' Convert URLs into links''' વિકલ્પ પર ક્લિક કરીને કરી શકીએ છીએ.
  
 
|-
 
|-
 
|  09:34
 
|  09:34
Here we also have the''' Filter settings.''' Let’s click on''' Limit allowed HTML tags.'''
+
અહીં આપણી પાસે ''' Filter settings.''' છે ચાલો ''' Limit allowed HTML tags.''' પર ક્લિક કરો.
  
 
|-
 
|-
 
|  09:41
 
|  09:41
|Now, we will be able to add the''' HTML tags''' that we can use, when we look at the source.
+
|હવે આપણે ''' HTML tags''' ઉમેરવા માટે સમર્થ રહીશું જે કે આપણે તયારે વાપરી શકીશું જયારે આપણે સોર્સ તરફે જોશું.
  
 
|-
 
|-
 
|  09:47
 
|  09:47
So, this is a really powerful''' WYSIWYG editor''' and its configuration area.
+
તો આ ખરેખર શક્તિશાળી''' WYSIWYG editor''' અને તેનો કોન્ફીગ્રેશન વિસ્તાર છે.
  
 
|-
 
|-
 
|  09:54
 
|  09:54
Once we have made all our changes, click the''' Save configuration''' button.
+
એક વાર તમામ ફેરફારો કર્યા બાદ ''' Save configuration''' બટન પર ક્લિક કરો.
  
 
|-
 
|-
 
|  09:59
 
|  09:59
|Let us now look at our''' Content.'''
+
|ચાલો હવે આપણાં ''' Content.''' તરફે જોઈએ.
  
 
|-
 
|-
 
| 10:02
 
| 10:02
| Click the''' Edit''' option in''' Welcome to Drupalville node.'''
+
| ''' Welcome to Drupalville node.''' માં ''' Edit''' વિકલ્પ પર ક્લિક કરો.
  
 
|-
 
|-
 
|  10:07
 
|  10:07
|Notice that since we had''' Full HTML''' turned ON, nothing has changed.
+
|નોંધ લો જો કે આપણે ''' Full HTML''' ચાલુ રાખ્યું હોત તો કઈ પણ બદલાયું નથી.
  
 
|-
 
|-
 
|  10:12
 
|  10:12
| Let’s now change this to''' Basic HTML.''' All the changes are still there.
+
| ચાલો હવે આને ''' Basic HTML.'''માં બદલીએ કરેલા તમામ ફેરફારો હજી સુંધી છે.
  
 
|-
 
|-
 
|  10:18
 
|  10:18
|Though I can’t see my''' blocks''' anymore, the''' Paste icons''' are now available.
+
|જો કે મારુ ''' blocks''' હવે દેખાતું નથી તો ''' Paste icons''' હવે ઉપલ્ભધ છે.
  
 
|-
 
|-
| 10:23
+
| 10:23
I don’t want this image here. So, I’ll delete it by clicking on the image and pressing the''' Backspace''' or''' Delete''' key on my keyboard.
+
| મને આ ઈમેજો અહીં જોઈતી નથી. તેથી હું ઇમેજ પર ક્લિક કરીને મારા કીબોર્ડ પર ''' Backspace''' અથવા ''' Delete''' કી દબાવીને તેને રદ્દ કરીશ.
  
 
|-  
 
|-  
| 10:32
+
| 10:32
| Click on''' Save and keep published'''.
+
| ''' Save and keep published''' પર ક્લિક કરો.
  
 
|-
 
|-
| 10:35
+
| 10:35
| Once again, click on''' Configuration'''. Scroll down and click on''' Text formats and editor.'''
+
| ફરીથી એક વાર ''' Configuration''' પર ક્લિક કરો. નીચે સ્ક્રોલ કરીને ''' Text formats and editor''' પર ક્લિક કરો.
  
 
|-
 
|-
| 10:43
+
| 10:43
|This time let us configure the''' Full HTML toolbar.'''
+
| આ વખતે ચાલો ''' Full HTML toolbar''' કોન્ફીગર કરીએ.
  
 
|-
 
|-
| 10:47
+
| 10:47
| Notice that we have got a few more buttons here but not the''' Paste icons.'''
+
| નોંધ લો આપણને અમુક બીજા બટનો અહીં મળ્યા છે પરંતુ ''' Paste icons''' નથી.
  
 
|-
 
|-
| 10:52
+
| 10:52
|Click''' Show group names''' and click''' Add group''' on the second line this time.
+
| ''' Show group names''' પર ક્લિક કરો અને આ વખતે બીજી લાઈનમાંનાં ''' Add group''' પર ક્લિક કરો.
  
 
|-
 
|-
| 10:57
+
| 10:57
|Name it as “copy and paste”. Now we can click and drag these into our''' copy and paste''' section.
+
|તેને ''''' copy and paste”''' તરીકે નામ આપો. હવે આપણે આને ક્લિક કરીને આપણાં ''' copy and paste''' વિભાગમાં ડ્રેગ કરી શકીએ છીએ.
  
 
|-
 
|-
| 11:05
+
| 11:05
| Similarly down here, we have all these options again. For now, click on''' Save configuration''' button.
+
| એજપ્રમાણે અહીંયા, આપણી પાસે આ તમામ વિકલ્પો ફરીથી છે. હમણાં માટે, ''' Save configuration''' બટન પર ક્લીક કરો.
  
 
|-
 
|-
| 11:13
+
| 11:13
| Let’s go back to our''' Welcome to Drupalville''' again and change it to''' Full HTML.'''
+
| ચાલો ફરીથી આપણાં ''' Welcome to Drupalville''' પર પાછા જઈએ અને તેને ''' Full HTML''' માં બદલીએ.
  
 
|-
 
|-
| 11:18
+
| 11:18
| Click''' Continue.''' And now, we see two rows of buttons.
+
| ''' Continue''' પર ક્લિક કરો. અને હમણાં, આપણને બટનોની બે હરોળો દેખાય છે.
  
 
|-
 
|-
| 11:23
+
| 11:23
|This means our editor is all set.
+
| તેનો અર્થ એ છે કે આપણું એડિટર પૂર્ણપણે સુયોજિત છે.
  
 
|-
 
|-
| 11:26
+
| 11:26
| Take some time to play around with the''' CKEditor,''' and make sure that you understand it well.
+
| ''' CKEditor''' સાથે કામ કરવાનો સેજ સમય લો અને એ વાતની ખાતરી કરી લો કે તેને સારી રીતે સમજી શકો.
  
 
|-
 
|-
| 11:32
+
| 11:32
|With this we come to the end of this tutorial.   Let us summarize.
+
| આ સાથે જ અહીં આપણું આ ટ્યુટોરીઅલ સમાપ્ત થાય છે. ચાલો સારાંશ લઈએ.
  
 
|-
 
|-
| 11:37
+
| 11:37
|In this tutorial, we have learnt about:
+
| આ ટ્યુટોરીઅલમાં આપણે આપેલ વિશે શીખ્યા:'''Inline editing''','''CKEditor''' વાપરીને અને '''CKEditor''' કોન્ફીગર કરીને.
 
+
* Inline editing
+
* Using CKEditor and
+
* Configuring CKEditor
+
  
 
|-
 
|-
| 11:50
+
| 11:50
| This video is  adapted from '''Acquia''' and '''OSTraining''' and revised by Spoken Tutorial Project, IIT Bombay.
+
| આ વિડિઓ '''Acquia''' અને '''OSTraining''' માંથી અનુકૂલિત છે અને '''IIT''' બોમ્બે દ્વારા પુનરાવર્તિત કરાયેલ છે.
  
 
|-
 
|-
| 11:59
+
| 11:59
| The video at this link summarizes the Spoken Tutorial project. Please download and watch it.
+
| આપેલ લીંક પર ઉપલબ્ધ વિડિઓ નિહાળો આ સ્પોકન ટ્યુટોરીયલનો સારાંશ આપે છે. તેને ડાઉલોડ કરીને જુઓ.  
  
 
|-
 
|-
 
| 12:06
 
| 12:06
| The Spoken Tutorial Project Team conducts workshops and gives certificates. For more details, please write to us.
+
| સ્પોકન ટ્યુટોરીયલ ટીમ સ્પોકન ટ્યુટોરીયલનાં મારફતે ઓનલાઇન વર્કશોપો આયોજિત કરે છે. જેઓ ઓનલાઇન પરીક્ષા પાસ કરે છે તેઓને પ્રમાણપત્રો પણ આપે છે.વધુ વિગતો માટે અમને લખો.  
  
 
|-
 
|-
 
| 12:13
 
| 12:13
| Spoken Tutorial Project is funded by  NMEICT, Ministry of Human Resource Development
+
| સ્પોકન ટ્યુટોરીયલને '''NMEICT, Ministry of Human Resource Development''' અને '''NVLI, Ministry of Culture Government of India''' પાસેથી ફાળો આપવામાં આવ્યો છે.
and NVLI, Ministry of Culture Government of India.
+
 
|-
 
|-
 
| 12:25
 
| 12:25
| This is Varsha Venkatesh, signing off. Thanks for joining.
+
| આઈઆઇટી બોમ્બે તરફથી હું ભરતભાઈ સોલંકી વિદાય લઉં છું. જોડાવાબદ્દલ આભાર.
  
 
|}
 
|}

Latest revision as of 16:36, 14 October 2016

Time
Narration
00:01 Editing Existing Content પરનાં સ્પોકન ટ્યુટોરીયલમાં સ્વાગત છે.
00:06 આ ટ્યુટોરીયલમાં આપણે Inline editing વિશે શીખીશું.
00:10 CKEditor વાપરીને અને
00:12 CKEditor કોન્ફીગર કરીને.
00:15 આ ટ્યુટોરીયલ રેકોર્ડ કરવા માટે, હું વાપરી રહ્યો છું:Ubuntu Operating System , Drupal 8 અને Firefox વેબ બ્રાઉઝર.
00:24 તમે તમારા પસંદનું કોઈપણ વેબ બ્રાઉઝર વાપરી શકો છો.
00:28 ચાલો આપણે પહેલા બનાવેલી આપણી વેબસાઈટ ખોલીએ.
00:32 પહેલા, આપણે Inline Editing વિશે શીખીશું.
00:36 કર્સરને Title પર ફેરવો. જમણી બાજુએ, આપણને એક pencil icon દેખાશે.
00:43 જ્યારે આપણે Title પર માઉસ ફેરવીએ છીએ ત્યારે, તે આપણને block કોન્ફીગર કરવા માટે પૂછશે.
00:48 Configure block પર ક્લીક કરો. block Page Title માટે સામાન્ય બ્લોક છે.
00:54 આને બદલવાથી દરેક node પર Page Titles દ્રશ્યમાન થવાની રીત બદલાશે.
00:59 Go back to site પર ક્લીક કરો. અહીં pencil પર ફેરવો અને Configure block પર ક્લીક કરો.
01:06 તમને જો ટેબો બદલવા હોય તો, તમે તે અહીં બદલી શકો છો.
01:10 હું તેને એવું જ રહેવા દઈશ.
01:13 Back to site ક્લીક કરો.
01:16 હવે, Content area માં pencil પર ક્લીક કરો.
01:20 તમને ત્રણ વિકલ્પો દેખાશે – Quick edit, Edit અને Delete.
01:25 Quick editinline window માં front end એડિટિંગ છે.
01:29 Edit આપણને નોડ માટે મુખ્ય એડિટિંગ વિન્ડોમાં પાછી લઇ જાય છે.
01:33 Delete એ ખાતરી કર્યા પછીથી નોડને રદ્દ કરશે.
01:37 ચાલો આપણી નોડને આંતરિક શૈલીમાં એડિટ કરવા માટે Quick edit પર ક્લીક કરીએ.
01:41 જેમ આપણે માઉસ ફેરવશું, તે આપણને વ્યક્તિગત નોડનાં વિભિન્ન વિભાગોમાં લઇ જાય છે.
01:47 જ્યારે આપણે તેના પર ક્લીક કરીએ છીએ તો, આપણે વધુ કન્ટેન્ટને ઉમેરવા, સ્ત્રોતને જોવા અને ઉપરાંત અમુક ટેક્સ્ટને બોલ્ડ કરવામાં સમર્થ છીએ.
01:53 એકવાર આપણે ફેરફાર કરી લઈએ તો, Drupal તેને સંગ્રહવા માટે પૂછે છે. નોડને અપડેટ કરવા માટે Save પર ક્લીક કરો.
02:00 હવે, ચાલો article node ને બદલવાનું શીખીએ, માનો કે Welcome to Drupalville.
02:06 Quick edit પર ક્લીક કરો. નોંધ લો કે front end માં Title અને body ફીલ્ડો અહીં એડિટ કરી શકાય એવા છે.
02:14 પરંતુ આપણે ઇમેજને એડિટ કરી શકતા નથી.
02:17 ઇમેજને એડિટ કરવા માટે, આપણને edit screen માં જવું પડશે.
02:22 હવે આપણે body માં ફેરફાર કરી શકીએ છીએ અને તેને સંગ્રહીશું.
02:26 સાથે જ હું Quick edit વિન્ડોમાં tags પણ એડિટ કરી શકું છું.
02:30 Drupal માં ફ્રન્ટ એંડ એડિટિંગ સાદા એડિટો માટે યોગ્ય છે.
02:34 કન્ટેન્ટને કોઈપણ સમયે અપડેટ કરવા માટે Edit ટેબ એ Drupal ની એક ઉત્તમ વિશિષ્ટતા છે.
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 માં ઉપલબ્ધ ફોર્મેટિંગ વિકલ્પોનો વિચાર આપશે.
03:04 Drupal માં, CKEditor Drupal core સાથે આવે છે.
03:09 મૂળભૂત રીતે તે ચાલુ હોય છે અને કોન્ફીગર કરી શકાય એવી હોય છે.
03:14 ચાલો એક નજર ફેરવી લઈએ. "Welcome to our site" આ ટેક્સ્ટને હાઈલાઈટ કરો.
03:20 ફોર્મેટ Normal માંથી Heading 2 માં બદલો.
03:24 તુરત જ, ટેક્સ્ટ કેવી દેખાશે તેનો પ્રિવ્યું Drupal આપે છે.
03:30 આ નિશ્ચિત થાય છે theme અને cascading style sheets અથવા CSS દ્વારા જે કે આપણને થીમ દ્વારા અપાય છે.
03:38 ચાલો અહીં અમુક વધુ ટેક્સ્ટ ઉમેરીએ, “Editing Drupal nodes is really fun!”.
03:44 હવે તે ટેક્સ્ટને હાઈલાઈટ કરો, Italics ને બંધ કરો અને તે ટેક્સ્ટ માટે એક hyperlink બનાવો.
03:52 અહીં, ચાલો માનો કે, http://drupal.org/ . Save પર ક્લીક કરો.
04:00 માઉસને ફેરવો અને નોંધ લો કે ટેક્સ્ટ હવે hyperlinked છે.
04:04 hyperlink ને રદ્દ કરવા માટે, ટેક્સ્ટને હાઈલાઈટ કરો અને Unlink પર ક્લીક કરો.
04:10 ફેરફારને undo કરવા માટે Ctrl+Z દાબો.
04:14 આપણે અહીં Bullets and numbering icons પર ક્લીક કરીને ordered અને unordered lists પણ ઉમેરી શકીએ છીએ.
04:21 Unordered list પર ક્લીક કરો. ત્યારબાદ bullets - one, two, three ઉમેરો.
04:28 આગળ, Ordered list પર ક્લીક કરો અને one, two અને three ઉમેરો.
04:34 Block quotes વાપરવા માટે, અમુક ટેક્સ્ટને હાઈલાઈટ કરો અને Block Quote લીંક પર ક્લીક કરો.
04:40 ફરી એક વાર, ફોર્મેટિંગ આપણી theme દ્વારા વ્યવસ્થાપિત થાય છે.
04:46 આપણે ઇમેજને પણ સરળતાથી દાખલ કરી શકીએ છીએ. મેં આ ફાઈલને પસંદ કરી છે જેને મેં પહેલી node પર અપલોડ કરી હતી.
04:56 Alternate Text ફિલ્ડમાં, હું ટાઈપ કરીશ “Drupal Logo”.
05:02 Align અંતર્ગત, હું Right પસંદ કરીશ. જો તમને જોઈએ તો એક Caption ઉમેરો.
05:08 છેલ્લે, Save પર ક્લીક કરો.
05:12 હવે આ body અંતર્ગત node માં ઉમેરાઈ ગયું છે. ઇમેજ પર માઉસ ફેરવો, જો તમે ચાહો તો તેને ક્લીક કરીને તેને નવી જગ્યાએ ડ્રેગ કરો.
05:22 આપણને સૌ પહેલા આપણા એડિટિંગ વિન્ડોને સેજ માપસર કરવું પડશે, જેથી કરીને આપણે આપણી ઇમેજને જોઈએ એ સ્થાને ડ્રેગ કરી શકીએ.
05:30 ઇમેજ પર માઉસ ફેરવવાથી પણ આપણી ઈમેજોને resize કરવાની પરવાનગી મળે છે.
05:36 આપણા Drupal node માં ઈમેજો ઉમેરીએ એ પહેલા, એ વાતની ખાતરી કરી લો કે આપણી ઇમેજ બરાબરથી માપસર કરેલ અને ફોર્મેટ કરેલ હોય.
05:43 જેનાથી node પર કન્ટેન્ટને અલાઇન કરવામાં ઘણી મદદ મળશે.
05:47 આપણે એક table અથવા horizontal line ઉમેરી શકીએ છીએ.
05:51 અને 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 કન્ટેન્ટ હંમેશા માટે ખોવાઈ જાય કે રદ્દ થઇ જાય એવી શક્યતા છે.
06:26 માનો કે, આપણે દાખલ કરી છે એક JavaScript, I-frame, youtube video, એક google map અથવા એના જ જેવું કંઈક.
06:33 Basic HTML માં બદલવાથી, Drupal આ કન્ટેન્ટને રદ્દ કરશે.
06:38 આવી સમસ્યાને ઉકેલવા માટે, ફક્ત એ જ રાખો જે ખરેખર તમને જોઈએ છે.
06:43 ચાલો સેટિંગ્સમાં કરેલ ફેરફારને રદ્દ કરીએ, જેથી આપણું કંઈપણ ખોવાશે નહીં.
06:48 Drupal સાથે આવેલ CKEditor નું આ એક ઝડપી ઓવરવ્યુ છે.
06:52 અને આપણે શીખ્યા કે તેને કેવી રીતે કસ્ટમાઇઝ કરવું.
06:55 હવે Save and keep published પર ક્લીક કરો.
06:58 મોડીફાય કરેલ node દ્રશ્યમાન થાય છે.
07:01 આગળ ચાલો CKEditor ને કોન્ફીગર કરતા શીખીએ.
07:05 ઉપર આવેલ Configuration પર ચાલો ક્લીક કરીએ.
07:09 હવે Text formats and editors પર ક્લીક કરો.
07:13 આપણે નોંધ લેશું કે Basic HTML અને Full HTML CKEditor ને વાપરે છે.
07:19 અને, તે Authenticated User અને Administrator ને એસાઇન કરાયેલું છે.
07:24 આ બે અનન્ય user roles છે.
07:27 Drupal માં, આપણો યુઝર વિભિન્ન ભૂમિકા ભજવે છે અને દરેક ભૂમિકાને પરવાનગીઓ અપાયી છે.
07:34 આ કિસ્સામાં, Authenticated user અને Administrator દ્વારા Basic HTML નો ઉપયોગ થઇ શકે છે.
07:41 CKEditor ને આ 2 ભૂમિકાઓ માટે એસાઇન કરાયું છે.
07:45 એજ પ્રમાણે, Administrator દ્વારા Full HTML નો ઉપયોગ થઇ શકે છે.
07:50 હવે, ચાલો Basic HTML માટે CKEditor ચેક કરીએ.
07:54 Configure પર ક્લીક કરો અને તમે તેને વિભિન્ન ભૂમિકાઓને એસાઇન કરવા માટે સમર્થ બનાવશો.
07:59 તમને જોઈતું કોઈપણ Text editor એસાઇન કરો. અને ત્યારબાદ તેને એ બટનો માટે પરવાનગી આપો જેને તમે વાપરવા માટે પરવાનગીઓ આપો છો.
08:07 યાદ કરો - આ Active toolbar છે જે આપણી પાસે હતું, Basic HTML Text Format માટે Authenticated User માટે.
08:15 કેટલાક બટનોને જો આપણા Active toolbar માં ઉમેરવા હોય તો શું કરી શકાય? આ અત્યંત સરળ છે.
08:21 Available buttons માંથી Paste from Word આઇકોન પસંદ કરીએ.
08:26 ત્યારબાદ જ્યાંસુધી ભૂરું બોક્સ ખુલતું નથી ત્યાંસુધી, માઉસને ક્લીક કરીને ડ્રેગ કરો જ્યાં આપણે આઇકોનને ઉમેરી શકીએ છીએ.
08:33 નવું ગ્રુપ ઉમેરવા માટે, Add group બટન પર ક્લીક કરો. તેને “copy and paste” નામ આપો અને Apply પર ક્લીક કરો.
08:41 હવે, copy and paste વિભાગમાં Paste from Word આઇકોન ક્લીક કરીને ડ્રેગ કરો.
08:47 ચાલો હવે અહીં તમામ paste icons ઉમેરીએ.
08:51 તો, Basic HTML format માટે આપણે ત્રણ નવા બટનો આપણા બારમાં ઉમેર્યા છે.
08:57 Paste icons એક એવું કઈ છે જે દરેક ટુલબારની જરૂરિયાત છે.કારણકે ઘણી ટેક્સ્ટ ફાઈલો માંથી કોપી અને પેસ્ટ થાય છે.
09:04 આપણે inline-images. પણ અપલોડ કરીએ છીએ અને અપલોડ ઈમેજો નું મહત્તમ માપ 32MB તેમજ પહોળાઈ અને ઉંચાઈ કઇં પણ હોઈ શકે છે.
09:14 મહત્તમ માપ તમારા ઈન્સ્ટોલેશનમાં હોય એનાથી જુદું હોઈ શકે છે.
09:18 આપણી પસંદગી મુજબ આપણે આ સેટીંગો માની કોઈ પણ સેટિંગ અહીં બદલી શકીએ છીએ.
09:23 માનો કે URL મેન્યુલી લિંક કરવાના બદલે આપણે હંમેશા તેને એક લિંકમાં બદલવા ઇચ્છતા હોઈએ છીએ.
09:29 આ આપણને Convert URLs into links વિકલ્પ પર ક્લિક કરીને કરી શકીએ છીએ.
09:34 અહીં આપણી પાસે Filter settings. છે ચાલો Limit allowed HTML tags. પર ક્લિક કરો.
09:41 હવે આપણે HTML tags ઉમેરવા માટે સમર્થ રહીશું જે કે આપણે તયારે વાપરી શકીશું જયારે આપણે સોર્સ તરફે જોશું.
09:47 તો આ ખરેખર શક્તિશાળી WYSIWYG editor અને તેનો કોન્ફીગ્રેશન વિસ્તાર છે.
09:54 એક વાર તમામ ફેરફારો કર્યા બાદ Save configuration બટન પર ક્લિક કરો.
09:59 ચાલો હવે આપણાં Content. તરફે જોઈએ.
10:02 Welcome to Drupalville node. માં Edit વિકલ્પ પર ક્લિક કરો.
10:07 નોંધ લો જો કે આપણે Full HTML ચાલુ રાખ્યું હોત તો કઈ પણ બદલાયું નથી.
10:12 ચાલો હવે આને Basic HTML.માં બદલીએ કરેલા તમામ ફેરફારો હજી સુંધી છે.
10:18 જો કે મારુ blocks હવે દેખાતું નથી તો Paste icons હવે ઉપલ્ભધ છે.
10:23 મને આ ઈમેજો અહીં જોઈતી નથી. તેથી હું ઇમેજ પર ક્લિક કરીને મારા કીબોર્ડ પર Backspace અથવા Delete કી દબાવીને તેને રદ્દ કરીશ.
10:32 Save and keep published પર ક્લિક કરો.
10:35 ફરીથી એક વાર Configuration પર ક્લિક કરો. નીચે સ્ક્રોલ કરીને Text formats and editor પર ક્લિક કરો.
10:43 આ વખતે ચાલો Full HTML toolbar કોન્ફીગર કરીએ.
10:47 નોંધ લો આપણને અમુક બીજા બટનો અહીં મળ્યા છે પરંતુ Paste icons નથી.
10:52 Show group names પર ક્લિક કરો અને આ વખતે બીજી લાઈનમાંનાં Add group પર ક્લિક કરો.
10:57 તેને copy and paste” તરીકે નામ આપો. હવે આપણે આને ક્લિક કરીને આપણાં copy and paste વિભાગમાં ડ્રેગ કરી શકીએ છીએ.
11:05 એજપ્રમાણે અહીંયા, આપણી પાસે આ તમામ વિકલ્પો ફરીથી છે. હમણાં માટે, Save configuration બટન પર ક્લીક કરો.
11:13 ચાલો ફરીથી આપણાં Welcome to Drupalville પર પાછા જઈએ અને તેને Full HTML માં બદલીએ.
11:18 Continue પર ક્લિક કરો. અને હમણાં, આપણને બટનોની બે હરોળો દેખાય છે.
11:23 તેનો અર્થ એ છે કે આપણું એડિટર પૂર્ણપણે સુયોજિત છે.
11:26 CKEditor સાથે કામ કરવાનો સેજ સમય લો અને એ વાતની ખાતરી કરી લો કે તેને સારી રીતે સમજી શકો.
11:32 આ સાથે જ અહીં આપણું આ ટ્યુટોરીઅલ સમાપ્ત થાય છે. ચાલો સારાંશ લઈએ.
11:37 આ ટ્યુટોરીઅલમાં આપણે આપેલ વિશે શીખ્યા:Inline editing,CKEditor વાપરીને અને CKEditor કોન્ફીગર કરીને.
11:50 આ વિડિઓ Acquia અને OSTraining માંથી અનુકૂલિત છે અને IIT બોમ્બે દ્વારા પુનરાવર્તિત કરાયેલ છે.
11:59 આપેલ લીંક પર ઉપલબ્ધ વિડિઓ નિહાળો આ સ્પોકન ટ્યુટોરીયલનો સારાંશ આપે છે. તેને ડાઉલોડ કરીને જુઓ.
12:06 સ્પોકન ટ્યુટોરીયલ ટીમ સ્પોકન ટ્યુટોરીયલનાં મારફતે ઓનલાઇન વર્કશોપો આયોજિત કરે છે. જેઓ ઓનલાઇન પરીક્ષા પાસ કરે છે તેઓને પ્રમાણપત્રો પણ આપે છે.વધુ વિગતો માટે અમને લખો.
12:13 સ્પોકન ટ્યુટોરીયલને NMEICT, Ministry of Human Resource Development અને NVLI, Ministry of Culture Government of India પાસેથી ફાળો આપવામાં આવ્યો છે.
12:25 આઈઆઇટી બોમ્બે તરફથી હું ભરતભાઈ સોલંકી વિદાય લઉં છું. જોડાવાબદ્દલ આભાર.

Contributors and Content Editors

Bharat636, Jyotisolanki