Drupal 8 Basics #12 - Understanding Menus

hey what's up this is Scott with level up tutorials and in this video we're gonna be talking all about menus I'm gonna show you how you can manage your menus what they are where they are and how you can get to them to easily change or modify them so we've talked about menus a little bit but in this video we can go a bit more in depth about what we're actually looking at when we're looking at a menu so as you can see we have a menu already we have this home and about us you can see here that when we hover over this we do get this pencil that gives us the option to not only configure the block but also edit the menu we also see the same sort of thing at this top navigation here you'll see the same sort of thing in this bottom footer navigation here edit menu so as you can see menus exist all over the site and if we come into structure in our sidebar we can get to all of our menu simply by just clicking menus here now from here you can see that we can add new menus we can look at the current ones notice how we have the administrative menu the footer menu the main navigation menu the Tools menu and the user accounts menu now let's look at the main navigation we can get there by coming to this edit menu you'll notice we also have an add link here so we can add a link directly to this menu without having to go and edit if you wanted to go ahead and add another link let's go ahead and click Edit menu now from here you'll see both of our two links we have home and about us if you remember who you'll see in the footer we also have contact which is a page that exists already for us including a feedback form now let's say we wanted to add a contact to the menu here you'll notice that the path URL is just slash contact I'm gonna copy this just the forward slash nod and from here I'm going to click add link now the link title can be anything you want it can be contact us if you'd like and you'll notice it's asking us to enter the path such as node slash add or external you also see this little circle right here in the far right when you select this what this means is that when we hit forward slash and you'll see after putting in contact this link is going to go to the contact page now what's interesting here is we can have items in the menu that maybe we don't want in the menu right now let's say we want to build this out and have contact in the menu but just not quite yet you can uncheck the enable box and it'll keep the item in the menu for you but the users won't see it now the description is something that it shows when you hover over the menu link we can just say contact us now this isn't really something that's super important and we also have show as expanded and that's if there is children of this particular menu item in the next video when we create our own menu create a new menu just for the fun of it we're going to be diving into children and things like that now you'll notice that the parent link is the main navigation so it's not going to be a child of anything it's going to just be in the main navigation and the weight is the position that's going to have in the menu now you can think of weight like we described before as and the larger the number something is the heavier it is the heavier it is the more it sinks so if you have a zero it's going to be light obviously a negative number would be lighter I typically like to keep everything at zero and use zero as the highest that way it doesn't get confusing and then one would be obviously heavier too heavy or three heavier and for heavier than that since I almost always want contact to be at the end of the menu I can assign this a weight of ten and I can be assured essentially that if I create any new items into this menu contact us we'll always be at the bottom now simply by adding that our menu has been saved you'll notice we can also drag around these to change the weight if you'd like and after you do so you'd want to click Save let's head back to the front of our site and click on level up you'll now see we have home about us and now contact us we can click contact us and you can see it correctly takes us to the right page so we've now modified this menu by adding a new item to the menu so you should now be able to come in and my by any of the menus that are in the site in the next video we're going to create a menu from scratch and then the video after that we're gonna show you how you can place it anywhere on your site using a menu block so as always this is Scott what level of tutorials if you have any questions or comments to become in the video write me up at Twitter or Facebook a level up tutorials if you wanna get the rest of these videos before they are available head over to store that level up tutorials dot-com and either purchase a level up Pro subscription or you can purchase this entire series to download if you want more advanced Drupal content there's going to be an advanced views a series on the way to the level up store exclusively so keep your eyes open to the level up store check back subscribe to the newsletter and be aware of new products coming out as always thanks for watching and I'll see in the next one but

Channel: LevelUpTuts

Views: 14,193

Rating: 5 out of 5

Keywords: drupal, html, web developer, tutorial, css, javascript (programming language), drupal7, development, how to, drupal (software), series, drupal 8, modules, drupal8, composer, develop, developer, theming, tutorials, drupal video, drupal tutorial, web, web development (interest), website, web development, tuts, drupal theming, web application (industry), web application development (industry), web development (project), web developer (job title)

Id: OLys4iYgl28

Length: 5min 11sec (311 seconds)

Published: Mon Apr 18 2016