Meta Box Tips & Tactics Webinar for AppSumo Plus members

all right start started the webinar and there we go people are popping in we got dwayne ian ilan oh it's moving so fast jason lorraine martin where are you guys coming from send us a message in the chat let us know where you're at on here is out in uh hanoi vietnam and i'm based in baltimore maryland usa all right vancouver bc lorraine okay dwayne is in ontario ilan dallas or no ilan and israel duane in dallas paul in germany siren in dublin fred and austin mark in italy robert in belgium hans also in belgium man we've got people everywhere oh yeah and then pablo and uh wow i don't even know how to say that pablo is that saint alban they you gotta help me out here pablo phillip is in germany awesome love seeing everybody hop in here let me know where you're coming from um i'm gonna send out a poll as people are hopping in we're gonna wait about five minutes before we get started but um let me send out this first poll here yep can everybody see that yep seems like votes are coming in good good just want to get a feel for how um how you started to use metabox so far more people popping in love it lucas from sao paulo brazil munich from the netherlands great yeah take a minute to answer that poll there we're gonna um take about five minutes to wait for everybody to hop in if you have questions prepared um that you would like to get answered today go ahead and start using the q a tab in zoom and put your questions there we'll get to them shortly after we get started here um i'll start you know giving the questions to on and he will answer the first question is always will there be a replay and the answer is yes there will be a replay the replay will go out tomorrow to your inbox your email inbox so be on the lookout for that thanks carson for that question all right let me end this poll and i'll share the results can you see that on the results there uh yes i see it cool just an idea of where everybody's at interesting yeah interesting spread here okay and then i'll have uh let's see i have one more poll if you've been on a tips and tactics webinar before you're familiar with these polls it's always a great way to help us to understand who is on the webinar so i appreciate you uh giving an answer here yeah and thanks i see jason and dwayne already started putting questions in q a if you have questions you'd like answered go ahead and put them in the q a and we will get to them um as we begin the webinar here um thanks philippe for putting your question in don't use chat for questions they'll get lost i will not answer uh i will not ask questions that go into chat so definitely put them in q a martin from switzerland great to have you here martin mirella from sao paulo brazil marcelo from brazil there's a lot of people from brazil that is awesome we're still representing strong today all right let me go ahead and end this poll can you see those results there on uh yes okay very cool a lot of uh solopreneurs founders and agency owners great to have you guys here okay i'm gonna stop sharing that and we'll go ahead and uh go ahead and hop in here get started let me share my screen suppose i can present can you see the uh the first slide there yes i can see it okay great just wanted to make sure um all right well welcome to the tips and tactics implementation webinar with metabox and of course hosted by appsumo um i'm luke francis i'm the subscription marketing manager at appsumo my focus is on providing value and bringing new benefits the plus program so that's you guys and on the call here and presenting for metabox is on tren uh from hanoi vietnam uh the founder and ceo of metabox it's such an honor to have you here on uh hi everyone so let me just quickly explain what's going to happen today and then we'll hop right in to you know getting your questions answered so this is new this year the tips and tactics format is a new exclusive plus benefit so the idea is that it helps you to use the tools that you purchase in your own unique context so the most value that you will get out of this tips and tactics webinar today is when you ask the questions that are are very relevant to you um so ideally you've taken a look around metabox and you say oh hold up i've got some questions here about how this will work in my business or in my use case and let me ask on today how to do that um and the more specific you get the better and he'll do step by on we'll answer all your questions with step-by-step walkthroughs so you know he'll be sharing his screen and showing you inside of metabox how to how to do the things that you would like to do with metabox if if possible of course um and of course this tips and tactics webinar is recorded so you can count on this being in your email inbox tomorrow so be on the lookout for that and at the end of the webinar we always do a survey to get a feel for how um how helpful how useful these webinars are for you and what you'd like to see improved or what you really love that way we can continue to do more of what you love and less of what needs to be uh or you know just make the improvements that are necessary so with that being said i'm going to pass it over to on and he'll jump right into sharing his screen and kind of showing off how to get metabox set up that'll be the first kind of path we take and then after that i'll start asking the questions as they come in okay let me share my screen okay this one okay can you see my screen i can see it okay uh i see a lot of you uh uh haven't used mailbox yet and some questions came in like um uh like asking what is the use case of mailbox so i'd like to spend uh the first several minutes to explain the purpose of this plugin and how to get into it so this is um a car selling a plugin that we built ourselves and there is a theme for uh selling car websites um so you can see here is basically a listing or directory site where you can list all your cars and sell it so um in wordpress you know there are two types of content post and page post is mostly for blog news or some um kind of the you you post regularly uh and pages mostly is for static content like about page contact page or something like that so you need something more special to show your content of your car like in this website and it is called custom bus type in wordpress uh so meter box can help you to create such kind of content like custom boost types and in each die and and in the custom boots type you can see that there are a lot of details that you need to put on like four cars we have the number of kilometers the color the model the mic and also the deal information gallery something like that and also the price so these information uh that we have to use some way to enter that in in the website and uh the information that attached to a content type in wordpress is called custom post type uh not custom fields uh for the custom pro site so basically custom fields is kind of the information that attached to a content type and to to create a custom fields for for them we have to use a plugin and mailbox is maybe one of the best plugin that can help you to do that so uh basically um for the very basic use of mailbox you can imagine that it helps you to create content types like car and custom views like all the details for cars and once you get into that you can see metabox is potential uh if very powerful to let you create not only uh custom fields and custom boots type but also more things like uh settings for your site uh front-end forms uh user profile forms and other things so uh in short where you need more the data to put on the website you need some uh at least a good uh a solution like meter box so metabox is help you to manage all the data on the website so um i think that is the the very first step that you get into the mailbox and um hey on just hopping in here this looks this looks great with the the front end of how this displays could you show uh maybe the the viewers here today how it looks on the back end uh and how this how this all comes together to look like this on the front end okay okay um wait a minute um uh you want me to show the back end of this website yeah so how how meta box contributed to like making the uh the site look like this okay okay well let me show you um another site which i have uh the what which i save the username and password this is a similar theme that we made okay yeah it is similar let me show you the admin okay okay so we have all the listings here uh this is the listing for the cars and you can see um the columns which are shows on the the data for the the car and for each car we have a lot of information like you see on on the right the payment price sale price number and all the the information uh for the check and the registration number uh check is saved and also the map address and specification for car and gallery maybe video and pdf like other thing like everything here is built with mailbox uh so yes okay awesome no that's perfect that's exactly what i was looking for um and i guess you know as we answer some of these questions we'll get to you know how you end up setting that up with metabox so um yeah let's just hop in with some of the questions that are starting to come in so jason you asked the question that everybody was asking so we'll start with your question and that was around um the integration metabox integration with oxygen builder so maybe on you can speak to that oh okay um um we are working on the integration with the oxygen team so to do that the integration is being processed and if we have to say about the estimated time exactly i'm afraid i can't tell about that because it involves a lot of the phrase and technical issues but we can say that it is on our top priority right now and this if we release new feature uh that will be the first great great to hear um let's see here dwayne is asking about how to use metabox and elementor together ah we already have uh the let me show you the the extension for elementor uh it's very easy to use with elementor um like like you can see here um before going into the details um it's worth noting that you have to use the elementor pro version because only the pro version has the dynamic content which connects uh is widget to the dynamic content source like a post title boost content thumbnail and custom fields and when you use this free extension mailbox elementor integrator you can just select it from the dynamic menu here and choose middlebox field and you can select which view to show on the front end the the only um like the disadvantage we have with elementor is that uh we haven't built the support for uh displaying groups in elementary yet but all the the fields in the free metabolism version are we already supported so this is kind of easy to use if your data structure is not very complex that you don't need to required groups extension i'm going to go ahead and post the link that you're looking at right now in the group okay all right um philippe is asking about you know a lot of integration questions here today um felipe is asking how uh how to use it with woocommerce uh using um with woocommerce i i actually uh woocommerce create a custom boot type product so you can use metabox to create more fields for your products for example if you have a lot of stores in different locations in your city and you i want uh the customer can go to a store to pick up your stuff uh so you can create a select field for your product and let uh when you edit a product you can select which stores it is available so users can like customers can go to that store and pick up pick it up um but that that is the very basic uh use case for woocommerce and we actually have some tutorials here on our blog that you can just search here like adding custom views for woocommerce using mirrorbox for advanced integration that i i also received questions in the past that some people asked for adding fields for the variable products in woocommerce and i i have to say that uh woocommerce structured variable products is very complicated uh it's actually a hidden boost type in wordpress and there is no ui in wordpress to manage it outside of the edit screen of products so uh adding custom fuse for um like variable products is still a problem uh and i don't think uh is doable without plaguing at the moment okay is there an example of a woocommerce setup that you could show uh how you've done that with with metabox uh we um i i don't have the demo right now here but you can actually uh read our um like a tutorial and you can see how how it only set up here like all the screenshots is built with our demo all right uh could you post that link in the chat please on absolutely uh wait a minute i need to move the panel oh yeah yes no worries okay okay uh where is it where is the chat here okay to everyone oh attend this yeah you can just go to uh our mailbox website and uh and search it um woocommerce and it pop up here okay good valuable product and add custom views to for e-commerce excellent okay all right um so cyren is asking will metabox work perfectly with app my site uh i've just i've looked at admin site and i see uh is um a software to turn your website into a back-end and it builds the front-end as a mobile app for you so uh the connection between the app and website maybe the wordpress rest api or something similar like that and i think metabox is a perfect library that you can use to add more data to your mobile apps because we have uh with uh we have the rest api extension that you can use to pull all the data into your app where is it it is here and the purpose of mailbox is adding more data to your website so you can use it as a backend and the front-end it doesn't matter where you use a web or a mobile app all you need to do is just get the data and show it into your front-end application so i think at my site we use mailbox perfectly no problem at all okay so marco definitely check out the rest api if you have any follow-up questions just drop a question back in q a and we'll get back to that or syrian sorry um well uh sirens asking will there be a meta box marketplace where people can share the unique meta boxes they've made that can be easily copied for use um i think we don't have a marketplace at the moment but you always can join our facebook groups and share with people over there some developers already shared their custom solutions from inbox and all of them are free right now i haven't seen any like a premium or a paid version of them but if you get a quite a lot of attention for your solutions you can make a paid version and we can help you to put it on our site like we have a third party section here third party sections here uh we have more few types the people already built some plugins and some themes so if you have a custom solution uh we can put it here it can be seated like a small marketplace uh but actually if you looking for like something where you can like sell stuff i'm afraid we don't have it yet okay thank you for that um erdahl is asking how can i create a settings page in wp dashboard wordpress dashboard to make it easier for my clients to add their business info such as logo email phone number etc and he's saying i use elementor for the page builder actually there are two parts in your questions the first part is creating a settings page in the back end and the second part is showing it on the front end with elementor uh so for the first part uh i think uh though the plugin that you mentioned the dashboard admin page i don't remember it exactly but the similar i think it should works well with on the settings page that created normally in wordpress and mailbox can help you to place a setting space easily with the extension settings page here here so you can use it to create a settings page for your website and build it like you can put all the logo contact information and hotline something like that easily i can show you how to do these uh yeah if you could walk through setting that up that would be awesome i think that would help her doll out amen tremendously okay if you uh bought a mailbox uh the tier two or three on appsumo you have the midmos aio so after activated you have the settings page here and you can create a settings page like a customer bottle uh enter an option name for that something this option name is used to save in the database you can use it um uh usually it should be something like the name but lowercase and underscore so it's customer portal uh so menu type top level sub menu if it's better to use top level because you can specify the logo here the icon here sorry so the required capability default is added theme options so anyone who can manage your themes can use it or if you want to use for only admins you can choose many options uh css class and size um something okay type style top okay i let's create it first publish uh you can see it here below the comments uh now let's uh right now is empty because we don't have any fuse settings views yet let's create some views so go to custom views here and add new uh likes let's see settings views for customer portal and we add some feel like uh first the text i like hotline uh and you can add very uh like a lot of information here it might be required uh a pansex repentex and somebody here you can also make clonable if you have a lot of hotlines like many hotlines you can also add a logo which is an image so i choose single image logo here something like that of okay okay uh i'll show you how it works later ah so choose settings for the settings page customer portal there are some runes here that you can choose like condition logic make it visible when some fields is some value or a [Music] location like show only when users have some role but i i i think we don't need it at the moment okay now go to the customer portal and you see here like like and add some logo okay i have okay here i'll select it and save it okay so all the data is saved in the option and you can use elementor to put it on the front end let me show you how to do that i don't think okay i give it a mentor um oops activate elementor pro okay now go to templates add new uh let's try to add a header kind of header i rarely use uh page builders so uh if you use something here okay uh okay let's show a search for we show the logo yes we see dynamite text here oh it doesn't show up here oh wait wait wait i need to go back to the admin first oh let me go back to the admin to uh ops why is it i think you can click this you yeah i rarely use it uh wait wait i need to activate the elementor extension okay i forgot okay now go back to the header builder choose an image and choose a dynamic tag and you can see mailbox field here and choose field logo from the customer portal okay and then and now we'll bike in addition choose the text view text view and choose ah wait wait wait wait wait i need to choose from the side settings not from the both settings uh size setting middle field hotline okay oops it doesn't show let me see it here i choose this from the side settings yes logo yes that's right publish and condition to entire site safe and close few live sites oops off there's some maybe some okay i need to fix it yeah no this is fine and i think you're showing the workflow definitely uh definitely showing how the you know it all comes together and it's it's very clear you know how they how they can pull in those dynamic tags and fill that in on the image and the header there um yeah sometimes things don't work when we want them to right so it's like i completely understand yeah i'm very sorry about it maybe elements are updated recently and we haven't updated the extension yet we have to check that i will take a note and we will fix it very soon sorry guys yeah okay but i hope you uh can see the workflow and how i set up the settings page and show it on the front end the process is similar to on the both views and settings view yeah and erdahl said that he he understands the process now and he said thanks and some people are saying that that that kind of error will happen with demo sites so completely understandable thank you though on let's see here ori is asking how can we add url image to images um i insert on the sidebar so there is a tutorial about banner on your website about images but not url in the images does that question make sense on ah i remember that tutorial wait a minute um so it means on the sidebar let me see add custom view are here here it is so yeah i think this is the tutorial that you mentioned uh the idea of this tutorial is that uh you create a settings page just like what i just did before for your website like a banner and you want to show it on the sidebar um okay this is the process of creating the the the settings page and add settings field the the one difference here is that uh you need to use a shortcut to display the banner in the sidebar like i display the settings fields on the sidebar and it is the code that you want you need to use and you might want to change it like here uh it shows a background image this image attribute 0 is exactly the url that you want to use here it is used as a background image or in the inline style but you can display just that um let me show you something okay uh instead of doing this you can just use like this and source like this that's all it's very easy to use actually i don't think we can see it if you did it in another window on uh i don't think we saw what you just did because okay uh here let me show you yes uh you can see it right now yeah i can see it now let me copy the the shortcut here and show it full so you can understand so syntax uh so here you get the settings and here you get the image and here you get the uh all the information about the image attribute and after this command line uh image i should use uh is an array of uh url like dominion.com as feature or jpeg and the second parameter is the width like and the third parameter is the high so you have all these information in the image attributes and instead of upload it as uh in lifestyle here you can output it like this zero okay that's so this is the url of the of the image uh does that make sense yeah ori let us know if that is more clear for you now um or if you have some follow-on questions there i'll move on to the second question that ori was asking um can you ex uh so maybe keep that up so we can get back to that if uh ori has some follow-on questions but uh as we're waiting we'll ask can you kindly show how i can add recent posts to the sidebar uh a recent poster sidebar i think wordpress already have that wordpress already has a reasonable switches which you can just pull in into the sidebar if you need to uh pull more information about the recent posts like thumbnail or publish date uh there are a lot of plugins in the wordpress repository that you can use i i don't think that related to mailbox because it doesn't relate to any extra data that metabolise can help you okay and would that be the same for because the follow-up question would be can you explain please how to add a form in the sidebar same okay uh let me show you that we did with the the car listing in the beginning uh so basically uh in mailbox there are two forms that we can put on the front end the first is uh the post submission form and the second is the user edit user profile forms so for example if we go to a car for car uh scroll down and you can see a contact form here here this this form this form is a front-end submission form that uh mailbox provided um and it requires the extension front-end submission here front and submission form so um basically um to create a form is very similar to create a field let me show you how to do this okay so at first you need to activate the mb front-end submission extension and go to the custom fields and once you activate the front submission you have the shortcode here and you can just copy it let me copy the for post because this is for settings page for both and you can paste it into any page like this code and you can just paste it here uh the only uh like important uh attribute of this record is id which is uh the id of the custom fields group that we created uh created before here which is this this one to get that id you can copy it here radio or inline so you put it here and both fields can be tied to content or just title or just date or [Music] like um thumbnail like that and there are more like attributes that you can see in the documentation extension for a submission um shortcode attributes but there are a lot of attributes here that you can use like you can label the title differently label the the content differently or you can uh make it exact okay let me show you um and publish it and now you can view the page and you see here okay this is from the previous example and this is from the this is a title this is the thumbnail like don't worry about the style because i'm using a blank theme it doesn't have any style so add media you can actually choose here and this is from the fuse group uh the radio radio inline and submit here so basically this is a form on the front end that you can put it so the flow is is very easy like just create a custom field grab the shortcut here and if you want more settings for the from uh go to the documentation and add more attributes if you want okay i think i yeah definitely sorry i was on mute there um no that was that was very clear um can you uh talk about how to add sticky elements with meta box on the sidebar i think uh it doesn't relates to the mirror box okay it's all also about the front end i like uh uh you can use like i can show you uh there's well if it's not related to metabox there's no need to show us i i think uh you know if it's something that wordpress already does then then no need to uh to walk through that here okay but yeah thanks for clarifying that though that'll help um so melanie is asking another integration question about the integration with beaver builder it's a fun name uh i think with bb builder we have uh maybe a better integration like elementor wait wait integration and you can see uh this is a free extension that you can use to integrate with your femur uh remember that you need b with female not be rebuilder because the female lets you to pull dynamic data from the post or site uh the very similar to the elementor pro uh just like you can see in in the screenshot here okay let me show you in the backend i'm not sure if it works oh one minute elemental i need to deactivate elementor first um oh i'm sorry i don't have vivo builder and beautiful female installed on my localhost so i can't show you but the process is very similar to what i just showed you with elementor uh that you can create a custom field for your settings page or for post uh when select uh like when add is a more to a beautiful builder cognitive model now which is like elemental uh module uh on the front end uh you can select mailbox view and connect it with a field from here the connection with beaver builder i think is better than elementor because i think their api is more developer friendly and we developed it uh with more comfortable than elementor all right okay good um let's see there's a anonymous attendee that's asking i would like to know if i can ditch woocommerce and make my own similar solution more flexibility to customers payment gateway integration reports so the question is can i create my own version of woocommerce i believe with metabox ah yes absolutely uh actually you can do this and we already did this let me show you uh wait i we already created for a client in vietnam this is a custom solution for an e-commerce website uh i'm sorry if it only in vietnamese but you can see its products here and we customize uh is a lot like uh this is a price uh vp vip one vip2 like this product has a lot of prices uh and the sale price and this is the combo like you sell as uh multiple products at once uh this is a discount and this is the um like the deadline for the combo like it is available for a short period of time and these are the taxonomies for the products so uh we built everything with mailbox we built the settings page slugs tag the the card page the checkout page the confirmation page this is the payment and in vietnam we use only uh cld and the bank transfer so this is the information for buying transfer and the currency and this is support uh some short code that we use we also build some vouchers like discounts and so uh everything can be built with mailbox but i have to say that there is a lot of work that you have to do uh if you go this way uh because uh you have to care a lot of things like mailbox is just a tool and how you use it depends on your business logic on your flow and on the inspiration that you you want and if you want to build a solution like woocommerce with the wide range of products and wide range of customers wide range of use case i think it might take you months to do that uh but if you use to make only an e-commerce website for your client for a very specific case like uh what we are doing right now and is totally doable and it can be doable within a minute thanks for sharing that on that's really cool um mark is asking a question about the limits of metabox he says when you consider an average hosting let's say siteground geek how would a meta box setup perform if you have about 25 000 to 40 000 records so this is apartments with all their details and related agent data so i'm guessing that's like real estate agent data is there a clear limit where you would advise to switch from metabox to a tailor-made solution um there are two questions here um so the performance of mailbox with an average hosting and when we should switch to a tailor-made solution so um i think i should answer the second question first okay um in my opinion switching from meter box to a tyler solution doesn't give you more benefit because we built meta box like uh like for developers first so it's very optimized for use case the the code base is very small very i i think it's super small uh if you build a custom uh like tyra made solution you when when it is ready you will see the very similarity between your solution and meter box uh a lot of things a lot we care uh uh for you already so you i think um building a custom-made solution is not a good idea and uh regarding about the performance i think 25 045 40 000 requests on an average hosting like siteground is fine because uh the way meterbox saves data in the in the database is very uh similar to what a wordpress saved in the database like um one one row for one custom field uh it is different from the acf like it saves two rows in the database so actually the number of rows in the database is doubled compared to metabox and we also have the the custom table extension uh let me show you with custom table custom table solution uh that helps you save all the custom fields in one brow in the database so uh if your number of records increase fast uh you can use it extension as to reduce the number of rows in the database and interact it with your php i think you are already a developer to ask this question so uh i don't think there is any problem with you to parry all the data from the custom table to show on the front end i think it is the best solution right now all right thanks for answering that and mark if you have any follow-on questions there just post them in q a here um let's see jason is asking can you show how to use reciprocal bi-directional relationships oh okay um uh reciprocal okay let me show you um wait let me close it yeah we've got so many tabs open now um let me show you how to create a reciprocal uh relationships okay let's go first for post to base relationship first so it's a relationship from post to a page so when you edit a post you see uh you see uh the meta box here it connects to which page here and when you edit a page like any page you see it connected from samples so it is a normal relationship the problem is that if you choose to connect from post to post like from one type to the same type uh so let me show you and i i didn't choose the reciprocal relationship i should change this post to post so when i edit a post you can see two two meter box so when it connects to and where it connects from uh this is uh a normal relationship but actually it caused confusion to users like you don't you don't want to connect to connect from you you just need to connect between post and that is exactly uh the reciprocal relationships so when you choose a reciprocal relationship and you just care about which post is connected to which post like there's only one meter box here so you know the post a is connects to the post b and you don't need to care about the direction from to that and that is the uh reciprocal relationships and to show you um the uh where the bi-directional relationship like uh if you want to create related post uh relationships for example if uh wait i i will make this post is related uh to this post okay so relationship test related to view tests and there's nested groups and a bit without the bi-directional relationships when you view uh this post you don't see the relation ships you don't see the connections from the this this post but uh invader box all the relationships are already bi-directional so when you edit this post you already see is connected to the the previous post so um uh so i think it's it's already answered the questions but i want to uh uh emphasize that uh if you use um a custom fields uh to create a a relationship between post to both uh and you have to remember that uh the data stored in that custom field is or is only stored for one post but in metabox relationships the data is stored uh for both uh both posts uh i can show you in the database so you can see more okay relationships here so when you see a connection here uh for example from the post id 317 to 21. hey uh we're unable to see the page you're looking at oh i'm sorry sorry i have to change the the screen okay here here it is okay can you see you know yeah we can see it now okay okay so this is the database how we store the relationships no not relationships the connections uh in the database each row is one connection so when you see the id of the post here the data is stored for both signs so uh when we query for the post with id 317 you see all these posts is received but you can query from the back backward like uh query on the connected post with the post with id2 and you can get the number uh 317. so with this way of storing the data the all relationships in mailbox is actually bi-directional and it saves you a lot of time to query back and watch from two in a in a relationship all right yeah got that thanks and jason if you uh have any follow-on questions there please post them as well um let us know if that helped you out um all right so we do have some integration questions again um let's see fred is asking is metabox has metabox been tested with the thrive suite we haven't have the integration with the thrive suit yet i think if thrive uh supports pulling the data from the custom fields like the normal wordpress custom views then you can use it uh with mailbox for the basic fields like text select radio checkboxes uh like mostly all of the normal fields in metabox because the way we save data in the database is similar to the normal way that wordpress saves data in the database so you can use it with thrive suit but for complex features like clonable fields or the group views uh i'm afraid you have to use uh uh our mb views extension uh let me show you um let me show you here view extension with the back end okay like like like this uh you can insert fuse for example we have a block group here you can uh click on that and insert sub view here in the sub view and this is an image field you can choose the image size maybe full size is better and i'll put it as an image tag or image url i choose to output as an image tag okay yeah and you can enter more uh data like text and of course you can put uh the data from other [Music] fields like this and when you're done you can update it uh and after that you can copy this shortcut shortcut and put it into your page builder widget maybe a text widget or any widget that renders shortcut and this way you can control the output of the meter box fields very like detailing but the disadvantage of this is you don't have the ui to control all these things got it thanks for that uh detailed explanation on um let's see here ells is asking what is the equivalent of acf repeater how does it work in metabox um wait we have a very detailed comparison between metabox and acf and repeaters email in acf is kind of weird i can show you features layout fields okay so uh repeaters emit box uh this kind of a wrapper containing subfuse and allows you to use uh to repeat data many times it it is very similar to the group of mailbox but the group extension meter box i can show you here is more powerful than acf repeater it it allows you to put any fuse inside like i show you here and make it repeatable anytime you want but actually the group of mailbox is equal to groups and repeater in acf and the best thing here is that you can uh clone like immediate box we use the term clone not repeat you can clone any field uh not just a group you can clone even the text view let me show you on the back end so you can see it for example clone eyebrow groups uh show you a text view a very basic text view you can clone it with clone it and i can show you a group view group view so add field text on images and you make it clone cloneable and collapsible okay and publish and go to push and you can see here this is a text view the thing is you can add more add more text if you want this is very sufficient uh in some cases uh like you have multiple addresses of your store you can use it to enter many addresses of your stores and this is grouped which is similar to acf repeater that you can add here select a field collapse it you can add more add more so very similar to the acf yeah but uh if you want more information about that uh please go to the icf which is in the bottom of the website i post it in in the chat box so you can read it where is it chat here um awesome thank you for that um um yeah and these links will also go out in the email um that gets sent to you tomorrow with the replay so if you don't uh take note of the links now you'll have them in the email there um so philippe was asking about uh metabox with woocommerce and he's asking you know he said he was expecting more fields in the product so to display different setup depending on supplier um is there a way to add more fields in the product with metabox in woocommerce uh yes of course um let me show you how to do this uh with what do you mean is i need to activate woocommerce okay oops sorry it takes some time continue no thanks okay maybe switch physically downloads no okay continue continue okay um so uh i'm going to create more uh fields for woocommerce products so products extra things like i said in the previous question like we we are going to create a select field for store like store to pick up like halloween okay uh and maybe add a like url for like of the motels like when you sell it not only on the website but always also on our marketplace um uh let's check a checkbook list for some notes like this is handmade or is is wooden or is this plastic like something like that ah okay let's go to settings post type and choose woocommerce product and update okay so go to commerce create a product this means like table i'll type and you can see uh the hr fields shown here uh and this is the fuse from woocommerce and if you want to add more details just go ahead and it's handmade and wooden and published and that's all and if you want to display the fields based on conditions like for if the way we let me see the question again uh different depending on the supplier okay so let me uh show you how to do that we can use a field like a select to choose a condition so let me uh name it uh available ah availability ability okay select yes or no and if yes we show the star to pick up so go to the conditionals here and choose the select fields okay let me make it more easier let's see and pick up here select the availability uh yes so this field start to pick up is displayed only when the availability availability is yes so let's see it table if yes so go to hanoi to pick it if no it doesn't show so you can use the conditional logic we've made box fields to display so many custom settings for your woocommerce products that's phenomenal i love that and mark peters is also in agreement he says big smile on my face love this so excellent uh progress there um let's see lucas has a question um i had a problem trying to use the metabox and custom feels on products with divi themes the text fields work perfectly with the metadata in the divi models but the image field did not work well i usually use acf free version it works for this we are similar to thrive suit that i talked before that we haven't have the integration with the dv theme right now so uh if you see any problem displaying the fields in dvd theme i'd suggest you to use mb views to output uh the the data of the fields uh in uh like we like like this and you can grab the shortcut from the md views to use in your tv uh like a dv theme the problem not problem but the difference between the image field in meta box and acf is that a metabox always save the id of the image in the database in the custom field while acf might save different information of the image i'm not sure but i think it has different settings for the return value which can be in the url or the id but in case of mailbox we we always return the id of the image unless you use our helpful functions let me show you uh here like fields like image if you use image or image advanced the data is returned to you is the the id of the the field so you have to uh no no no no another id when you use our hyper function like uh rwmb meta like this it returns an array of all information for the image and you can use it information to put it on the dvd theme the thing the difference with between mailbox and acf is the format of the data return so it might require some each uh coding to turn the data from the middle box from an array like this into the the needed format that compatible with a dv all right thank you uh for that and ravi is also troubleshooting a problem he had um in your example car site um he said he saw the pricing appearing on the right side for the car when i added custom field the pricing appeared below and is not working in front ends he said i want to know how did the price appear on the right side he says i'm working on a custom post uh displaying the like not not the price but all the custom views it must depend on where you put uh the code to upload it uh emailbox we doesn't force developers or website creators to where to put the custom views we only provide the helper functions like this meta function and all the hardware functions display fuse here and we don't force you to exactly where you need to put the custom views if you see the problem with the position of the price i think you need to check your theme or your code inside your theme to know where it puts uh it is put in your theme okay yeah and that's a that's a matter of working with the theme builder in order to get it to display in the right area yeah okay all right let's see and elon is asking again about relationships and we've talked about how to make relationships between different custom posts um but this the second part to this question is uh cpt wordpress user relationships would that be different uh that is different i can show you right now okay great so uh in mailbox we can create uh relationships between post and between posts and users between posts and terms so we can create a new relationship like this it's like pose you see users and you choose is object post and post type here and there's another side you can choose the user and that's all and publish and when you edit a post uh you can choose i need to uh disable the previous post to user uh and i need to uh to make sure the user meter is okay it's here so you can see connects to uh and select and user so it is the relationship from post to user and when you edit an user you can see it's here connects from relationship post and more relationships here um so uh that's all you can create the relationship between any any types of content with mailbox awesome thanks for that on um pantellas is asking metabox and wpml how is it connected for using it for a multi-language website uh we we are already supported by the wpml team actually the integration between metabox and wml is provided by them and we include it in our free version meter box so you can use uh use use mailbox with wpml without any problem uh with wp ml you can translate the value of custom fields uh or copy it or don't translate it i remember wpml has three options like translate copied or don't translate and you can use all of three options with mailbox custom fields fantastic all right uh erdahl is asking is metabox compatible with wp multi-site do i need to activate it on each subsite uh yes one of the best thing with mailbox is is compatible with wp multi-site uh uh there are two things here uh the first is uh the other extensions like the free version of mailbox and other extensions uh like uh user meter terminator relationships uh all of these extensions are work uh independently between size in a multi-site like you can activate it uh network activated and it is and they are all available in on the sub sites and another thing here is that the extension that i'm going to show you here the settings page is session we read setting space raising premium settings here the setting space extension can help you to create a setting space for the whole multi site for example for example you build here here is how we introduce it for example if you use uh the setting space to create a custom settings for the whole network uh like uh the contact information that will be put in the footer of all the sub size or the credit that you put in the footer so you can create just one settings page and put it in the network uh like the network and admin panel like you can see in the screenshot here this custom options is available in the network manage management page and all the sub sites can access to these settings and get it and output it on the front end so uh in short megabloks works really well with multisites fantastic um and and uh erdahl likes the sound of that he said that sounds awesome so great to hear um peter is asking i would like to see how to change a value in field a based on a change in field b for example if delivery date is not blank then delivered is set to yes and i believe you showed this off a bit when you were walking through changing up products in suppliers in woocommerce no it's not that it's something different perfect well then take it away yeah uh if you want to show a field based on the value of another field that is what i did but if you want to to change a value of another field based on another field value i think you can do that either with javascript and php in metabox we don't have any a native way to do that at the moment but we have a lot of hooks that you can use to to update the value of another field when you submit the form okay alrighty let's see here paul is asking can you can you use custom fields added by other plugins for example a woocommerce plugin adds gtin field to product meta can metabox use those fields in metabox views or elsewhere uh the answer is is yes in ninety percent uh and maybe ten percent now to make sure if to make sure the custom fields can be used in that plugin can be used in mailbox is that if the data is compatible between that plugin and mailbox and to understand how metabox save value in the database please please see that here the database in in our documentation but for the basic fields like textview gtin here i think you can use it without any problem uh you can use it in all of the mailboxes and and all the mb views and in all the extensions uh you should care only for the complicated fields like maybe a gallery or maybe a repeater reconnect groups in mailbox and that's it all right let's see here um peter again is asking let's say we create the example you did with the car dealership field is there a way to save all of the fields and settings such that we can simply reproduce and load those onto another different site or do we have to manually enter all the metabox changes on the new site uh you mean the fuse or you mean the the value of the fuse uh if you means uh wait if you mean the fields so you can just go to the custom fields here and you have option to export them or you can choose all the custom fields groups and choose the export and then on another side you can import all the settings like all the custom fields here but if you are talking about the values of the custom views that you saved like like like the value here like the actual value uh the best thing is use an import and import import and export uh a plugin from the wp from wwwpr.org there are many many plugins that can help you to do that all right great uh leslie is asking is there an easy way to uh sorry an easy process to output the custom fields through gutenberg blocks uh we are working on uh an extension to do that uh at the moment we don't have a native way like the easy way to do that uh you can use the empty views to you can use the shortcut to output in inside the gutenberg blocks or let me show you the shortcode you can use this shortcut to boot into a new chamber block or you can use our extension with the mb blocks to be custom blocks for gutenberg and and you pull all the data from the custom fields but if you need like to put a custom views from each box into the native like the core youtube blogs then it is not supported yet and we are working on on that solution and hopefully to release it soon okay anonymous attendee is asking using the banner image concept is there a way to set a checkbox field to toggle on off a banner or image uh yes it is possible uh the thing here is if what do you want to do uh where do you want to do like on the backhand or on the front end if you want on the backhand so you can just uh so just just do what i just did here like yes now show you here but if you want to do on the front end let me show you reviews one thing that i you might want to remember that views can you tweet there is a link to click here twig is a very powerful template system that you can use to output something like if else the conditions let me show you how to do that like here if for example we have availability the value we can put something like uh if post availability value equal to yes then i'll put something here like i'll put an image here or put i'll put a group here like an image like this else we can use something like images so um so if you use tweak you can use the if errors condition the four controls and all the information like everything uh you can write similar to php you can write it here awesome that uh i believe answers exactly what his question was because he wanted to show in his example three check box fields coke pepsi water and on the front end it shows the logos that's the value so i believe that's exactly what you've just shown here um erdahl is asking is there a way to export the settings and meta boxes so i can create them once and apply it on uh to another website easily uh yes uh that's what i just showed you okay i thought that might have been the same yeah yeah so we don't need to walk through it again um all right so ravi is asking how can i add tool tip next to text maybe inside a list or heading or anywhere so that in front end the users can read its functionality for example what you have done on many places uh we already have the toontip extension let me show you two tips extension and all you need is that extension that you can uh use to display toon tips for fuse and inside the wordpress and the metal box i mean you need to enable anybody made a box tune tip and when you create a view for example you can have toontip here like this option just stick it and choose icon uh the icon can be in for help or dash icon or any url by default is is uh the help icon you can leave it blank position at top and content like uh like see if the product is available in the stock okay so update um and now go to edit a product and you will see it in action [Music] oh oh i need to start okay and you see it works here but the icon is is invisible maybe from the color change in the wordpress i mean i need to check it okay now that makes sense though okay um excellent luis is asking another um integration question do you plan to have integration with squirrely seo it was this is a recent appsumo tool are you familiar with them i i heard about that but actually i don't really understand what you need uh for the integration between metabox and scrolling seo yeah so maybe luis you can kind of clarify what you would like to see there um so that uh on can think about putting that on the roadmap um so just drop that in chat for us and we can get back to that um kuntawat is asking can we use metabox and meta table to optimize woocommerce database structure my objective is to reduce database row in long run i'm afraid that we can't do anything with woocommerce the problem here is not uh is not not the possibility so we absolutely can do that uh but the code base of woocommerce doesn't work with our new database structure so when we change the database structure uh all of the code of woocommerce windbreak and our our website will break that is exactly the reason that i created uh the my own e-commerce solution that i showed you previously all the custom views settings for products uh we use custom table for for that uh so um the short answer is no yeah okay now that definitely makes sense um and by the way just to give you some feedback here on david das is saying really looking forward to playing with metabox looks like a really powerful tool so you're showing off metabox wonderfully here showing how powerful it is and and uh you know our plus members are loving it um let's get back to ian he's saying if you have a staff directory is there a way to display one single staff member's profile and image in a block or sidebar can you use short code for that okay i can show you a website that i've used for our company internally so you can see a an example of the dried directory of the staff so this is here uh sorry it's only in vietnamese but you can see it is the edit profile so this is my profile so all the stuff on the employees in our company has the same profile and when they submit them it goes to into this list got it so uh this is a very basic uh thing that we did for our company but you can extend this functionality uh to display uh the stuff in other style if you want like a listing page like we show for the campus here similarly like this like if you want to show images uh the name title something like this you can absolutely do that uh and the way we build this table is with views i can show you views so you just set a query get all the users and display the table and look through the all the users and and show the user information and that's all awesome ian let us know if you have any follow-on questions there there is quite a few questions about future integrations and you know what's coming is there a road map that we can direct people to so they have an idea of what's coming down the pipe uh yes we have a roadmap uh like yeah this is on shallow way to make box public program here okay uh i i'm going to share with you uh in the chat okay and is there any way that plus members can make uh requests for future integrations uh yes uh please send a facebook here we will put a link to our help desk and send us the feedback and when you ask about the inspiration uh please add more details about what you expect from the integration because we saw a lot of questions about integration but we actually don't know what needs to be done and even when we talk with the author of that plugin not made about not our plugin but that plugin uh and we both confused about the integration and i really don't know what to do got it okay now that uh yeah but thanks for sharing that that way um they can always make those suggestions and be super clear and on that note louise had asked about you know squirrelly seo and we asked him to clarify and he's saying uh similar to the yoast seo integration that metabox currently has so just to give you some more feedback on that okay so uh if similar to us seo that we did before which is the the content analysis uh we use seo has the content analysis and we add the ability to make it pick the content of custom fields to analyze so if sql seo has the same feature for content analysis then we can consider about the integration alrighty munich is offering also a suggestion he's saying he would love to see more detailed tutorials about how to use metabox with woocommerce he was just noticing a trend on the on the webinar here that there was quite a few questions about woocommerce so just saying if in the future think about making more tutorials around woocommerce would be helpful uh yes that's will be great thank you very much yeah um paul king is asking are the mb metabox custom fields available through the wordpress api to export import and update data yes all the mailbox custom views are already all available available through the wordpress api they are just normal custom views like you do with the normal way to add custom view to wordpress and you can export import and do anything with the data easily and if you use our uh rest api and all the custom views are available in the rest response also okay okay so catalin is asking could on show us how to export the php code to then be packaged in a custom theme please oh yeah oh okay okay so uh um okay let's create a custom fields group first like group extra fuse okay so uh when you put on these things and you get the code just generate it and copy and now go to theme editor okay i understand and put it in your ops i'm using a blank theme that doesn't have a function files okay let me do that stream blank blank thing okay so i do five functions a php oh by the way we can't see your screen right now oh sorry sorry let me try it here okay oh let me share the desktop so you see all the screens okay you can see it now yeah i can see it now okay so um you go to the the custom fields group and get the php code generate it copy and paste into your theme functions file and after that you can deactivate uh deactivate the plugin or remove like let me remove it you can deactivate the plugins also and on the the fields and the data is still available in the backend and also in the front end um but one thing you need to remember that you have to keep uh to keep the the metabox plugin activate activated and maybe uh some other extensions need to be activated as well like a user meter or thermita if you use the if you created custom views for users or for terms so you is required or these extensions to to make the custom fields work to make this code work so in short the code that you copied here is only used for registration for the fuse for the mailboxes and you need the extension behind the scene to make it work i hope that answers your answer questions yeah okay so we are coming to an end here anna's done a fantastic job in uh you know presenting metabox here i want to follow up with a couple last questions here but if you do have any questions you want to get in in the final minutes here please just post them now um let's see here i i wanted to save some of these integration questions till the end because there was a few but um gerard is asking is there any integration coming for piotnet forms uh we don't have an integration with binary form yet but i can talk with the pioneer father which is all also a vietnamese and okay we we talked uh once before and hopefully we can we can push the integration between the two plugins yeah great so marcelo is asking about uh stackable page builder does medic box integrate with stackable page builders uh i think the stack cable page builder is for gig chamber so it's best for us to build the integration with you chamber first and then when it is ready i think it will be available for all the the guild chamber solutions like stack cable cadence uh generate press blocks and all the similar solutions okay and then i'm seeing a question that came in through chat that i i believe i missed it says when you have a custom this is from renee when you have a custom table solution is it necessary to do something extra to query the data or is it done automatically by metabox is custom table solution compatible with subfield and clonable fields how is the data stored can views be paginable a lot of questions here uh with custom table all the extensions on the settings all the field types are available and are compatible with it uh with the let me show you that the the where is the okay the extension custom table and about the query uh if you use our helper function we're getting the field value with the the helper function and you don't have to worry about the query they should query and yes of course it has to create a hr queries to get the data from the custom tables but the extra query is very minimal most case is only one query which is very quick and we also has a cache layer uh between the data between the custom table and the code so if you call the the helper function multiple times uh for getting multiple custom fields from one post you generate only one extra query which is very performant excellent okay thank you for that um yeah a lot of thank you's coming in on mark said that it was a great presentation yeah let's go ahead and give on a round of applause uh you know this is never easy to answer non-stop questions for an 100 minutes straight so you know excellent work on i really appreciate uh the time that you've taken and the detailed explanations you've given um there will be a recording going out tomorrow in the email all the links that we've mentioned uh here will be included there um and with that i believe we will sign off i just want to say thank you again on okay thank you very much luke and thank you everyone for joining the webinar yeah alrighty bye now

Channel: Meta Box

Views: 1,118

Keywords:

Id: tQte-CbpgzI

Length: 105min 16sec (6316 seconds)

Published: Thu May 27 2021