BodyCommerce 101 - Divi Engine Webinar

hey my name's Peter welcome to the live stream of body Commerce 101 this is a excuse me this is a new thing for me I've never done a live stream before so yeah it's gonna be interesting to see what happens I hope my audio is okay I hope I hope you can hear me good just let me know in the chat it'll be good to know we have some people join in thanks guys we just so you know we're have a few moderators on board we've got we've got Jackson we've got Chris whoo yeah Colin Chris helped me out with supported marketing and then we have Jim a good friend of mine from France who has volunteered to help with any French comments because we have a lot of French customers so yeah so just just if people can just let me know in the chat if you can hear me correctly as it's my first time audio is fine great mystery island music nice name so I think I'm just going to wait give it like a couple minutes just for people to join I just I just want to kind of start too early and and miss out so if you have any questions now not regarding body commerce maybe something else please fire right away and I'd be happy to is kind of to answer some stuff is YouTube is saying to me that my audio resolution is not too good so again the sound is a good oh cool so Joe Joe a mass the end great to start first yo-yo your first sight with body comment so this video will be very helpful I've been wanting to do this live stream for a long time [Music] but it's yeah it's been something that just got so much on you know doing everything with the V engine there's just been hard to tackle everything but at the moment we bring in more guys on board to help out with with the workload and hopefully we can do more things like this for the plugins to to really help you along the way this yeah I kind of hope that this video will be you know the starting point and kind of teach you a bit more about the setup and how things going New York now as I look a smaller world Switzerland that's amazing quite got some Holland we got from bronze we have a lot of French customers actually and it's funny because I get I get emails in four in French and then our reply English in an aeroplane French say it's bizarre but it works another one from the yes Cathy Ashe Paul knows Eric asked to see you Eddie great to see em James thanks guys for jumping on board so I mean I'm just just went away to nothing I'm gonna wait just a couple more minutes well just to tell you like my name is Peter I'm from if you don't know I'm originally from South Africa I grew up in South Africa it's born there when I was 17 I moved over to the UK and Tiago from Ecuador nos I hope I'm say your name right but my check on Poland cashed I thought turned about pronounce the rods but mystery Islands is from Finland sweet that's really cool yeah we have a lot of customers from all over the whole world I love it I love I love that I get to speak to people from all over the whole world yes I'm from South Africa moved over to the UK and are 17 and I've been living here I met my wife over here I have three kids currently is four three and ten months so it's really interesting three boys it's good fun should I say real good fun yes a lot like a lot happens in my day with work and with the three boys Croatia nos I've heard Croatia is so stunning or my sister's been to Croatia and the country they are stunning I've always always liked the football kits the the checkered the checkered top yeah so I'd a little bit more longer I think I think I started at five past I don't know if this is I don't know how long to wait usually because I've never done done this dream as I say but yeah I think I think that'll be good timings and so just to kind of I might just start now I guess people can jump in and people can watch the video back this it'll be on YouTube so what's going to happen is it's going to be a live stream and it's gonna basically I'm just going to go through run through some of the key points of what you come as so so I've got two monitors ova1 and one it's a V I'm just controlling a few things so sorry about that okay so I'm going to jump straight in okay so I'm just going to share my screen this is a fresh install of Divi WooCommerce and body commerce so the first thing I like to do when I set up a new site with body commerce is I go into the Divi theme options and this is a bit of preference but also a hope in the long run the first thing I like to do is in in the Builder advanced I like to enable the classic book editor this way I can if for me I just prefer to build everything on the back end but I can still enable the visual editor when using the Divi builder so you'll see that in a minute this is this is my preference I'm just going to do it the second thing I would suggest is to disable the static CSS file generation a lot of the times the Divi builder well the Divi pod of caches the the settings the CSS that you use and a lot of times they can it can cause like conflict or it might might refresh so a lot of it a lot of the issues we get from customers all that like maybe the style is not showing correctly on the on the website and this is because of the static CSS file generation if you're using a plug-in like WP Foster's cache or something like that that will do the cache in for you so in my view I don't really see a big issue with it disabling it that's the first thing I like to do is set up that now the second thing to point out which is very important with with body commerce and WooCommerce is the setup of your of your store now you'll run through the install with WooCommerce I'm not going to go to that now but the setup you'll usually run it up and what that does is that that creates pages okay and the pages are the shop that accounts what else is there so the checkouts in the cart so we have baskets checkout accounts and shop okay so I've made the front page my shop page and this is how it looks like by default now one thing to mention this is very important to not build on these pages do not use the Divi builder on pages over here you should only have it as it is before the shop page it'll just be blank with the default editor and for the basket checkout and my accounts they will be the shortcode oh sorry just to just to mention if you have any questions please please put them in the chat we have some moderators who are one of the gals wall will pick up the questions you have and at the end I'll have a Q&A session so please any questions you have put it in there and I'd love to answer those questions later okay so yes as you can see on the checkout page we literally just have the short code which is what you want you don't want to be using the Divi builder so leave it there so that's the first thing they set up with the pages now now how do we go about you know creating this this funky shot page how do you make it better well you do this ordinate in the dippy library so either you can use the theme builder if you want but I'm just going to use the Divi library and body combo settings the theme builder and you can either create the layout and the theme builder or in all settings so I'm going to add a new layout so I'm just gonna call this shop page and this is going to be our layouts for everything you want to do is layout or if you're using a loop out which I'll show you later is going to be a section so record layouts you can add a category if you want but I'm not gonna do that now just to not confuse people so I'm creating the layouts and the smooth I want my shop louse on here I'm going to be adding some modules now what modules do you ask what modules can you use well this is where I help the engine calm so on our documentation website B we we tell you about this so I'm just going to show you I'm the body commerce modules on the body commerce modules the way we've done the modules is we have color-coded them and we've added some acronyms on the beginning and at the end actually to tell you where you can use these modules so you can see the lime-green as that account pages so any of those modules with lamb green you can use on the current pages the same with the archive same with the checkout and conte and over here you can see a list of all of them with the acronyms so you can see if it is G that means global Global CP means Cod page is the reason why I've done CP and then the name is because we want it we want to cluster them together and divvy kind of alphabetically orders everything so I want all the count pages together that's why I've done are PAP which is account page downloads account pages they're kind of yeah and there you have the Archon which gives you the inclination on here you can see what they all do and even you can even filter and here you can see here's all the product page modules you can use additional information attributes Pro before and so on so that's just to help you a little bit so going back to our layouts we want to we want to create a shop layout so the first thing I'm going to do is I'm going to add a product loop module and what this does will this will loop through the products and display them let's say start building make it just make it very simple for now and even in this search is great so you can go products and you can pull in a product loop and you see it is our car pages so this means it can we use on our car page that's brilliant there's actually something else we've recently introduced in a new update which before people are getting issues some issues with the custom layouts but I won't show you but before this causing endless loop we've made we've added a little bit of a mod so it won't get it endlessly I'm just going to use this default style for now so what this does this will put in the default style or for the product so if you ever run into any issues of it not showing on the on the shop page or the category page first thing to do or pull the shop page is to check your don't have the Divi Builder on the page the second thing to do is to go on the product loop and just change it to defaults just so you don't have any any other issues come into play okay so I've created that the shop page is still the same as it is because I have been six I haven't told the website and this is the layout that I want to specify for the shop page so this is we're going to do the engine body commerce I'm going to open that in a new tab sorry out sometimes I talk really quick so I hope I'm not up here to cook full for you but I you know I can always you know clarify some things at the top so in Divi engine body Commerce we have all the main kind of settings so these are all the different pages these are some of the main kind of features you want to use so the first tab is a product page so you can create a product page template and then assign it here but we'll get to that next oh he had a shop category pages this is where we want to go because we want to spit we want to create a shop page so I've created a layout I've added the product loop module I've changed it to default for now and now I'm going to select this as the shop template now when you save that or ecommerce will take over and tell WooCommerce what templates to use to show your products on the shop page it does and here we go there's the default style you see that sidebars going away because there's one product looks good right so far those good but I want to kind of one thing I want to show you was there the custom loop allows what that isn't how did it how to do it a custom loop layout is so this is the default kind of look now what if you want to have a thumbnail maybe an attribute maybe move the price below the button maybe have another button say or maybe even you want to add a box shadow borders you want to customize it how do you do that what we've added a way for you to easily customize that so the first thing you want to do is you want to create a layout that that you will tell a body commerce for each product show you this layout these are the modules I want this is the styling that I want and for each product will show that okay it's called a custom loop layouts okay so here we go so I want to go to the Divi Divi library so it'll make hope you'll make sense in a bit I'm gonna have lots of kind of tabs open so hopefully hopefully it'll be okay I don't know if you like me but by the end of the day I have like so many tabs open it gets a bit crazy so at a new layout I'm going to call this the loop layout just for myself I want to make this a section make sure to set your not alright because in a section you can add multiple stuff you can maybe even do a two column three column you could you know you could even add I don't know a little low buttons or something it's up to you done that because you can do whatever you want with the Builder this is where it gets really interesting and what you can create so I've does loop layout and in here what modules can I use walk over to the whole page in this the songs you go shop category pages [Music] oh yeah product loop layout modules and yeah it gives you all the motors you can use and a lot of them start with LL so loop layouts or PL product page and loop now this is when they can use them on the product page and on the left and on the loop downs the sounds of it it can get a bit confusing of the terminologies okay here we go we're on our loop allowance what do I want well what I want is I want a thumbnail I want to show a thumbnail of the product another thumbnail I see some questions firing in so just carry on asking the questions at the end I'll do a Q&A you can do a couple of things you can link the image to the product page you can I'm just going to I'm just going to say no for now and on it well actually I'll say yes and I'll show you why and the style I want to make the phone make it a flip image this this way when you hover over the image it flips over to the second image in the gallery that's quite a neat little feature that we add and in each of the modules we have all these kind of interesting little features we add so I want to have a title you can see our title just also for any any our plugin is translated into into french for some customers just because we have a lot of french customers and in body combo settings you can actually disable the french translation if you want to see if you want to see the english and follow along okay so I've added the thumbnail I've added a title and I've added a price I don't want to add adds a cart as well so this is a very basic very basic you know Lupul outs you can use the builder to change the sizing and I'm not going to do that because I don't waste your time with you know styling too much but what I'm going to do is I'm just gonna go into here and make my border my border radius of five pixels I think it's a large stream my computer's Karina bit slower boots and when I had a box shadow okay so now I've created this loop layout and for each product I want to show you the thumbnail the title the price and Add to Cart in that order any design settings you're doing the Divi Builder will be shown as well example the section I've added a border radius and I've done shadow so let's go back then connection lost like my I guess this is with the large stream when you can't uh unpause the video can you then and then cut it out for let's just and while that's trying to load you yes I think it's working at celfon okay it's done okay so sorry about that I think I don't know I think my computer was just basically this actually last week my my main pc broke it was pretty crazy it broke and it's luckiest under warranty I sent it off but it's going to take two weeks to get back so I'm using my laptop yeah so I apologize for any any no for these kind of things that the laptop seems to be struggling a bit thank you a we'll get through it huh like any good web designer when issues arise we just take it in our tune and just carry on the way guys are and that's how we all I saw your loans so I don't why this is floating so much Exodus live doubters okay so again I use the I use the back in Builder just to put that I prefer it you can use a visual build as well some of our modules are just kind of representation so our modules work 100% of our modules actually so like this custom blue blouse so for example if I click on here I can see the visual side of things of the products so it'll load in a minute also our degree like use divisible as it takes longer to load everything so now I'm waiting for this to light for example um I'm not gonna waste it you want opinion anymore your tongue they'll work so in here what I'm gonna do is I'm actually gonna choose a custom layout or the loop style okay now I'm gonna specify that custom loop allowance so go to custom layout options actually so I'll move the option sorry in the beginning I've just moved the ricci on the on most recent updates so I want to choose custom layout and then underneath you specify the loop house currently it's a no layout because you haven't you haven't specified one yeah on a space of fathers Lupul out that I created so what do you what do you tighten body commerce is for each product in the loop display that custom layout that's making sense is ready annoying how slow this is all taken sorry is if it carries on like this I will just crack on with other other bits that I think might not take as much sorry I think I just brought the table there no audio probably got messed up range because the really well in the beginning and then ants kind of okay so what I've done is I've enabled a custom loop layout and here you can see it's got that border that box shadow but everything is all together it doesn't look that great does it looks pretty not that good so in our settings you can specify if you want to show it as a list or if you want to show it as a grid so what I've done is I just specified it is a list so I need to just modify the settings a bit chose a grid and I could yeah I'll show you a few things in here in the custom layout style here you can even choose a no results layout so when there's no results for the products you can actually create a custom one there so what you do it in the developer you create a layout whatever you want to do have maybe have an image may be saying no products found with maybe a search module or something like that and then you specified in there over here the layouts I wanted to be grid and I maybe wanted to have four I'm tablet - and on mobile one this is update that yes so this is one of the main things that people always asking or what the confused about is the custom live layout I kind of hope maybe this is kind of answers a few things so there we go so now we have it in a grid of grid layouts all in a row with the shadow and the border as we did in the loop left we have the thumbnail module we have the title module the price and Add to Cart now it obviously doesn't look that great in terms of the spacing below the width is also not full width so if you want to make it full width how do you go about doing that it's quite a few different things you can do it so the first thing is on the actual on the actual loop louse you can you can set a margin at the bottom of the section and this will push that space down below over there the second thing maybe if you want to do for the if you haven't added this box-shadow there's quite a large gap between that image and that image so it would look really spaced out and the reason is because of this width so you can also spit modify the width of the row in the loop layout okay so there's two things I want to show you our one how to add space at the bottom and how to modify the space in between the products so the first thing you want to do is into the liver out you and in here in the section I want to add space margin-bottom of like oh no it's 1440 pixels if you want to reduce the space in between the products then the first thing you need to do is in a row sizing with push that to 100 I'm just going to leave it a because because I have those box-shadow and stuff I want to leave it the third thing you can do also is in on the shop page where you have the product loop in this row you can modify the gutter width and that will change the size between the products okay so the other thing I wanted to kind of go over I don't know my computer's going a bit slow so I don't waste too much of your time other thing I want to go through was the mini cart and auto show you this many cards and and that side of things so right now on the page if I just go add to basket it you know adds it to basket on the category pages nothing really happens or I go to the product page this doesn't get updated or that product page now I added to cart over there it doesn't really do anything either so the first thing really is we have some settings to add a custom cart icon so - you know it make modify this car - icon so I'm just gonna show you that very quickly but I'm not gonna focus too much on that I just want to do that because I like the look of a different icon same body comment for e-commerce settings caught icon settings yeah you can say yeah I want to use that custom cut icon I want to use this one I'm just going to remove that items after that's you can choose the style you want for the number and just click Save now when you when you reload the page the new cart icon will be there but what I want to do is I'm gonna shoot over to the mini carts settings in our in our you know at night admin mini cart pop-up settings yeah I want to specify a mini cart so I'm gonna say okay I want to use them in your carts and it's two different styles one is a drop-down and one is the slide in I'm already like the slide in so I'm gonna say okay I want to be sliding now bear in mind with the slide in your cart icon might be very far away so there's two things you can do really the first thing is you can have it on hover and change the hover clothes delay time so you consider two maybe three seconds so it gives you three seconds from hovering up cart icon to admit the minicard slidin but I prefer click because it actually it was intended to be click and you can style up the mini carts and everything on this page but I'm just going to leave it as standard okay so I'm going to show you something that now if I reload this page I'm going to show you the problem and in the solution the problem is when you add this to cart it isn't adding to cart so what you need to do is you need enable audio Ajax Add to Cart this so if you had a body commerce mods sorry I'm going I'm flicking through quite quickly and it's because since you running really slow and I always talk about it but I just like to have things fast so go to body comments mods page and in here we're going to enable Ajax Add to Cart Ajax Add to Cart allows you to add a product to court without reapeth without reloading the page so I'm gonna enable Ajax Add to Cart and then in the mini cots pop up setting so into the engine body Commerce minicard pop-ups aliens I'm gonna scroll down to this Ajax mini card settings section and what first similar does iron able it to be Ajax mini cards I'm also going to show you the many cards after the update the third thing you can do is not have the mini card show and instead have a pop-up show saying add it's a card to continue shopping I think you've seen it before so I'm just going to have this out auto shows and enable that so we don't have well we don't have to be doing this too long today I don't take up too much of your time so I one thing I do want to say is a lot of our modules have had a lot of settings to really customize things further so for example Oh our gallery or our gallery for the products has different sliders they have the the horizontal slider the vertical slider expandable slider there's lots of different settings for each module so bear that in mind when you when you're doing a site so there we go right now it slides in and the number updates that's quite a nice little mini card slide in an Auto Show the third thing I also want to kind of talk through was the checkout so I'm going to go checkout page but the checkout page there's two ways to set up a check up one is by creating it yourself using our checkout modules or two using one that we've like a premade style that we've made if you use either you have to enable a custom checkout layouts in there you can either define a layout that you've made in the Divi library like we did for the shop layouts using the checkout modules or you can choose one that we have here I quite like the Shopify style remove title or make it full width yep that's why I quite like so the Shopify style is one of our newest layouts and yeah I'd recommend trying it out on your store we're going to be adding quite a few more stuff in the future in the near future and to help with your checkout flow one of the things when add is during the June a in between the product page of the checkout to have a to have like a upsell section so let's say you want to clear landing page and you can say yes all the different information Add to Cart and that would go to a secondary page and we'll have an upsell and then lost the check outs they're going to be putting those kind of things to really streamline in and improve the checkout process here we go so this is the Shopify style it's already dance because I need to enter it in so this is this is one of the styles that you can choose for the checkouts or you can create yourself with modules what are other cook quite cool things to talk about is the engine body commerce mods and in here there's quite a few different modifications that you can do what are the ones is this formfield customizer so the reason why I put it here is because it affects everything on your website so for all the things to do with we're comments so let's say you want to have a custom input field so let's down the checkout page you know you can either customize the check on paid input fields in the check out tabs so over here on the body commerce checkout tab at the bottom we have this style you'll check on area or in body comments mods form to your customizer this can also customize this but also the inputs on the product page or all the account pages so it really goes through the whole through the whole thing the next thing is this quantity field so I'll show you this quantity yeah we'll just leave it like that background color number minus order stylist it's a nice solid order quantity one border color make it black so what I'm doing is for all the quantities throughout the website I can also do the select dropdowns as well or the quantities are throughout the website I want to be customizing the appearance I'm just going to show you what that looks like you you there we go so you can see the quantity is now as custom looking quantity box so that's in this form for customers are there other thing is we have some short codes which you can use throughout the sites and even some custom CSS JavaScript can be added there a lot of our layout packs that you let you download I don't know if anybody knows my layout packs if you don't know check them out on our blog or we would ask me hello on the actual product page what if it was product page is a section where you can link them straight to the layouts when you download them the custom CSS JavaScript that relates to that layout pack is in there so the other thing was about adding how to add variations so if you have variations of a product how do how do you add them and how do you get the variation swatches and the various it variation swatches will come and I won't go into that because it'll take too long but just to show you the this hoodie this hoodie has some variations so either I can say select options there and in what we want to do is we want to go to products attributes always add your attributes at this level it's a weird because we're comments kind of puts if you add them on the product page itself and if you have done you know what I'm talking about we've almost put stores or in a different stores it differently you want to add your attributes here color and size and then here you can configure the color to the swatches to be blue gray green yellow red or whatever and then on the product page you have the swatches correctly right now just a select box the other thing I wanted to show yeah so that's that I think sorry I'm kind of rushing now because I realize it's been like 35 minutes and I don't take too long the other thing is in the menu so we have a if you're using the theme builder and you're using the menu module and you want to have the custom carts and the mini cards in there make sure you have the in there in the menu module there's a section where you can choose what elements to show enable the cart icon there and then our plugin will work perfectly so Oh one thing I want to show you I said there we go you can see I added margin below the section earlier so you can see it's showing now and now it's showing up a lot nicer now what happens if you want to add a variation to the bot to the court from the shop page what do you do there I think I will link I've done a video about that so I'm not going to do it I'm not going to go into that but I'll link that video in the description so yeah really that is kind of the kind of general introduction onto unto body Commerce I was hoping to get through a bit more but I don't want to kind of take up too much your time or and my computer was going a bit slow but essentially that the product page you would create it the same as we did the shop page you would go to the Divi library create a new layouts and then there you can add the product page modules and when this is pp the gallery the title or PL so product page loop layouts you can also you know create a different one for accessories that are different for clothing and such just the search results is created exactly the same as the shopping category so the minimum minimum requirements you need is the archive the product page the product loop module on the archive pages make sure you don't have a custom loop so this is another thing that I kind of want to just talk about so with with the product loop module you have a custom layout and then you have a custom loop so there's two you know I don't to kind of get confused between the two the custom loop is sort of custom layout is when you use that loop louse so making it look custom custom loop is when you want to specify a custom query so you want to say okay I want to show all the products in this category only do not do this on the category pages because we're commerce and body commerce will automatically pull in the correct categories but it lists down the home page you want to have a section so I'm showing the I don't know the hood is the section showing the t-shirt section trying to hit the the caps yeah in this product loop out if you if you scroll down to custom layout options the computer is running a lot better no custom loop and here you can choose your own post number number of posts you can say i-16 include categories clothing you can even to a comma if you want to do more or you could say okay I want to actually show all the featured products or I want to show all the on sale products and you can even do I want to see the on sale products in the category clothing so you can really get like you can really get some real detailed loops going but this should only be used on pages or the shop page not on the category page unless you want I guess but you don't need to create a different category page for each category if you want to mean you just new create one with the product loop with this custom loop layout what sorry this custom loop disabled and it will show all the products in that particular category some people were asking actually so here's our category loop so candidly loop will display all the all the categories when I showed us a grid yeah you can you know you can show all the different categories that are available so on the shop page will show all your categories when you click on clothing for example or then show all the subcategories when you have that on the category page layout such as accessories if you don't want the products to show on that page you can in the settings disable products when category has child categories so let's say ok we click on the shop page we click on clothing takes us through to the clothing category in the clothing category we have accessory sunglasses I don't know shoes belong trailing shorts whatever we have we have child categories but we don't want to show the products of all the clothing we wanted want you want the customer to go there narrow down if you enable this option over here it won't show the products unless it is the lost cat the last child that the last one other thing is quite causes equal hot grid card so you can click on that or equalize order or the hearts another thing to mention is link each layout to products so you can click that and the whole box will be clickable please make sure you don't have a link inside the loop layouts so if you have a Add to Cart module this one it could cause issues because effectively you trying to link and then a link inside if you have the thumbnail or the title module disable the link to product page options and this way it won't the link in link 1 when you're confused I think I've kind of gone through very quickly what I've what are what I wanted to go through this maybe just just run through some of the yes there's tons of modules but you can go like oh no gallery this one I introduced you can see there's a gallery you don't add the gallery on this page well I just want to show you in the gallery you can choose you know a horizontal slider vertical slider expandables there's quite a lot of different options you can choose from I think I'm going to do it a second webinar where can kind of go bit more into detail into certain sections I think because I don't think I've given you guys enough time on this but I yeah I hope this has been helpful I'm just going to jump on to some questions really and then we can go from there so I don't know who who wrote this I wasn't given anybody right what is their way to have the image blurred when the product is sold out so not just a badge yes that's quite interesting if a problem if a product is sold out like does the CSS class get hit I'll do is I'll try I'll go on - I'll try and have a look and I'll try and say this question at the same time question - I the question is what if body combos compatible with a member management plugins such as member pers I'm a press or wishlist so a body converse is pretty much compatible with most plugins that I know of there has been a couple German like chairman German market plugins which for some reason in Germany they have some strange laws so there's the cold plugins they I'll help you get over those laws I'm just gonna so I know that there's a couple of there's a couple of those plugins that kind of don't really work too well but if you go to body comment settings in there there's one that allows us to override a their templates but most other plugins work well now if you do have any issues what you want to do so I'm looking at the screen now what you want to do is go into a module and we have one call to action short code module and what this does this allows you to add an action name or short code so let's say there is an issue with one plugin and it isn't showing on your product page all you need to do is contact the developer or look at the documentation find out the action name maybe the action may be the action name is called I don't know action name could be luck before before products or something like that anyway so you find out from the developer what the action name is or if they have a short code you add the shortcode so a short code name either one of those only add one and you could get around pretty much everything with that because most plugins will hook into an action or it will use a short code so if you have any issues with compatibility that's the best way to go about it I'm just going to try and make this other stock there's a symmetry never stop imagined okay so let me just I'm not looking a question for you can you have the categories displayed on the shop page not the products being struggling with that yeah so I think I'll come on to that a little bit earlier but I was to use the category loop module and in there and I'll just show you now so I'm sure to remove this gallery yeah I have this catch me loop and have the product loop I'm just gonna update this layout and right in and added I ate enough freeloaders and see if it's has caught up anybody any issues with a responsive and accessibility design risk I don't know any issues with body Commerce and being responsive accessibility I mean you'd have to kind of ask a specialist I guess because I'm not the best at knowing what that is so here I have this catchy loop NASCAR clothing decor and music and just to tell you even further if you go to products categories in there you can add images and with the sketch we loop module you can actually misuse I don't know you can actually show the image out I'll stop redirecting cause I want to show you yeah this column style so you can say okay I want the title above the image on the title on top of the image I want a little below if you have on top you can choose if you want to have it so when you hover the title shows or the title shows on top of the image which is quite nice so I think I made this beanie album I made album base album here out of stock but if I can coming it blurry let's just see yeah so what you can do custom CSS if you go to this list you can see this class called out of stock so if you do dot out of stock and then you can even do you can talk say other stock and an image you can target it with some CSS to make it make it blurry so yeah so this this you need some custom CSS but what's quite cool actually is yeah you can as well does that's the filter blur work yeah there we go so I've added this web filter blur and what's quite cool what the expect tool is you can actually check it out so what it would be able to be a dot out of stock space image and then we'll actually oh do you want to actually only have it on the product on the loops you want to do ET underscore pv underscore DB underscore at that one sorry chop grid whatever then yeah then the image there out thought I was talking an image make it blurry okay so the can you use a mini card on extra theme when I caught icon is on top of top header yes it should work and actually any issues get in touch and I'd be happy to help well Ajax add a card work on the extra theme yes it'll work actually work on anything really I'll be honest with you a depakote isn't Divi specific a lot of actually now how variation swatches are not Debbie's this specific so actually you can use other themes but you just won't get the the power of Divi behind it can it be translated to Spanish so on now excuse me we did start a github like section where people could help translate the plug-in and that's why the French one happened because there are so many people who are helping to the French translation I do believe that it isn't that isn't the best because I've done some of this but I did start with the Spanish I believe and it just didn't kind of kick off so you know please email us and I can help you get that sorted can you add a template to look at the at it without disturbing everything else on the page since you have also updated CSS in the other templates to look at it without disturbing everything on the page then you also have to add CSS they're confused by that question can you add template to look at without disturbing I mean please can you email support at Derby England calm and I'd love to help you their support at Debian calm with that question I can try to kind of narrow down exactly what you're asking and I believe this is the last question if anybody else's your questions please get in quick question on tried the catch will be loop but couldn't really style the category text can you do that okay so I'll just quit me do that for you so what I want to do is I'll actually want to go to the categories exit so this is the last thing I'm gonna do I'm gonna start up show you the the Katori loop so on this shop page I have this clothing deck on music so I'm just gonna open this a new tab listen any tab and that some images tip because we want to have when I've adjusted to kind of inform the the users what it is so here I want to add a thumbnail for the music it's going to add a one of the one of the images yeah right here we go got one clothing when I have it's like a hoodie or a t-shirt or something like that at work and then the deck hole just to show you so the reason might be images I just want to kind of nail down a bit more about it there you go nice low deck all there okay so to Volare so another good question where I'm doing this and please come the questions because as long as I'm here answers can I use a Divi theme builder and still the Divi library what is the drawback ok so you can use the Divi theme builder it does work well the reason why you know we before the Divi theme builder we had all our way of doing things in our settings thank you I'm bumping this table sorry so that's the reason why we have all our settings there what are the drawbacks are using I don't really know of any drawbacks I'll be honest with you so you can use this theme builder what I would say is to try keep everything in one place just for your own sanity if you use a theme builder keep it there or if you're going to use you know the our settings and use our settings but no so here I want to have I'm going to only use this image title on top of the top of the image and the design tab title text you want to you tried to style the category text yeah I wanna have I don't know and so let's make this a lot just make it really big happens I hope it works I was I want to look good like a fool are you joking it is I mean body Commerce is so it's so big in what it can do this so much it can do so at first it can seem very able overwhelming and I do appreciate that but once you once you get on with it and you really get to know how to works it is a little help you loads with your development yes on reload this page and we should have an image behind or the category and we should the text should be watts about 40 pixels big yes yes so we have the images and in on hover as you can see they have this okay the hubba-hubbas whites as well so probably shouldn't have doesn't watch it up out of all the colors I choose that don't want us build it this my website is going painfully slow enough it must be due to the live stream because it wasn't like this before so I do apologize again know that the next large tree we're gonna have my my left my other PC hopefully back so it'll be better so here in the overlay we can choose the zoom color or the hover color so actually I want to have a hover color as black the white text and made the white text 40 pixels so when you say you can restart I hope that makes sense I'll sign up to carry but description on the carries icon I started okay so you can start at the description I believe there's a saying for that if there isn't a sin for that like I'll certainly add it for you I don't know why it wouldn't be because we had quite a few people using it I will take a look at that but yeah so just to show other people this dark : all hovering over with loathing decor music so this is on okay so you're correct I'll I'll definitely add that on the list I don't know how that's been missed I'll be honest with you so if you do ever have any things you always have people you know messages and saying can you add this and you add this and we always try and hope people add add as much as we can because we like we value your guys feedback the most because you guys are the ones that use the plug-in so you know so if you want our stuff added just just get in touch please and let us know so I think we're going to come to the end if there's any I'm gonna have to read through the comments because I would love to see what everybody's been saying and I hope I hope I've made sense of hope of kind of help to not confuse you more [Music] yeah I think I'll do another some some more live streams hopefully and we can we can really we can really take it to the next level and get some real like detailed kind of layouts and hot teach you how to even add some JavaScript and stuff like that we'll see what guys but this is the first of many webinars hopefully so yeah so I guess that's it really oh one final thing like I think I said before I really appreciate you guys as customers without you guys like you know we can't do what we do but I value you all and I hope that when you if you have any any issues and you get in touch you feel valued if you don't I'm sorry so and I like I do yeah I do wish you guys the best and I do often I do often like you know think you think yeah yeah I won't go into the air so yeah so I appreciate guys and I hope you've a great day and yes any questions if you if you need more help or any questions you may have that maybe hasn't been answered please can you email supported boobie engine calm and I'd be happy to help or one of us will be happy to help and then I guess the witness webinar it would be quite nice maybe we can try and nail down a specific topic and we can just get that specific topic done but we also have video tutorials online we have documentation as well to help you have a brilliant day guys and yeah we'll be into a wall well speak to you soon and yeah I pray you all have an amazing week and this year's gonna be yeah I just hope it's a great year for y'all now with Colvard being being here you know we have more opportunities to hold people online so I hope you guys can you know really really help other people online in and hope the maximize their businesses and your own so anyway that's it sweet guys have a great day and cars and girls sorry and we'll speak soon ears

Channel: Divi Engine

Views: 2,460

Keywords:

Id: FtEvbwGxE2M

Length: 57min 30sec (3450 seconds)

Published: Wed May 20 2020