Σ Sigma Hosting is mainly a video tutorial website

Σ Sigma Hosting is mainly a video tutorial website that make it easier for you to search within the transcript of videos for solutions of problems you might face during your journey in dealing with different webhosting companies. So, we are very sorry if the text is not well organized and we may work on it in the future but for now we hope you get the benefit mainly from the video then you may need to have a look on the transcript. Thanks for your understanding 🙂

what is up guys we are back with you know who your favorite youtuber a computer MD of Gilbert in the house guys I'm excited to be back I apologize you haven't seen a video in about a week and a half two weeks I have been studying for finals because you know what finals is a true tough thing in college especially freshman year first semester and also I came back home for winter breaks and I'm home recording in my original studio here at Mikasa so today I'm gonna be showing you guys a much awaited video most of you have asked us about 10 times over and you know what I appreciate that and I'm gonna show you how to add profile pages using Wix code here into your which website because before we hop into that I want to preface this video by saying listen I know that I'm gonna show you this video and you guys are still gonna have a ton of questions so if you guys are interested in one hiring me out you know to build this process out for you you can do that email me at computer MD of Gilbert at gmail.com and I'd be more than happy to help you out with that too if you have more questions you can you know book a paid call and talk with myself or one of the experts on my team to help you through your process it's a nice little 30-minute call that you can book and really get a lot of value from and then to well we actually already hit two so now Rob 3 which is just using the videos here as your support system and I'm going to teach you as best as possible so why don't we take the time hop into the video and let's get started so first things first to access your wish code developer tools you need to go up here to tools and click developer tools the Wix code platform as you can see is now available to the entire public can you believe it if you can't neither can i it's been in beta for about six seven months and now it's out to you guys so let's enjoy it so the first thing we have to do is we have to create a database to do that we go here to this little plus button will then click new collection and then will press start creating we have to then name the database so the reason we need a database guys is because you need to collect your users information in order to create a profile page that profile page has to pull that information from somewhere that somewhere is your database so what we're gonna do is we're just gonna name this profile info what does this database in collection for we are going to use it as site content anyone can view the data from this collection but actually you know what it says right here general permissions form submission so anyone could submit data to this collection so if you're gonna allow anyone to submit data to your collection that means anyone that comes onto your website can access our user info form that I will show you how to create and submit information you would click form submission you see a couple of the other options are member generated content members only content and members only form submission so this means members can only access these forms and this information and submit to that and then the other ones are private data and custom use so for this case we are going to do form submission anyone can submit data to this collection you can also see here site content means anyone can view it so we'll click that and we'll press create collection when we do that we are then loaded into the back-end sandbox database here in the Wix this is not the live database no changes on this do not take effect on the live database you can once we add stuff sync your database to your live database but for right now we're not gonna do that we're gonna go in and add the fields so this title field right here is default this cannot be deleted this cannot be changed this is on all databases when you start off it really doesn't mean much and you don't have to use it because you'll see why we sync the fields we want to use with our input form but we actually have to go ahead and then create the fields we're going to use to collect the information so all the fields you create here in your database will be all the fields we'll be displayed on your profile page such as name profile picture description social media stuff like that and I'm gonna show you now how to add that information so the first thing we're gonna I'm gonna submit here or add is a field we're gonna name it first name and then our field type you can see we have a lot of different options here but it's just gonna be text we just want their first name to be text and then we will click Add ok perfect we've got our first name we should probably have last name if it's a profile page so we'll put last name and then your field key this is for JavaScript code and this tells JavaScript where to put what make sure you do not duplicate these because if you do JavaScript will get confused and it will send you into a atmosphere that you've never been to because it hasn't been discovered there's no such thing so make sure you make so make sure that you do not duplicate these field names and then this is also text so we'll click Add now let's say we want them to add a profile picture now guys I'm showing you the bare-bones version of this and you can add as many fields as you want but I'm just gonna show you pretty much how to add the correct fields and where to add them and how to make it all functional you go ahead and add or remove as many fields as you want so now we have a profile picture but the field type of this one would be an image because they're uploading a picture this is important to make sure you get your field type right so the database knows how to read it you would then click Add and then we're gonna add some rich text so we want a description about them so we'll call it about me and it's gonna be rich text because rich Texas and enables us to style the type of text we want to display in our dynamic page now we'll get into dynamic pages in a second guys but for right now let's stay on track and keep you focused here well then click that rich text and click Add all right we're rockin and rollin we've got our database setup again you guys customize this and add as many fields as you want right now this is what I'm gonna use to show you now that we have our database linked up we are then going to have to create a custom user input form alright guys so obviously as I said um in order for you to actually add information into the database you need a form to collect it so what we're gonna do is we're gonna leave the database now and go to a page this page can be one you either already created or you need to create so what I'm gonna do is I'm just simply gonna go here to portfolio and what we're going to do is add a page and this page will collect our information this will be the page we put our custom user input for month so to start adding the fields what you have to do is you need to go to add and then you'll see user input right here now all of your text user input fields are right here radio buttons here drop down here checkboxes here text boxes here upload buttons here date pickers here tables here and that's about it felt very cool saying all those different form names felt right really flowed off the tongue anyway guys so to actually start adding them we know that we need to collect first name and last name so let's start right here with these form fields we'll add this one and then we'll change the settings right here and we don't want this to be a phone number we want the type to be text they're gonna be inputting their name so it'll be text and then the placeholder text we don't want what's your number we want first name and then obviously you need to determine if this is a required field the answer is you should have it required because otherwise you're gonna start getting profile pages with some wonky names so we don't want that after that to make it easier on ourselves for last name you could come up here and just press control C or command C and then control V or command V depending on if you're on a Mac or PC line the fields up set input type again text and change it to last name keeper acquired bada bing bada boom perfect so now we have our first name last name fields here now we need to have them upload a profile picture so we'll go back into add we'll go to user input and we'll click on one of these upload buttons I like this one so we'll change this right here and then you could add some different text click your settings make sure the supported file type is image and not document although you can have people upload documents as well just something to note and then you can change the button text right here to upload profile picture and then you can show the text download you can choose what this placeholder text is and we want it required they have to have a profile picture so you then press required field BAM done alright we got that and then we have our rich text which is our description now someone's writing a description about themselves it's usually gonna be a little bigger than this little short text field right here so we're gonna go back into add we're gonna go to user input and we're going to go up here to our text boxes let's just follow our same design here same coloring and then BAM let's in just right here and look at that it already says describe yourself in 50 words or less well we maybe don't want it to say 50 words or less so let's just say describe yourself here change that and then you can scroll and you can see that this is a text box so it's a text field and we do want this required because we want other people to know about these different fields and we want them to know about these different profiles apologize for the phone there so now that you have these fields inputted you have your custom input form and that's perfect but now you have to connect those fields to the database to do that you're going to go up here to add and you're gonna go to database and click when you click data set this little data set button is visible I'm the editor but as soon as you publish the website no one can see this so you can technically put this anywhere on this page and no one would ever know it's there you then need to click manage data set and you need to connect it to the collection we're adding so profile name that's the database that's going into and then you can name your data set here a lot of times it's easier just to name your data set keep a preset as they have it and then your mode you want it to write only because if you have it read only that means people can't actually submit information write only means that people can only submit information so you want people to be able to submit that you would click write only and then you're set up right there with the data set on your page now to connect your user input fields what you have to do is you'll click the field you want and then you'll see these like little yeah I don't know what they little circles and it says connect to data you would then click that and then since we uploaded our data set on the page it defaults and knows that it's going into that data set and then the value it connects to is whatever value that is in your database so first name would connect to first name in the database and then you could see it turns green as soon as it's successfully connected last name would connect to last name in the database turns green when it's successfully added connected profile picture would connect to profile picture image you could also see based off of the type of input it is it knows what fields collect what in the database so then we would press BAM and it's connected and then text box connect to data and then we would dim and I'm sorry that was rich text so what you need to do is go back into profile info and then I realized we add the about me as rich text we don't want that we want to get rid of that and we want to add about me oh yeah we already used about me remember the JavaScript as text so then we add it as text right there perfect we got that let's go back to our new page here and then your about me same thing you connect it to database and you would connect it to the about me so the text box is not actually considered the rich text so you need it set as text that was a mistake on my part but then we come in here connect to data BAM it's connected so this now means that our user input form is connected and ready to go so now we have our database in our collection form ready now the only thing we have to create is our profile page the design so we're just gonna click Save just so we have it we'll click and save as my site 1 make sure you save all of your work usually after each section you do just ensure that it gets saved properly so now that we have our form we have our database we need to create something called a dynamic page so what we do is we come down here click add page and then click dynamic page and then you click start creating now it says right here choose the database collection to connect this dynamic page to so obviously we want this dynamic page to connect to our profile info so it pulls the information from the profile info database and then you have an option here it can either be a category page or an item page since it's an individual profile page we're creating we want it to be an item page a category page would be like a page for recipes events product catalog tour catalog stuff like that we would then click Next and then this is pretty cool so each dynamic page gets a custom URL so you can choose what field it connects to in this case we have no field that connects to title so what we want to do is we want to get rid of the title field and we want it to be their first name so then it'll be WWE whatever your website is slash whatever your database name is slash first name and it'll be their first name inserted there as it is smart and connects field so that's a pretty cool feature we then press create page once we create this page you'll see our dynamic data set is automatically added and now this is the page we have to use to design the rest of our pages here so what that means is this will be like our sample page our our example page so what you need to do is you need to create exactly how you want your profile pages to look because now after this all of your dynamic pages will be modeled from this page so let's just come here let's add let's add an image and again it's just got to be a placeholder image right now oh look at this good looking man it looks like me so we'll add our profile image here again you set it up however you want and then let's just say we want our first-name lastname they need to be two separate fields our text fields being that they're two separate fields in the database so we'll call this one first-name I'll type it in right here first name and then I'll just copy it again ctrl C or command C and control V or command V and then we'll call it lastname and then we need to add what it was it guys BAM we need to add our about me you then click your paragraph usually paragraphs are good for the about me and you put that text wherever you want now guys I'm not styling this page in any aspect so this is not a good design at all I'm just giving you an example so now that you have these pages connected are these a well does dynamic page style the way you want you need to connect it again to your data set so that way the dynamic page knows where to pull the data you then come here click profile info and then image source connects to profile picture BAM you're set right there then your first name connects to let's scroll up first name bingo last name connects to last name and then finally your about me connects to about me now that you've got that set up we can press save and we can go ahead and go through the process so I'll go over here to this new page and let's just pretend we're someone new coming in here so my first name is Michael last name stroke upload profile picture it'll pull straight from your computer where where can we get a picture here alright let's use this one we got a picture there and I am pretty awesome sometimes yeah all the time just a little description there and then guys let me show you something I wanted to go through this process to show you this you'll notice what am I missing if you guessed a submit by and you would be correct so what you need to do is go back to the editor and what you must do is add a submit button to do that you come up here simply go to button you could add any type of button you want let's just click this one right here add it style it to your choice and you need to go here to connect to data and then ylabel connects to you don't need one but link connects to submit you want this to submit to your database and then you can add a success and failure message if you choose and then it says right here when successful navigate to what and you could actually choose what happens after your form is submitted you can add a link and you can add that link to be anywhere you want on your page let's just say it links back to portfolio so then once we submit our form it's submitted to the database and then we're taking back to the portfolio page let's click Save and then let's go back up here to preview so now let's give this another shot my name is Michael last name is stroke I'm going to upload my profile picture here I'm gonna say I am pretty awesome ooh ooh sometimes yeah all the time bingo and then we're gonna click Submit obviously name your button submit and then you can see BAM it is then submitted now if we go to our database we should see my information it's submitted right there dynamic page is right here and now what should happen is we should have our dynamic page synced with the profile page so that's that's how you sync it right there so you can see it's added into your database so now your information is here and then your dynamic pages here if you go here you can see that you're all linked up and that it'll link the information correctly right there and again just double check to make sure everything is good to go but you submit the form it's then submitted to the database and then it will be used for your profile info so if we went to let's just show you here if we went bingo if you go preview here's the dynamic page you can see my information is then submitted right here obviously again you have to style it how you want but this is this is what it would look like right here and then for every new piece of database info for every new profile who'd create a custom page for that person and it's that easy it's that simple and just like that you went ahead and you created a profile page for all of your new members guys if this video helped you out please drop me a like down below comment if you have any questions at all I am here to help and don't forget to subscribe to me here on computer MD of Gilbert other than that if you are interested in hiring my team to help you out and help you design this whole process I know it looks a little cut and dry here which it is but it does take some time to really get it thoroughly designed correctly and working properly feel free to email me at computer MD of Gilbert at gmail.com that's in the description below head over to Wix my website comm and get on our weekly witch tips email list because they're helping people out each week and we threw out some value bombs and those email lists so go ahead and sign up for that other than that I hope you have an excellent rest of your day and have a good one on me .

Video Discription

Weekly Wix Tips-
Hire Me? –
Wix Course-
————————
Creating user profile pages in Wix has been made possible and fairly simple using the new Wix Code platform. Wix Code is not only changing web design as we know it for Wix, but also for the industry. This powerful tool is now enabiling so many new possibilities on the Wix platform. Once of which is the new ability to create user profile pages through databases, custom user input forms and dynamic pages. Even cooler, each dynamic profile page gets its own unique URL. Wix Code is changing the game.
—————————————————————————-
Wix Code Beta Page-
—————————————————————————
Wix Certified Trainer-
——————————————————————————–
Topics Covered:
-Weekly Wix Tips Email List
-Wix My Website New Design
-Creating Profile Pages in Wix using Wix Code
-Using Wix Code
-Signing Up For Weekly Wix Tips and Forum
——————————————————–
Stay Connected:

Email: computermdofgilbert@gmail.com
Twitter:
Subscribe: ComputerMDofGilbert
————————————————
Wix My Website Series:
This Wix series will have multiple Wix tutorials uploaded EVERY WEEK of 2017! Email me for any Wix troubles you may have.
——————————————–

 

Leave a Reply