Difference between revisions of "Drupal/C3/Menu-and-Endpoints/English"
(Created page with "'''Title:''' Menu and Endpoints '''Keywords: Drupal, Video tutorial, URL paths, Pathauto, Token, Menu, System, Content''' {| style="border-spacing:0;" | style="border:1pt...") |
Nancyvarkey (Talk | contribs) |
||
Line 22: | Line 22: | ||
+ | | style="border:1pt solid #000000;padding:0.097cm;"| In this tutorial, we will learn to set up '''URL Patterns.''' | ||
− | |||
− | |||
− | |||
We will also learn about '''Menu management'''. | We will also learn about '''Menu management'''. | ||
− | |||
− | |||
− | |||
|- | |- | ||
Line 36: | Line 31: | ||
System requirement | System requirement | ||
− | |||
| style="border:1pt solid #000000;padding:0.097cm;"| To record this tutorial, I am using | | style="border:1pt solid #000000;padding:0.097cm;"| To record this tutorial, I am using | ||
− | + | * '''Ubuntu Linux''' Operating System | |
− | * Ubuntu Linux Operating System | + | * '''Drupal''' 8 and |
− | * Drupal 8 and | + | * '''Firefox''' Web browser |
− | * Firefox Web browser | + | |
You can use any web browser as per your choice. | You can use any web browser as per your choice. | ||
Line 54: | Line 47: | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| In this tutorial, we will talk about the process of creating proper''' URL paths''' for our''' website'''. | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| In this tutorial, we will talk about the process of creating proper''' URL paths''' for our''' website'''. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Slide | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| '''Endpoints''' and '''aliases'''. | ||
− | Endpoints | + | *'''Endpoints''' are '''URL paths''' which display a particular content. |
+ | *By default in '''Drupal''', the '''endpoint''' of a '''node''' is '''node/[node:id]'''. | ||
+ | *Sending this to a server will display the contents of the '''node'''. | ||
+ | *A number in the '''ID''' is not human readable. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Slide | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | ||
− | + | *That is, we cannot easily associate a particular content with say, '''node/278162''' | |
+ | *A human readable '''endpoint''' is available by creating an '''alias'''. | ||
+ | *'''Alias''' is an alternate '''URL path''' for the same content. | ||
+ | *We can use either the original or any one of several '''aliases,''' for displaying the same content. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Slide | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | ||
− | + | *For example '''node/278162''' and '''content/drupal-camp-mumbai-2015''' | |
+ | *Both return the same content. | ||
+ | *The second one is easy to remember. | ||
− | + | |- | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Let us now create '''URL patterns''' that will apply to all the contents we have. | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | Let us now create URL patterns that will apply to all the contents we have. | + | |
|- | |- | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| 00:30 | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| 00:30 | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Setting up''' URL paths''' | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Setting up''' URL paths''' require three''' modules'''. |
|- | |- | ||
Line 125: | Line 112: | ||
− | Down here on the left hand side, under the''' SEARCH''' '''AND METADATA''' section, | + | Down here on the left hand side, under the''' SEARCH''' '''AND METADATA''' section, you will see''' URL aliases'''. |
|- | |- | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click on '''Patterns >> Add Pathauto pattern''' |
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| By default there are no URL aliases available. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| By default, there are no '''URL aliases''' available. |
Line 137: | Line 124: | ||
Click on the '''Add Pathauto pattern '''button. | Click on the '''Add Pathauto pattern '''button. | ||
− | + | |- | |
− | Click on the '''Pattern type''' drop down. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"|Click on '''Pattern type''' drop down >> point to the options |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"|Click on the '''Pattern type''' drop down. | ||
Here we can create separate patterns for '''Forum, Content, Taxonomy term''' and '''User'''. | Here we can create separate patterns for '''Forum, Content, Taxonomy term''' and '''User'''. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click '''Content >> Path pattern field''' | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| For example, I will select '''Content'''. | ||
− | |||
+ | In the '''Path pattern field''', we have to provide the pattern template. | ||
− | + | |- | |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Template variables are called as '''tokens'''. | ||
− | + | They are dynamically generated for each '''entity'''. | |
− | + | |- | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Point to '''Browse available tokens''' | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| '''Token module''' provides these variables. | |
− | + | ||
− | '''Token''' | + | |
When you see '''Browse available tokens''' in any input form, you can insert pre-defined '''tokens'''. | When you see '''Browse available tokens''' in any input form, you can insert pre-defined '''tokens'''. | ||
− | + | |- | |
− | Click on the '''Path pattern''' box where you want to insert a '''token'''. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click '''Path pattern''' box >> Type '''content/.''' >> Click '''Browse available tokens''' |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click on the '''Path pattern''' box where you want to insert a '''token'''. | ||
Line 170: | Line 162: | ||
Then click on the '''Browse available tokens''' link. | Then click on the '''Browse available tokens''' link. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| A popup window opens up to show the '''Available tokens'''. | ||
− | + | |- | |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Point to '''Nodes''' | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Suppose we want a pattern like '''content/[title of the page]''' | ||
− | + | The '''token''' for the title of the page is under the '''Nodes''' section. | |
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click on the right arrow | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click on the right arrow button of the '''Nodes '''section. | ||
− | + | |- | |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Choose '''token [node:title]''' | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Choose the '''token [node:title]''' which will be replaced by the '''Title '''of the page. | ||
− | + | This will insert '''[node:title]'''at the cursor location in the form box. | |
− | + | |- | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Select '''token''' | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| If this does not happen, make sure to click on the box and position the cursor as required. | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | If this does not happen, make sure to click on the box and position the cursor as required. | + | |
Then select the '''token''' again. | Then select the '''token''' again. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Point to '''Content type''' | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Under '''Content type''', we can select to which '''entity type''' this pattern should be applied. | ||
− | |||
+ | Let us select all the '''types''' so that this pattern is default for all of them. | ||
− | + | |- | |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| This setting can also be overridden for a particular '''type'''. | ||
− | + | Example: we can create '''usergroup/[node:title]'''and apply it only for '''User Group.''' | |
− | + | |- | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| '''Label field'''>>type '''Content Title,''' >> click '''Save''' | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| In the '''Label field''', type '''Content Title,''' then click on the '''Save''' button. | |
− | + | ||
− | In the '''Label''' | + | |
Here, we can check the new pattern we just created. | Here, we can check the new pattern we just created. | ||
− | + | |- | |
− | This pattern will be applied to generate '''URL aliases''' for all newly added content. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| This pattern will be applied to generate '''URL aliases''' for all newly added content. | ||
But it will not create the '''URL aliases''' for existing contents. | But it will not create the '''URL aliases''' for existing contents. | ||
+ | |- | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click '''Bulk generate''' >> select '''Content type''' >> click on '''Update''' | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| To apply it for the existing contents, click on the '''Bulk generate''' tab. | ||
− | |||
+ | Select '''Content type''' and click on the '''Update''' button. | ||
− | + | |- | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| | |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| It is started generating the '''URL aliases'''. | |
− | It is started generating the '''URL aliases'''. | + | |
It can take a while depending on the number of existing contents. | It can take a while depending on the number of existing contents. | ||
− | + | |- | |
− | Now click on the '''List''' tab. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click '''List''' |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Now click on the '''List''' tab. | ||
We can see that the''' URL aliases''' for our content. | We can see that the''' URL aliases''' for our content. | ||
− | + | |- | |
− | Each''' node''' on our''' site''' has a system path of''' /node/nodeid'''. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Each''' node''' on our''' site''' has a system path of''' /node/nodeid'''. | ||
The newly generated '''URL alias '''is there in the first '''Alias''' column. | The newly generated '''URL alias '''is there in the first '''Alias''' column. | ||
− | + | |- | |
− | We can see that all the''' aliases''' follow the same''' pattern.''' | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Scroll and show all the '''aliases''' |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| We can see that all the''' aliases''' follow the same''' pattern.''' | ||
You have to do this each time you create a new''' Content type.''' | You have to do this each time you create a new''' Content type.''' | ||
− | + | |- | |
− | Use the following thumb rules to create '''patterns'''. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Slide |
− | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Use the following thumb rules to create '''patterns'''. | |
* Use lower case words | * Use lower case words | ||
* Do not give space between words | * Do not give space between words | ||
− | * Separate words by hyphen and not underscore | + | * Separate words by hyphen and not '''underscore''' |
− | * Use meaningful, human readable words in the URL for search engine optimisation (SEO) | + | * Use meaningful, human readable words in the '''URL''' for '''search engine optimisation (SEO)''' |
* Use '''date tokens''' for contents classified by time | * Use '''date tokens''' for contents classified by time | ||
− | There are more options available to control the URL alias pattern in the '''Settings''' tab. | + | |- |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Click on '''Settings''' >> point to the options | ||
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| There are more options available to control the '''URL alias''' pattern in the '''Settings''' tab. | ||
− | Here we can see default | + | Here we can see default '''Separator, length''' etc. |
− | + | |- | |
− | We also see that by default several common words are removed from the pattern. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| Scroll to show |
+ | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.159cm;padding-right:0.185cm;"| We also see that by default several common words are removed from the pattern. | ||
− | This is to keep the endpoint compact and meaningful. | + | This is to keep the '''endpoint''' compact and meaningful. |
|- | |- | ||
Line 319: | Line 328: | ||
|- | |- | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 00:41 | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 00:41 | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Here we will be able to click and drag and re-order our''' | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Here we will be able to click and drag and re-order our''' Menu links'''. |
|- | |- | ||
Line 359: | Line 368: | ||
|- | |- | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 1:27 | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 1:27 | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Please remember, not all''' themes''' | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Please remember, not all''' themes''' in''' Drupal''' support''' sub menus''' or''' dropdown menus.''' |
Line 366: | Line 375: | ||
|- | |- | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 1:40 | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 1:40 | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| For now, go back to''' Structure, Menus''' and edit the''' | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| For now, go back to''' Structure, Menus''' and edit the''' Main menu.''' |
Line 396: | Line 405: | ||
− | + | All the''' nodes''' that start with that letter, will show up. | |
|- | |- | ||
Line 423: | Line 432: | ||
|- | |- | ||
| style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 3:58 | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| 3:58 | ||
− | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Click''' Save. '''Let’s just double check if that works and indeed it does. | + | | style="background-color:#ffffff;border:1pt solid #000000;padding-top:0.185cm;padding-bottom:0.185cm;padding-left:0.132cm;padding-right:0.185cm;"| Click''' Save. ''' |
+ | |||
+ | Let’s just double check if that works and indeed it does. | ||
|- | |- | ||
Line 430: | Line 441: | ||
− | With this in our''' menu system,''' it will be easier to create''' | + | With this in our''' menu system,''' it will be easier to create''' Menu item''' for a''' View''' or a''' Content Type.''' |
|} | |} | ||
Line 449: | Line 460: | ||
In this tutorial we learnt about | In this tutorial we learnt about | ||
− | * Setting up URL Patterns | + | * Setting up '''URL Patterns''' |
− | * Menu management | + | * '''Menu management''' |
− | + | ||
− | + | ||
|- | |- | ||
Line 458: | Line 467: | ||
Acknowledgement | Acknowledgement | ||
− | |||
− | |||
| style="border:1pt solid #000000;padding:0.097cm;"| This video is | | style="border:1pt solid #000000;padding:0.097cm;"| This video is | ||
Line 465: | Line 472: | ||
* adapted from Acquia and OSTraining | * adapted from Acquia and OSTraining | ||
* and revised by Spoken Tutorial Project, IIT Bombay. | * and revised by Spoken Tutorial Project, IIT Bombay. | ||
− | |||
− | |||
|- | |- | ||
Line 496: | Line 501: | ||
Acknowledgement | Acknowledgement | ||
− | |||
− | |||
| style="border:1pt solid #000000;padding:0.097cm;"| Spoken Tutorial Project is funded by | | style="border:1pt solid #000000;padding:0.097cm;"| Spoken Tutorial Project is funded by |
Latest revision as of 12:14, 22 July 2016
Title: Menu and Endpoints
Keywords: Drupal, Video tutorial, URL paths, Pathauto, Token, Menu, System, Content
|
|
Slide 1:
Menu and Endpoints |
Welcome to the Spoken tutorial on Menu and Endpoints. |
Slide 2:
Learning Objectives
|
In this tutorial, we will learn to set up URL Patterns.
|
Slide 3:
System requirement
|
To record this tutorial, I am using
You can use any web browser as per your choice. |
00:18 | In this tutorial, we will talk about the process of creating proper URL paths for our website. |
Slide | Endpoints and aliases.
|
Slide |
|
Slide |
|
Let us now create URL patterns that will apply to all the contents we have. | |
00:30 | Setting up URL paths require three modules. |
00:35 | Those three modules are the Pathauto, Token and CTools. |
1:03 | Pls go ahead and get the Pathauto installed on your machine. |
1:06 | Come back to the Pathauto project page.
|
1:22 | Install Token and CTools.
|
1:29 | Once we have done that, we are ready to go. |
1:33 | Click on Configuration.
|
Click on Patterns >> Add Pathauto pattern | By default, there are no URL aliases available.
|
Click on Pattern type drop down >> point to the options | Click on the Pattern type drop down.
|
Click Content >> Path pattern field | For example, I will select Content.
|
Template variables are called as tokens.
| |
Point to Browse available tokens | Token module provides these variables.
|
Click Path pattern box >> Type content/. >> Click Browse available tokens | Click on the Path pattern box where you want to insert a token.
|
A popup window opens up to show the Available tokens. | |
Point to Nodes | Suppose we want a pattern like content/[title of the page]
|
Click on the right arrow | Click on the right arrow button of the Nodes section. |
Choose token [node:title] | Choose the token [node:title] which will be replaced by the Title of the page.
|
Select token | If this does not happen, make sure to click on the box and position the cursor as required.
|
Point to Content type | Under Content type, we can select to which entity type this pattern should be applied.
|
This setting can also be overridden for a particular type.
| |
Label field>>type Content Title, >> click Save | In the Label field, type Content Title, then click on the Save button.
|
This pattern will be applied to generate URL aliases for all newly added content.
| |
Click Bulk generate >> select Content type >> click on Update | To apply it for the existing contents, click on the Bulk generate tab.
|
It is started generating the URL aliases.
| |
Click List | Now click on the List tab.
|
Each node on our site has a system path of /node/nodeid.
| |
Scroll and show all the aliases | We can see that all the aliases follow the same pattern.
|
Slide | Use the following thumb rules to create patterns.
|
Click on Settings >> point to the options | There are more options available to control the URL alias pattern in the Settings tab.
|
Scroll to show | We also see that by default several common words are removed from the pattern.
|
3:16 | To summarise -
Pathauto and Token modules allow us to
at any time. |
3:29 | From now onwards, every new node will use the patterns that we have established. |
00:05 | Now, we will talk about the Menus. |
00:07 | We have been adding menus to our site, in a random order, mostly based on the Views and basic pages. |
00:18 | Now, let’s see how we can manage the menu system. |
00:22 | Go to Structure, scroll down and click on Menus. |
00:28 | We have a number of different menus here that comes with Drupal, by default.
|
00:34 | We are interested in the Main navigation menu.
|
00:41 | Here we will be able to click and drag and re-order our Menu links. |
00:48 | Let’s drag Home and Upcoming Events to the top. |
00:54 | You can re-order these, in any way you want.
|
1:01 | Now we have got Events and Upcoming Events.
|
1:12 | That’s pretty simple.
|
1:19 | Notice that now, we have got four menus. |
1:23 | Where did our Event sub menu go? |
1:27 | Please remember, not all themes in Drupal support sub menus or dropdown menus.
|
1:40 | For now, go back to Structure, Menus and edit the Main menu.
|
2:16 | What if we need a link to a particular node or to a particular section of our site? |
2:36 | For instance if I wanted a menu link for my Forums, I would first go back to the site. |
2:41 | Go to the Forums page and copy the actual URL, which is just /forum |
2:53 | Then come back over and click on Edit menu and then on Add link. |
2:58 | Give it a title called Forum and paste the copied link. |
3:03 | If you are looking at a specific piece of content, just type a letter like F or G.
|
3:15 | Say for instance if we type an a , all the nodes that have a in the title, will show up. |
3:22 | We can just select the one we are looking for and it will tell us that its node id number 1. |
3:28 | If we want an internal path, such as the ability to add a node, then it would be /node/add. |
3:36 | If we want to link it to the Homepage, it will be front.
|
3:51 | Click Save and now we have a link to the Forum |
3:58 | Click Save.
Let’s just double check if that works and indeed it does. |
4:06 | So play around a little bit, to understand it better.
|
With this we come to the end of this tutorial. | |
Slide 5:
Summary
|
Let us summarize.
|
Slide 6:
Acknowledgement |
This video is
|
Slide 7:
Acknowledgement
|
The video at this link summarises the Spoken Tutorial project.
|
Slide 8:
Spoken Tutorial Workshops
|
The Spoken Tutorial Project Team conducts workshops and gives certificates.
|
Slide 9:
Acknowledgement |
Spoken Tutorial Project is funded by
Government of India. |
This is Calvin Nikhil Tomy signing off.
|