Improve contact management database for building services

How to create outlook signature

welcome to caspio in this video I would like to show you how to build a basic contact management application from scratch so that you can manage and keep track of all of your contacts from within your caspio application so first let me show you what we're going to be building today here we have a website and on this page we have a contact us form that was built in caspio and we have it deployed and embedded in this part of the web page the idea is to collect information from your website visitors and upon submission you can log inside your caspio built application through the caspio login screen and as soon as you log in you're going to be able to retrieve that data using a caspio report when you click search you can see all of the results directly from your website you can drill down to details to look at additional information you can also make updates you can delete this record or depending on the application that you build inside your caspo account there is more options for you available as far as functionality we also have an internal form that's built and this is also passord protected here we can add new records to our table so if we don't collect information from our contact us form that's on our website internally if we're on the phone or we get an email we can add them to the system through this internal form now let's go ahead and go into our caspo account and take a look and see how this application was built from scratch when inside your account you'll be taken to your dashboard and here you're already going to see a sample contact management app that's already uh by default it's already inside your account and you can explore it to see all the objects and how it was built uh we're going to go ahead and recreate this application from scratch today so I'm going to go ahead and click on new app we do have the option to import data so if you have data in Excel or access database you can upload it or you can click on this button to start from scratch let's call our application um contact management app and as soon as you click finish you'll be able to see that application added to your dashboard let's go and click on open and this takes me to uh to the overview page here we can add notes images and just keep track of the overall progress so this is mostly informational on the left side you'll see the control panel and these tabs is what we're going to be using to build our application this these are all the various objects inside caspio that we need to use in order to build our app and the first place that you want to start is the tables and when inside tables we can click on new table to build a table from scratch or if you have existing data you can click on tools import and bring your data in from either Excel or access database so let's click on new table and the first table that I'm going to build is our Conta table this is where all the information regarding the contact is going to be stored so let's add all of our fields to our table and we're going to need a few Fields here and I'll explain uh in a little bit as far as what changes I'm making to each field as I go along is for so once you've added all of your fields for contact ID we're going to have to make this an auto number so we can see a sequential order of numbers and uh once the contacts are coming in so we can relate this table later on if we need to date submitted from this drop down here we're going to select that to be a date and time data type down below we have the comment section section for users to submit comments directly from the contact us form so if you recall here is my comment section and I'd like to make that a tech 64,000 so they can type in more characters follow update for internal or for the office user to be able to uh follow up on an inquiry and internal notes we have the tech 64,000 enabled for this as well so we can leave notes internally for this specific inquiry once you've added all of your fields to your contacts table you can go and click on Save and let's call it contacts and for this application we're going to also create another table for our users or authenticated table for the users to log into their account so let's add all of our fields and for this table we're going to add let's add user ID we have four fields for this table we have the user ID which also needs to be an auto number that's how each user is going to be identified we have the name of the user email which needs to be unique and the reason why is because we can't have the same username twice per password it's going to be a different email address for our users to log in with and password is going to be encrypted with a smart type field so you see an asri inside a table uh once you open it in the data sheet view and once you're done um inputting all of your fields for the user table go ahead and click on Save and let's call this users table and right from the side of tables we can go ahead and click on open for both of these so if you do that you'll see a blank table because we currently don't have any records stored inside a table it's a blank table and same thing for the other table as well and let's go ahead and add our first user for example John Smith test.com can be his email and password can be John S and as soon as you click on a second row you'll see that Auto number populated is number one if I add one more April Smith and let's have her password be April s you'll see user ID number two and this is how the auton number function Works inside caspio tables if you wanted to add additional fields to your table or modify these fields you can click on table design and directly from here you can modify each one of your Fields uh once you're done inputting all of your tables and creating them you can go ahead and skip now to data pages to start building your application when you go back to data Pages uh you're going to click on new data page and on the left hand side we have another control panel here this allows us to build U forms on under this section here we can build different report types we can build calendars charts to display data or plot data numerical data on the chart and if you're a bit more technical you can build a straight HTML page uh gives you more flexibility and functionality inside your caspo account so for us let's build a contact us form this one here this is the first thing we'll build we'll select submission form click next and on the very first drop down this is how you're going to link your table to your data page and for this form we need to contact us form because that's where all my fields are and here you can name the data page anything you want this is for your own eyes here you can select a different style this is for the Aesthetics the look and feel of your form these are some pre-loaded styles that we have inside our account by default or later on you can go to the Styles Tab and fully configure your own look and feel to match the look and feel of your own website for us let's go maybe with a sample style we're going to leave this blank for now I'm going to discuss this later on in the video on this screen we can choose which fields we would like to use in our web form so I think I'm going to need to have um all of my Fields except for the followup date and internal notes those are going to be for internal users so these are all my Fields we're going to go ahead and click next and when you get to this screen configure properties this is more or less your main screen um you're going to see all of your fields on the left hand side and you're going to be able to make modifications on the right so dates submitted we have a text field but for this I'm going to make this a timestamp so it's a hidden field the user is not going to be able to see it but in your table later on you're going to be able to see that date and time of the submission then we have first name uh we can make this field required which means they have to fill that in before they can submit the form and then just go down the list and modify all of your other fields um and then last but not least we have the comments field instead of text field why don't we make this a text area that way they can actually see a box of what they're typing uh keep in mind you also have other options for radio buttons check boxes dropdowns list boxes so there's a lot of functionality that you can put inside your web form for now let's go to a text area and here you can customize the width and height ingly for contact preference why don't we actually change this into a radio button and for the first option let's say phone can be one radio button click on new second one can be email and last one here can be we can say no preference once you're done making changes to all of your Fields go ahead and click on finish to save changes and here is our first data page that we built you can preview this now to see what the form looks like and uh if you're happy with the look and feel of the form and as you can see it looks very similar to the form that we have on our page we just have to make a few more modifications but if you're happy with the design and how the form looks looks like you can go ahead and click on the deploy button now right next to preview you can enable access to this form and caspio will provide you with this embed code that you can copy and you can paste that code into your HTML script into your CM CMS um caspio is compatible with a lot of tools out there if you're using GoDaddy or Yola or Weebly it is compatible so just go ahead and drop that code into your HTML and publish that web page and then you're going to be able to see that form seamlessly embed into that part of the website now that we have our form built why don't we go ahead and build a report that's going to show us all of these submissions and for that we're going to click on new data page now and instead of a submission form now we're going to go ahead and build a report and the most popular one is the tabular format which shows you your rows and records and columns you also have the option for gallery list view directed details or a combination of chart and results so let's go with the tabular format we're going to click next and again same as the form we're going to link our report to our contacts table because that's where all the information is going to be and let's go at the same style sample click next let's have a search form the ability to search our data so if you remember from our website right we're going to have this search form for a report so let's click next and let's include the company name and first and last name to be able to search our results so again I'm going to go back to our website to show you what what it looks like here's the company name first name and last name there are my three Fields I'm going to click next and here we're going to modify each one of my fields on the left hand side so we have the company name it's going to be a text field had I made this a dropdown for example this first field would have been a drop down instead of a text field and uh the same thing here we have the comparison type uh set to equal under company name I'm actually going to make this to be contains and the difference is if you leave it as equal that means I have to know the exact company name before I can pull up that result but if you leave it as contains you only need to know partial key keywords and just to speed up the demo let's go ahead and make everything else contains and click next on the results page so what's the results page let me go ahead and click search on our website and here are all the fields that I'm displaying on my results page we have the date first name last name company title phone number and email well let's do the same thing here in our application so we're going to include the date submitted we had the first name last name we had the company and let's see what else do we have company first name title phone and email so title phone and email now you could choose to display department and additional Fields if you'd like that's up to you I'm going to leave these fields click next I'm not going to make any changes to my results page actually let's take a look at our website we have the email field or the column which is clickable so we are rendering this value as an email so let's go ahead and back to our account and under email field right now it's rendering as a text let's render that as an email link that way the email is going to be clickable and here by default you can um actually prepopulate the subject field if you'd like that way you don't have to manually put it in once your email opens up uh we're listing 25 records per page let's see how many we have on this website we have 25 records that's correct so let's leave it as 25 we also have the ability to delete records so what I'm going to do is I'm going to enable that function inside our account to delete let's click next uh yes let's enable a Details page if you choose to disable a Details page then this link here is not going to be clickable it's going to be disabled in our column so let's enable it and in our Details page we're going to include all of the fields and notice that in the details page when you uh hover over each one of these fields it's going to be display only by default and what that means inside a Details page notice that our fields are editable but had you left it as display only it would have been just like this where you don't have the ability to edit that record okay so let's go ahead and make a few changes here so the contact ID is going to be display only date submitted was left as display only and then for first name instead of display only let's let uh have that be a text field same thing for last name and then you can go down to list and make changes to your own Fields depending on how you wish to modify your application down below we have uh just a couple of things here that I'd like to show you the followup let's change the label here inside the this field to follow updates and let's have that be a text field and notice the Casp gives you ability to have a little calendar popup it's going to be a small icon next to that field and underneath followup for internal notes instead of display only i' like to be have this be a text area so I can type in more information regarding this contact if I'd like click finish and close so here's our second data page that we built uh we can go ahead and preview this now and again it looks very similar to our already built application let me go back to the search form and notice that there are my search Fields it looks exactly like the preview if I click search notice that we don't have any data because our table is empty however if I preview my form let's say this form is already deployed on my website and if we make one submission and these fields notice these fields are not required so we don't have to go through the entire form to fill it out just put a random phone number and then we'll say Ash test.com for email preferences phone company Yahoo and no additional comments click submit and as soon as that submission goes through you can get notified via email to let you know as the owner and now let's go ahead and search again and now you're going to be able to see that one record inside your uh application because now that record is inside our table and we're able to pull it up from the contacts table we can also go to details and and notice that we made a few of these fields editable the rest of them are display only and down below we can set a follow update when I'd like to follow up with Ashley and internal notes caller back on the 22nd click update and now that update is made for that particular record let's see what else are we missing on this application so there was one more thing that we needed to build which is the internal contact form and here it is okay so it's basically a recreation of our um public form that we have the contact form so instead of us clicking on new data page to recreate the form why don't we go ahead and just click on more under the contact form and click on the copy link and let's call this contact form internal contact form and click save okay and once you make that change we just need to make a few more modifications to the form let's go ahead and click on edit click next next and notice that I don't have to input all of these fields again because we already did that in the previous form the only change that I need to make on this form is to add my two additional fields to the form and down below let's just make a quick change to the label file update and internal notes we're going to make this to be a text area click finish and close and let now let's go ahead and preview this form and there is my uh add a new contact form that's uh built uh we probably could have removed the comment section because we don't need to put that in or you can leave it if you'd like let's go back to our account now and notice that each one of my data pages is still public facing which means there's no password protection if we look at our example we have a log out link here and that this data page actually is a login screen on top of it including the internal form okay so we still have to have one more functionality inside our account to be able to add this login screen on top of the data pages to password protected let's go back to our account and uh the next step here is to create an authentication for our users let's go and click on this link let's add a new authentication and what we're going to do here is we're going to select our table that contains our credentials which is the user table we have the option to do the Express login which is a little bit easier or you can do custom if you wanted more options available as far as uh adding more functionality to the login screen uh here we have the ability to use the caspio data source which is recommended or you can use ID Services if you wish to have users log in through Facebook Twitter or Google let's go with the caspio data source recommended for email notice that the username label is the label let's change that to email and then we also have password here and that's going to be the label for our password and when you're done go ahead and click on create at the bottom let's call this user authentication click finish oh we already have the same name so let's go ahead and uh call it user login okay so there's my user login authentication and the last step that's left in our application is to apply this authentication to our data pages so let's go back to data pages and the two data pages that need to be pass protected are a report and also our internal contact form so let's go ahead and apply the authentication to this form let's click next and if you recall from earlier in the video I had left this uh area blank now I'm actually going to apply this authentication to our form so we have to enable this checkbox for restrict access and we're going to go ahead and apply the user login authentication that we just built to our submission form click finish and if you preview the data page again you'll notice that now it requires a login screen for us to log in and be able to enter that value or those values same thing for the report let's go ahead and edit and on this screen we need to enable a checkbox and apply the authentication to this data page and we're not going to apply to this one because this data page is public facing and I and we want our users to be able to submit the contact form directly from our website once you preview the report you'll notice that this report now requires a login screen as well before we can look at all the inquiries once you have configured and built your entire application and you apply the authentication the last step that's left is to finally deploy the application to our website and you'll have to deploy all three of these data pages to your landing pages and your application will be up and running and you'll be able to receive messages and you'll be able to manage those messages inside your account thank you for watching and I hope you enjoy the video