Drupal 7 Panelizer module - Daily Dose of Drupal episode 160

hello everyone and welcome to another daily dose of Drupal I am Shane Thomas and today we are on episode number 160 we're going to be going over the panelizer module today and this is a module that I have just recently started to play around with and it's very powerful and it allows you to do a lot of cool things so we're going to go over that and how you can use it to panelize your drupal websites as always I'm Shane Thomas you can follow me on Twitter on SM Thomas 3 also make sure to head over code karate comm sign up for the newsletter or look at the five secrets to becoming a drupal seven ninja a book let's go ahead and look at the panelizer module and see what I can do it's very in some ways it's overlapping on what the panels module allows you to do out of the box however it does allow you to do a lot of other very cool and more advanced things on top of what you what you get with the traditional panels module so a few things you need to know you need a new version of panels or you need C tools and page manager included with C tools enabled and when you're installing there's a few things you need to be wary of so as you can see I have we have our dev site here I already have the panelizer module installed just check that box but you'll also need to make sure you have panels installed and the page manager module that comes with C tools installed and you want to make sure you come into structure pages and ensure that node view is enabled so if it's not you'll need to make sure you enable it so it shows up in black instead of gray here and then you should be all set and ready to start using the panelizer module so you can get to the panelizer configuration page of course from the modules page if you want just by clicking here or you can go to configuration content authoring panelizer so once we're in the administration page for panelizer you can see there's a few different options for you to look through here it's all broken up by different entity types so you have taxonomy node user I believe you can use this with pretty much any type of entity so we're going to go ahead and look at node just to keep it simple and we're going to go ahead and panelize the article content type so by default I think when you panelize it originally it so nothing else is checked so you go ahead and then save that after you panelize it now you can see there's a link here to start doing some configuration so if you click that it allows you to specify what type of content you want allowed inside your your panelizer so when when you are actually trying to configure how a specific node looks in this case we're going to configure how an article looks so the actual view or excuse me the actual node view of the article you can specify what should be allowed and I'll go ahead and we'll skip this for now and we'll come back to it because it'll make a little more sense once you see everything in action so we're going to select full page override because we want to be able to override the entire page and we are going to go ahead and check both these and I'll explain what they do this provide default panel this essentially allows you to do the same thing as just creating a specific node view template using the page manager you can typically come in here you could add a new variant for your article content type and you could design out that page if you're familiar with panels you'll know how that works panelizer allows you to do something very similar in that when you click provide default panel it allows you to then configure how the article is supposed to look so what we'll actually just take a look at that so you can see that it's very similar to what panels allows you to do out-of-the-box now you can see if I click settings this looks pretty similar to what you've seen with panels before you can specify a CSS class and ID add some CSS code right there if you want even disable blocks and regions it allows context just like panels so you can add different relationships or link different entity types or content types you can specify the layout we're going to go ahead and use a two column layout and we'll let that convert over to the two column layout and then when you get to content it's just like you've seen with panels before you can move the image round to the right side for instance you can see we have the body tags and links as well so now if we save that and we go to one of the article the actual article content types you'll see that we have the image on the right and the body and the links and tags on the left and that applied to all of our articles so you can see that's very similar to what you've done with panels before if you've looked at my other panels videos or if you've just been using panels for a while so nothing too revolutionary yet however there's even more that you can do this is where it gets really really powerful so the next thing we can do is we can say we want to allow the panel choice so we're going to save that and now we can click this list link and you can see there's the default one and this default one is the one we just configured so if we come in here and we go to content you'll see that the images on the right side like we moved it previously but we can go ahead and add our own so let's say we wanted to add a version where the image is on the left side so I'm going to go ahead and type in left-side image and now I have the default where the image is on the right side we also have the left side image so if I want to go ahead and specify the layout we'll go ahead and use a two-column layout again click Save and we will keep the image on the left but move everything else on the right so now that we have that we can go ahead and close out you notice if we come in here the image is still on the right if we click Edit there is an option down here for panelizer you can then specify that you want to use the left side image and then you'll see the image moves to the left however if we go to one of our other articles the image can still be on the right so what this allows you to do is it really allows you to define different layouts for your content authors of your sites so if you have someone who's building out a bunch of the articles on your site and you want to give them a couple different options to choose from you can allow you can easily set these up and in the panelizer module and then when they're building their content out they can select how they want their content to display and everything will just happen magically for them let's also say so as you can see we have test article two where the images on the right and we have test article one with the images on the right let's say for some reason you wanted to just change this specific one if you click on panel panelizer you can come into here and you'll see it's using test article 1 and it's using the view mode status is at default if you go ahead and click content let's say we want to add in something else so we want to add in new custom content we'll just say let's say this should now be overridden just so you can see and we'll add it in right above the image now if we close out of here notice in the breadcrumb it's home test article one panelizer full-page overriding we're only doing this for test article one so once we close out of here you'll see I got this text here that I just added in it's only on test article one because if I come back to test article two that is not showing up I click and panelizer you'll see that it's this still shows as default on test article two and any other article on the site because I didn't actually change it for any article but test article one so if I come back into panelizer you'll see now it says the status is custom I can of course reset this and it will go back to the default or this is you can see through the gray here this should now be overwritten is going to go away now it's back to default if I close out of this you'll see it's now gone away and we have just our basic article with the image on the right side so all in all that's very powerful on its own and there's even more you can do so if we go back into the configuration for panelizer you can even specify what allowed content should be allowed when you are adding your different panes inside your panel so what these things here allow you to do is it allows you to set what should be allowed when you're creating or adding things to your different panelized panels i guess you can say so for instance the allowed custom content if you uncheck that so you can see it should be unchecked right there now if we come in here there's no way to add custom content down here there's normally a link if we want to get that back we can come back into our panelizer and we want to really that now if we come back in here to add I can see new custom content is now available and this allows you to provide a slimmed-down interface if you have certain individuals on your site that you want to be able to configure these different panels without giving them all of the options as you can see when you come in here there's a lot of options to choose from using all those checkboxes you can hide a lot of the options so the user only sees what you want them to see so this allows you a really flexible way to build out different interfaces in different pages on your site and provide a lot of flexibility for someone who might be doing the content authoring or the content creation on your site this is only a little bit of what the panelizer module can do I could spend probably an hour or two talking about all the different features you can air out how you can use it in how all the flexible things you can do with this module so go ahead and check it out this should give you the basic overview of what you can do with it make sure to follow me on twitter at sm thomas 3 and check out my new e-book thanks for watching we'll see you next time

Channel: Code Karate

Views: 13,983

Rating: 4.9365077 out of 5

Keywords: Daily Dose of Drupal, DDoD, Drupal (Software), Panels, Website Development

Id: 0l9QsmbPtrw

Length: 12min 51sec (771 seconds)

Published: Wed Jul 30 2014