Custom Post Types and Theme Builders – Part Six Brizy Pro

hi this is David McCann for web TNG in this video I want to look at Brizzy Pro and using Brizzy Pro to create theme templates for custom post types this video is part 6 of a series looking at custom post types and the theme building functionality of page builders premium page builders now have the ability to create theme templates but the process difficulty and limitations are different for each page builder this series provides a walkthrough of options so you can see what's involved the strengths and weaknesses of each one so that you can choose and get a running start with the page builder of your choice in part 1 I create a custom post type using CPT UI and advanced custom fields if you're unfamiliar with custom post types and how to create them and want to follow along then take a look at that video first part 2 look at how to create the single template and archive template for the custom post type using the new Divi for theme builder part 3 showed the process using beaver builder and beaver theme er how to create theme templates using Elementor Pro was covered in part 4 and toolset now has the ability to create single and archived templates in the guttenberg block editor and that's covered in part 5 now in the sixth part of the series we're looking at the same process but this time using Brizzy pro the Brizzy page builder is relatively new while the ability to work with dynamic content was released in the fall of 2018 for the pro version the process was a bit buggy and uneven now however Brizzy has matured to the point where it's possible to create theme templates and that is the focus of this installment in the series Brizzy has a free version which is available in the wordpress plug-in directory and it is very full-featured they also have a pro version which you can buy from their web site when you compare the features of the free and version we go down here to dynamic data and you see that to have advanced custom fields integration toolset integration pods meta box basically to create the theme templates for custom post types we're gonna need the pro version Brizzy also has a cloud version but that doesn't allow you to work with dynamic data I have here a test website where I have the free version of Brizzy and the pro version of Brizzy installed Brizzy pro is actually an add-on to the free version so you'll need both installed I also have custom post types UI and advanced custom fields installed and I use those for creating our custom post type and I have the free version of the Astra theme I created a custom post type called ebooks and you can see I've entered a few book records if we will look at one in the Gutenberg editor we see we have our title our content and we have our featured image we also have a custom taxonomy associated with books called genres and we have a taxonomy term assigned and there are two custom fields a link to the author's website and the authors photo if we look at a book record from the front-end we see the featured image the title and the content but none of the custom fields or the custom taxonomy show so we need to theme the single template when we look at the default archive we can see that we need to theme that also the featured image the book covers are all different sizes and they're not laid out well so this also will require theming fortunately Brizzy Pro has is covered with Brizzy installed you get a new admin menu here we have settings templates pop-ups integrations lead we have integration with short pixel help and license to create the templates you click on the templates menu item add new and we'll start with a single template and call this book single we pick the post type we want to create the template for in this case it's going to be for book pages and then you have to remember to click the Add button I'm going to save that and then we'll edit it with Brizzy the Brizzy builder is designed to help you focus on creating your content so a lot of the features are tucked out of the way in the center here you have place where you can add blocks or templates we've click here to add an empty block and these are pre-designed blocks that come with Brizzy there are full page layouts you can save blocks and you can also save global blocks to use in other pages you see the pre-designed templates are broken down into categories and you see the number of items in each category we just want to have a blank block in the editor here you can see the spacing it tells you how many pixels it is and you can adjust it just by holding your mouse button down and dragging if we click on the blue plus sign it opens the elements box we can also open that by clicking on the plus sign here and here you see there are a lot of options of builder elements you can add text button icon embeds forms progress bars carousels rating and so on here are row and columns Facebook and Twitter and here are some WordPress options that we'll use in creating our templates for example for a sidebar for shortcode for a list of posts breadcrumbs the post title excerpt the content the post info or post meta and archives this button here allows you to reorder blocks we don't see anything here yet but we'd see a list of blocks that we had and we could drag and drop them this is for your color and font choices here you can preview on desktop tablet or mobile this is where you can set the type of template Brizzy template or default template so I'll go ahead and choose that now the page reloads so it can bring that in and then here your options you can get a quick link to submit an issue learn about Brizzy some shortcuts plug-in settings or go back to the admin dashboard so let's start we'll add an empty block I want to have three columns so I'm going to drag in the columns element you'll notice when you hover over them you get some context menus here you can resize the columns by grabbing this little pill button and resizing them down and this is a Settings button for your row you can save it and make it global you can make it a slider you're gonna have a background image you can set a color you can save it and you have some options whether it's boxed or full width and the height and then more settings brings out padding and margin corner and divider options as well as some options for adding a CSS class and custom attributes etc there's an option here to duplicate or to delete it since I want to have three columns I'm going to click on here for the column and I'm going to click the duplicate button and now I have three columns I'm gonna make this one about 25% and I think this one is about 25% also would be good and then this side I'm going to add the sidebar so I go down find the sidebar element and drag it in and there we have the sidebar now in this slide I want to have the featured image so I'll drag the nimman over here and you can see it gives us a placeholder I'll click on the image icon and I want this to be set for the featured image so you click this little database icon for the dynamic data and I want it to be featured image but you notice it also shows the other custom fields that we have defined for images like the author's photo the site logo or even the post authors profile photo here we can set some colors we can have link options we have allied options by default it's entered which works for me here and if we go into settings then we have some size options now I know book covers are usually twice as tall as they are wide so I'm going to start with 200% here for the height and you can imagine that one of the problems of having placeholders instead of the real images here is that makes it a little harder to size this because we can't see an image here as we're working but here's the featured image now below that I'd like to have an image with the author's photo so I'm going to drag another image element again again I'm going to do the same thing but this time I want the author's photo and let's see what it says for the size that looks okay and now I want to have a button to go to the author's website to use that other custom field so I'll drag a button in will have that centered here we have our button options are options on styling and the types of corner and and border if we want an icon in the button this gives us our typography options our color options our link options so we do want this to go the author's website so I'm going to click the dynamic icon and here it shows us different URLs we can choose from so I like this that it's intelligently giving us the options to choose from so that makes it easier than going through a big list or drilling down we'll have it open in a new tab and then to change the text we'll just click on it and add the text and that part is done now let's add the title so we'll go down to these dynamic elements here's the post title and again if you click on it you get a context menu you can change the typography a link the alignment and here you can change the padding and margin next I'll add the post meta which they call post info and if you click on that we all align it left aligned and this is a toggle that goes through Center right left so we don't want it right we want it left aligned you can change the color we can change the typography and if we click on here we can choose the meta options we want to show so we don't really need the time on there so I'll take that off and now I'll add in the content go down choose post content add that in let's just check outs left align so that's good so it's possible that we're done here let's click update and we'll go take a look here is the single by default that shows and I'm going to refresh and here's our single book template that we created with Brizzy and it looks great if we click here we go the authors website so everything's working wonderfully let's create the book archive we'll go back to the dashboard and we'll add a new template we'll give it the name book archive and this time we'll choose archive books and click Add and then we'll publish that and edit with Rizzi again we don't have the header or footer so we'll start we'll go instead of the Brizzy template we use the default WordPress template so that we get the header and footer in and this time we'll have a blank block and we will choose the archive element so we drag that in and let's just check here we have the featured image so that's good oh yeah we need we need to change the height here to 200 we have the placeholder for the post title for the post excerpt and for the read more button and then we have the pagination so we could change the styling here but it looks good Oh for post excerpt let's not have it centered that might look a little funny we'll make that left aligned and you notice that when I change it here it changes it for all of the cells in the grid so that's that's nice that's a nice convenient thing you don't have to go into each one to make the change and I think that's it that's very fast and easy let's see how that looks I'm going to update here was the default template if you remember before we made one with Brizzy so now let's refresh this and see what it looks like and here's the archived template for books that we just made we can page through to see different ones and if we go to the read more button we go to the single template so that was easy to do very quick and easy now you notice again we just have the placeholder so it's a little bit hard to adjust things you'd have to kind of do a little trial and error and also we can change the styling in the archive but there's not really a lot of option to change the archive itself here's the control for the archive element you can see we can adjust the number of columns and the number of rows and spacing but that's pretty much it this just goes to the margin and padding so there's no option here to add for instance custom fields or I like to have a listing where you have one record per row and you'd have the image off to the left there's no option for the image placement it's always above so it's quick and easy but it doesn't have a lot of extra flexibility in conclusion creating the single and archived templates for the custom post type was very fast and easy the results looked clean and sharp I was easily able to add the custom fields to the single book template I found that the archive element works well but it doesn't really have many options I didn't see any way for instance to include a custom field in the archive also it would be easier to work with the settings if there was a preview of the con instead of just placeholders working with a placeholder made getting the image size a bit of trial and error for me when I was testing this out before making the video as I mentioned I usually create a list type of archive with a single record per row in the image to the left and there wasn't that flexibility Brizzy is a relatively new page builder that I've been keeping an eye on aside from the archive element limitations I was pleased to see that the Brizzy template options now work well for custom post types it was nice that the custom field showed automatically when you clicked in to set the dynamic content with other page builders you need to drill down several layers the Brizzy team is continually adding new features the builder has lots of nice styling options and intuitive shortcuts for example when you change one setting on an archive element the others change also Brizzy Pro is technically still in beta but the Builder is maturing and the feature set is pretty extensive I expect to see Brizzy Pro emerge from being a beta to a real version one later on this year so that's my walkthrough and review Brizzy pro for creating theme templates the text version of this video is available on the web TNG dot-com website where there are other resources walkthroughs and reviews available I hope you found this video helpful thank you for watching

Channel: David McCan

Views: 952

Keywords: brizy page builder tutorial, brizy pro tutorial, custom post types and advanced custom fields, brizy pro templates, webtng, wordpress tutorial, custom post types, best wordpress page builder, best wordpress page builder 2020

Id: -0OyTDs5B0Y

Length: 17min 5sec (1025 seconds)

Published: Fri Apr 03 2020