Difference between revisions of "Joomla/C2/Menus-in-Joomla/English-timed"
From Script | Spoken-Tutorial
Venuspriya (Talk | contribs) |
Jyotisolanki (Talk | contribs) |
||
(5 intermediate revisions by 3 users not shown) | |||
Line 5: | Line 5: | ||
|- | |- | ||
|| 00:01 | || 00:01 | ||
− | || Welcome to the Spoken Tutorial on ''' | + | || Welcome to the '''Spoken Tutorial''' on understanding '''menus in Joomla.''' |
|- | |- | ||
|| 00:06 | || 00:06 | ||
− | || In this tutorial, we will learn about: '''Menus''' and their importance in '''Joomla''' | + | || In this tutorial, we will learn about: |
+ | |||
+ | '''Menus''' and their importance in '''Joomla''', | ||
+ | |||
+ | '''Menu Manager''' and how to create '''menu items'''. | ||
|- | |- | ||
|| 00:16 | || 00:16 | ||
− | || We will also learn how to: | + | || We will also learn how to: |
+ | |||
+ | create '''sub-menus''', | ||
+ | |||
+ | change the default '''Homepage''' and Unpublish '''menu items'''. | ||
|- | |- | ||
|| 00:25 | || 00:25 | ||
− | || For this tutorial, we will be using: '''Ubuntu Linux OS | + | || For this tutorial, we will be using: |
+ | |||
+ | '''Ubuntu Linux OS 14.04''', | ||
+ | |||
+ | '''Joomla 3.4.1''', | ||
+ | |||
+ | '''Apache, MySQL''' and '''PHP''' obtained through '''XAMPP 5.5.19'''. | ||
|- | |- | ||
|| 00:41 | || 00:41 | ||
− | || To follow this tutorial | + | || To follow this tutorial, you should know how to create '''articles''' in '''Joomla'''. |
|- | |- | ||
Line 37: | Line 51: | ||
|- | |- | ||
|| 01:01 | || 01:01 | ||
− | || It currently has only one ''' | + | || It currently has only one menu, '''"Home"'''. By default, this is the only '''menu''' available in '''Joomla'''. |
|- | |- | ||
|| 01:10 | || 01:10 | ||
− | || '''Menus''' are a way to help us navigate the website. Every | + | || '''Menus''' are a way to help us navigate the website. Every menu has a set of menu items. |
− | Here '''"Home"''' is a '''menu item''' | + | |
+ | |- | ||
+ | || 01:16 | ||
+ | ||Here '''"Home"''' is a '''menu item''' which points to all '''Featured articles.''' | ||
|- | |- | ||
Line 89: | Line 106: | ||
|- | |- | ||
− | || 02: | + | || 02:18 |
|| Let’s create a '''menu item''' which will point to our '''article "Benefits of Nutrients"'''. | || Let’s create a '''menu item''' which will point to our '''article "Benefits of Nutrients"'''. | ||
Line 106: | Line 123: | ||
|- | |- | ||
|| 02:40 | || 02:40 | ||
− | || Click on '''Select''' button next to the '''Menu Item Type'''. | + | || Click on '''Select''' button, next to the '''Menu Item Type'''. |
|- | |- | ||
Line 130: | Line 147: | ||
|- | |- | ||
|| 03:06 | || 03:06 | ||
− | || This is a mandatory field. Click on '''Select''' button next to this field. | + | || This is a mandatory '''field'''. Click on '''Select''' button, next to this field. |
|- | |- | ||
Line 138: | Line 155: | ||
|- | |- | ||
|| 03:15 | || 03:15 | ||
− | || This window has a | + | || This window has a '''Search''' text box which works on the title of the '''article'''. |
|- | |- | ||
|| 03:20 | || 03:20 | ||
− | || It also has | + | || It also has '''filter'''s to narrow down the list of '''articles''' visible in the window. |
|- | |- | ||
|| 03:25 | || 03:25 | ||
− | || Let’s select the ''' | + | || Let’s select the article '''Benefits of Nutrients'''. |
|- | |- | ||
Line 158: | Line 175: | ||
|- | |- | ||
|| 03:39 | || 03:39 | ||
− | || Let us type '''Single Article - Nutrients''' as the '''title'''. | + | || Let us type: '''Single Article - Nutrients''' as the '''title'''. |
|- | |- | ||
Line 166: | Line 183: | ||
|- | |- | ||
|| 03:46 | || 03:46 | ||
− | || Switch to '''Digital India''' | + | || Switch to '''Digital India''' web-page and '''refresh''' it. |
|- | |- | ||
Line 174: | Line 191: | ||
|- | |- | ||
|| 03:54 | || 03:54 | ||
− | || We can see the ''' | + | || We can see the article '''Benefits of Nutrients''' is displayed here. |
|- | |- | ||
Line 190: | Line 207: | ||
|- | |- | ||
|| 04:11 | || 04:11 | ||
− | || So, click on the ''' | + | || So, click on the title '''Single Article-Nutrients'''. |
|- | |- | ||
|| 04:16 | || 04:16 | ||
− | || Click on the '''Select''' next to '''Menu Item Type.''' | + | || Click on the '''Select''', next to '''Menu Item Type.''' |
|- | |- | ||
Line 210: | Line 227: | ||
|- | |- | ||
|| 04:34 | || 04:34 | ||
− | || This is the | + | || This is the category whose '''subcategories''' will be listed under this '''menu item'''. |
|- | |- | ||
Line 230: | Line 247: | ||
|- | |- | ||
|| 04:52 | || 04:52 | ||
− | ||Switch to the '''Digital India''' | + | ||Switch to the '''Digital India''' web-page and refresh it. |
|- | |- | ||
Line 258: | Line 275: | ||
|- | |- | ||
|| 05:26 | || 05:26 | ||
− | || The ''' | + | || The article '''Benefits of Nutrients''' and '''subcategories Vitamins''' and '''Minerals''' are shown up. |
|- | |- | ||
|| 05:32 | || 05:32 | ||
− | ||Click on '''Digital India''' link at the top left to go back to the '''Homepage''' | + | ||Click on '''Digital India''' link at the top left to go back to the '''Homepage'''. |
|- | |- | ||
Line 306: | Line 323: | ||
|- | |- | ||
||06:18 | ||06:18 | ||
− | ||On the right, there is a field to select the '''parent item'''.Click on it. Then select the option '''Multiple Categories.''' | + | ||On the right, there is a '''field''' to select the '''parent item'''. Click on it. Then select the option '''Multiple Categories.''' |
|- | |- | ||
||06:27 | ||06:27 | ||
− | ||Lastly let's give this '''menu''' a '''title''' - we will call it '''Nutrient Articles'''. | + | ||Lastly, let's give this '''menu''' a '''title''' - we will call it '''Nutrient Articles'''. |
|- | |- | ||
Line 318: | Line 335: | ||
|- | |- | ||
||06:37 | ||06:37 | ||
− | ||Let’s have a look at | + | ||Let’s have a look at all the changes on the '''Digital India''' web-page. |
|- | |- | ||
||06:41 | ||06:41 | ||
− | ||Let’s refresh the '''webpage''' and click on '''Multiple categories | + | ||Let’s refresh the '''webpage''' and click on '''Multiple categories''' menu item. |
|- | |- | ||
||06:48 | ||06:48 | ||
− | ||Immediately, we see the | + | ||Immediately, we see the sub-menu item '''Nutrient Articles''' displayed below it. Click on it. |
|- | |- | ||
Line 358: | Line 375: | ||
|- | |- | ||
||07:24 | ||07:24 | ||
− | ||Let’s click on the ''' | + | ||Let’s click on the tab '''Page Display'''. |
|- | |- | ||
Line 366: | Line 383: | ||
|- | |- | ||
||07:31 | ||07:31 | ||
− | ||In '''Browser Page Title''' field, type '''Nutrient Category''' | + | ||In '''Browser Page Title''' field, type '''Nutrient Category'''. |
|- | |- | ||
Line 374: | Line 391: | ||
|- | |- | ||
||07:39 | ||07:39 | ||
− | ||Switch to the '''Digital India | + | ||Switch to the '''Digital India''' webpage and '''refresh''' it. |
|- | |- | ||
||07:43 | ||07:43 | ||
− | ||Notice the browser | + | ||Notice the browser title now. |
|- | |- | ||
− | || | + | ||07:46 |
− | || It says '''Nutrient Category.''' | + | ||It says '''Nutrient Category.''' |
|- | |- | ||
Line 434: | Line 451: | ||
|- | |- | ||
||08:41 | ||08:41 | ||
− | ||'''Menus''' are important in '''Joomla''' because | + | ||'''Menus''' are important in '''Joomla''' because content can be displayed only via '''menus''' and every website must have at least one published '''menu'''. |
− | every website must have at least one published '''menu'''. | + | |
|- | |- | ||
Line 463: | Line 479: | ||
|- | |- | ||
|| 09:17 | || 09:17 | ||
− | || Click on the check-box to the left of '''Multiple Categories''' | + | || Click on the check-box to the left of '''Multiple Categories'''. |
|- | |- | ||
Line 495: | Line 511: | ||
|- | |- | ||
||09:56 | ||09:56 | ||
− | ||Switch to the '''Digital India | + | ||Switch to the '''Digital India''' web-page and refresh it. |
|- | |- | ||
||10:00 | ||10:00 | ||
− | ||Note that the error on the '''Homepage''' has now gone. We can see the '''Nutrient Articles''' being displayed. | + | ||Note that the '''error''' on the '''Homepage''' has now gone. We can see the '''Nutrient Articles''' being displayed. |
|- | |- | ||
|| 10:07 | || 10:07 | ||
− | || Let us summarize. In this tutorial, we learnt about: ''Menus''' and their importance in '''Joomla''', '''Menu Manager''' | + | || Let us summarize. In this tutorial, we learnt about: |
+ | '''Menus''' and their importance in '''Joomla''', | ||
+ | '''Menu Manager''' and | ||
+ | how to create '''menu items'''. | ||
|- | |- | ||
||10:18 | ||10:18 | ||
− | ||We also learnt how to: | + | ||We also learnt how to: |
+ | |||
+ | create '''sub-menus''', | ||
+ | |||
+ | change the default '''Homepage''' and | ||
+ | |||
+ | unpublish '''menu items'''. | ||
|- | |- | ||
||10:26 | ||10:26 | ||
− | ||Here are 2 assignments for you: Create a new '''menu item - Category Blogs and Lists''' under the '''Main Menu''' | + | ||Here are 2 assignments for you: |
+ | |||
+ | Create a new '''menu item - Category Blogs and Lists''' under the '''Main Menu'''. | ||
+ | |||
+ | Create 2 '''submenus''' under this '''menu item.''' | ||
|- | |- | ||
|| 10:37 | || 10:37 | ||
− | || Hint is to use the guidelines given in the '''assignment-text''' file provided with this tutorial | + | || Hint is, to use the guidelines given in the '''assignment-text''' file provided with this tutorial. |
|- | |- | ||
|| 10:43 | || 10:43 | ||
− | || Refresh the '''Homepage.''' Click on the newly created '''menu items''' and understand the difference between the 2 menu types. | + | || Refresh the '''Homepage.''' |
+ | |||
+ | Click on the newly created '''menu items''' and understand the difference between the 2 menu types. | ||
|- | |- | ||
||10:51 | ||10:51 | ||
− | ||Delete the menu item '''Nutrient Articles'''. See if you can restore it back. Hint is to use the Search Tools filter. | + | ||Delete the menu item '''Nutrient Articles'''. See if you can restore it back. |
+ | Hint is, to use the '''Search Tools''' filter. | ||
|- | |- | ||
||11:00 | ||11:00 | ||
− | ||The video at the following link | + | ||The video at the following link summarizes the '''Spoken Tutorial '''project. Please download and watch it. |
|- | |- | ||
||11:07 | ||11:07 | ||
− | ||The '''Spoken Tutorial''' Project | + | ||The '''Spoken Tutorial''' Project team conducts workshops and gives certificates on passing online tests. For more details, please write to us. |
|- | |- | ||
||11:17 | ||11:17 | ||
− | ||'''Spoken Tutorial '''Project is funded by '''NMEICT, MHRD, Government of India. | + | ||'''Spoken Tutorial '''Project is funded by '''NMEICT, MHRD''', Government of India. More information on this mission is available at the link shown. |
|- | |- | ||
||11:28 | ||11:28 | ||
− | ||This is Priyanka signing off. Thank you for joining. | + | ||This is Priyanka, signing off. Thank you for joining. |
|- | |- | ||
|} | |} |
Latest revision as of 16:52, 7 August 2018
Time | Narration |
00:01 | Welcome to the Spoken Tutorial on understanding menus in Joomla. |
00:06 | In this tutorial, we will learn about:
Menus and their importance in Joomla, Menu Manager and how to create menu items. |
00:16 | We will also learn how to:
create sub-menus, change the default Homepage and Unpublish menu items. |
00:25 | For this tutorial, we will be using:
Ubuntu Linux OS 14.04, Joomla 3.4.1, Apache, MySQL and PHP obtained through XAMPP 5.5.19. |
00:41 | To follow this tutorial, you should know how to create articles in Joomla. |
00:46 | If not, check the relevant Joomla tutorials on the Spoken Tutorial website. |
00:52 | Let’s go to our Digital India webpage to understand more about menus. |
00:57 | On the right of the Homepage, there is a box which says "Main Menu". |
01:01 | It currently has only one menu, "Home". By default, this is the only menu available in Joomla. |
01:10 | Menus are a way to help us navigate the website. Every menu has a set of menu items. |
01:16 | Here "Home" is a menu item which points to all Featured articles. |
01:22 | This is the reason why any article that is marked as "Featured" appears on our Homepage. |
01:29 | Every menu item defines a URL to a webpage. |
01:33 | A menu item can be set to point to an article, like Vitamin A here. |
01:39 | Or it can be set to list all articles under a category, like Vitamins. |
01:45 | Let’s switch to the Joomla control panel. |
01:49 | Click on Menu Manager in the left menu. |
01:53 | Alternately, you may click on Menus in the menu-bar at the top of the webpage and then on Menu Manager. |
02:01 | By default, we have one menu called Main Menu. |
02:05 | Click on the title Main Menu. |
02:08 | We can see the menu items associated with this menu. |
02:12 | Notice that Menu Manager: Menu Items has a similar layout as Article Manager. |
02:18 | Let’s create a menu item which will point to our article "Benefits of Nutrients". |
02:24 | Click on the New button in the toolbar. |
02:27 | Menu Item Type field decides the type of page to be shown, when we click on that menu item. |
02:33 | There are various options like Single Article, List of articles in a category etc. |
02:40 | Click on Select button, next to the Menu Item Type. |
02:44 | A new window opens. Click on Articles in the new window. |
02:48 | We can see a list of options under Articles. |
02:52 | Click on Single Article. |
02:55 | Depending on the Menu Item Type, some new parameters may be required. |
03:00 | Since we have selected Single Article, a new field Select Article has appeared. |
03:06 | This is a mandatory field. Click on Select button, next to this field. |
03:11 | A new window opens with a complete list of articles. |
03:15 | This window has a Search text box which works on the title of the article. |
03:20 | It also has filters to narrow down the list of articles visible in the window. |
03:25 | Let’s select the article Benefits of Nutrients. |
03:28 | For now, we will keep the default settings in all the other fields in this window. |
03:34 | Right on the top, we have the Menu Title field. This is a mandatory field. |
03:39 | Let us type: Single Article - Nutrients as the title. |
03:44 | Click on Save and Close. |
03:46 | Switch to Digital India web-page and refresh it. |
03:50 | Notice the new menu item link. Click on it. |
03:54 | We can see the article Benefits of Nutrients is displayed here. |
03:58 | Click on Digital India at the top left to go back to the Homepage. |
04:02 | Switch to the Menu Manager webpage. |
04:05 | Let's change the Single Article-Nutrients menu item to List of categories. |
04:11 | So, click on the title Single Article-Nutrients. |
04:16 | Click on the Select, next to Menu Item Type. |
04:19 | In the new pop-up window, click on Articles and then on List All Categories. |
04:25 | We are back to the Menu manager window. |
04:28 | Notice now that a new field appears. It requires us to select the Top Level Category. |
04:34 | This is the category whose subcategories will be listed under this menu item. |
04:39 | By default, it is Root. |
04:41 | We will leave all the other fields as they are. |
04:45 | But we will change the menu title to Multiple Categories. |
04:50 | Click on Save and Close. |
04:52 | Switch to the Digital India web-page and refresh it. |
04:56 | In the Main Menu, click on Multiple Categories. |
05:00 | Notice that two of our categories Nutrients and Food Sources are shown on the top left of the webpage. |
05:08 | The numbers next to the category indicate the number of articles under that category. |
05:14 | Also, notice that the category Uncategorized is not shown here. |
05:18 | That is because it has neither any article nor any subcategory assigned to it. |
05:24 | Click on Nutrients link. |
05:26 | The article Benefits of Nutrients and subcategories Vitamins and Minerals are shown up. |
05:32 | Click on Digital India link at the top left to go back to the Homepage. |
05:37 | A menu item can have sub-menus, similar to how a category can have sub-categories. |
05:43 | Switch to the Menu Manager webpage. |
05:46 | Let's create a submenu under Multiple Categories. |
05:50 | On the Menu Items page, click on New button. |
05:54 | Click the Select button next to Menu Item Type and then on Articles. |
05:59 | Select Category List. |
06:03 | This will display a list of articles in a category. |
06:06 | A new field Choose a Category appears. |
06:10 | By default, the selected category is Uncategorised. |
06:14 | Let's select Nutrients in the drop-down list. |
06:18 | On the right, there is a field to select the parent item. Click on it. Then select the option Multiple Categories. |
06:27 | Lastly, let's give this menu a title - we will call it Nutrient Articles. |
06:33 | Click on Save button. |
06:37 | Let’s have a look at all the changes on the Digital India web-page. |
06:41 | Let’s refresh the webpage and click on Multiple categories menu item. |
06:48 | Immediately, we see the sub-menu item Nutrient Articles displayed below it. Click on it. |
06:56 | This page lists all the articles under this category in a tabular format. |
07:01 | The sub-categories-Vitamins and Minerals are listed separately. |
07:06 | Now, let’s have a look at the title that is displayed for this web-page. |
07:11 | It says Nutrient Articles, as you can see here. |
07:15 | How can we change this title to a different one? |
07:18 | We can do this through the Menu settings. |
07:21 | Switch to the Menu Manager webpage. |
07:24 | Let’s click on the tab Page Display. |
07:27 | Note that here all the page settings are optional. |
07:31 | In Browser Page Title field, type Nutrient Category. |
07:36 | Then click on Save and Close button. |
07:39 | Switch to the Digital India webpage and refresh it. |
07:43 | Notice the browser title now. |
07:46 | It says Nutrient Category. |
07:49 | Click on the Digital India link to go back to the Homepage. |
07:53 | Let us switch back to the Menu Manager. |
07:56 | Notice the Home button in the top toolbar. |
07:59 | This makes the page associated with the selected menu as the website Homepage. |
08:04 | By default, the menu item Home is set as the default Homepage. |
08:10 | We can verify this by hovering the cursor on the Home column button. |
08:15 | The tool tip says “Default”. |
08:18 | Let's make the Nutrient Articles submenu as the default Homepage. |
08:23 | Click on the check-box to the left of the title and click on Home button in the toolbar. |
08:29 | Notice that the yellow star now appears next to this submenu. |
08:33 | Switch to the Digital India webpage and refresh it. |
08:37 | Notice that the Homepage has changed. |
08:41 | Menus are important in Joomla because content can be displayed only via menus and every website must have at least one published menu. |
08:51 | Switch to Menu Manager webpage. |
08:54 | Select the check-box to the left of Nutrient Articles submenu. |
08:58 | Click on the Unpublish button on the top toolbar. |
09:02 | The system shows an error Can't unpublish default home. |
09:07 | This means that the menu associated with the Homepage cannot be unpublished. |
09:13 | However, we can unpublish the parent menu. |
09:17 | Click on the check-box to the left of Multiple Categories. |
09:21 | Click on Unpublish button in the toolbar. |
09:25 | Unpublishing a menu also un-publishes all its submenus. |
09:30 | Let's go to the Digital India webpage and check what we have done. Refresh the Homepage. |
09:35 | Notice that the Homepage now shows an error The requested page cannot be found. |
09:42 | This is because the default Home menu - Nutrient Articles also got unpublished. |
09:48 | Let's go back to the Menu Manager. |
09:51 | Publish the Multiple Categories by clicking on the Status icon. |
09:56 | Switch to the Digital India web-page and refresh it. |
10:00 | Note that the error on the Homepage has now gone. We can see the Nutrient Articles being displayed. |
10:07 | Let us summarize. In this tutorial, we learnt about:
Menus and their importance in Joomla, Menu Manager and how to create menu items. |
10:18 | We also learnt how to:
create sub-menus, change the default Homepage and unpublish menu items. |
10:26 | Here are 2 assignments for you:
Create a new menu item - Category Blogs and Lists under the Main Menu. Create 2 submenus under this menu item. |
10:37 | Hint is, to use the guidelines given in the assignment-text file provided with this tutorial. |
10:43 | Refresh the Homepage.
Click on the newly created menu items and understand the difference between the 2 menu types. |
10:51 | Delete the menu item Nutrient Articles. See if you can restore it back.
Hint is, to use the Search Tools filter. |
11:00 | The video at the following link summarizes the Spoken Tutorial project. Please download and watch it. |
11:07 | The Spoken Tutorial Project team conducts workshops and gives certificates on passing online tests. For more details, please write to us. |
11:17 | Spoken Tutorial Project is funded by NMEICT, MHRD, Government of India. More information on this mission is available at the link shown. |
11:28 | This is Priyanka, signing off. Thank you for joining. |