Convert Excel to Web Apps

Go to your list of DataPages and begin by deploying all the interfaces for your Reps.

DEPLOYMENT 1: mysales.html

Hover your cursor on the My Sales DataPage and follow the steps below:

• Click Deploy.

• On the resulting pop-up window, click Enabled to change Deployment Status.

• Make sure that the deployment method selected is Embed.

• Copy the Caspio generated deploy code.

  

• Paste the code on your designated HTML file (mysales.html for this DataPage).

• Save your HTML file.

• Refresh the page on your website.

Use your sample account for Max (Username: max@rep.com, Password: maxw) to view the fully functional interface fitted nicely on the template screen.

DEPLOYMENT 2: new_sale.html

To deploy your next DataPage, go back to your list of DataPages in the Caspio App and follow the same procedure. Only this time, embed your deploy code on the HTML file that should contain the Add New Sale web form (new_sale.html).

Again, upon refreshing the webpage, you’ll see how the form is seamlessly embedded.

DEPLOYMENT 3: Company Sales

The last DataPage you’ll be deploying as part of your sales rep portal is Company Sales. You should already be familiar with the pattern at this point so go ahead and embed the deploy code onto your third HTML file (company_sales.html).

Your webpage should appear upon hitting refresh.

With all the DataPages you’ve built for your sales reps live for everyone to access, your authorized users can start to add new sales, view company sales and review their own sales performance.

The next three DataPages you’ll deploy will be from your Admin folder. The same procedure still applies so it should be easy:

DEPLOYMENT 4: new_rep.html

Copy the Embed deploy code for Add New Rep and paste it on your designated HTML page (new_rep.html). Then refresh your webpage after saving to see if the form interfaced well with your html template. Use your sample admin account (Username: john@admin.com, Password: test) to gain access.

DEPLOYMENT 5: manage_reps.html

Next, copy the deploy code for View/Manage Reps and paste it on your designated HTML page (manage_reps.html). Then once again, test your webpage after saving. Hit the Search button when the form appears to check if all the reps in your database are displayed on screen.

DEPLOYMENT 6: manage_sales.html

Finally, for this section, copy the deploy code for View/Manage Sales and paste it on your designated HTML page (manage_sales.html). Upon hitting refresh on your website, you should see a search form appear. Clicking Search will fetch all the sales data grouped by reps and broken down by product.

The last three DataPages will all be embedded on one webpage to create your administrator dashboard. The layout will be two charts on top and a pivot table at the bottom.

DEPLOYMENT 7: dashboard.html

After setting up your dashboard html page (dashboard.html) to display the final DataPages correctly on screen, copy and paste all three deploy codes for Total Sales by Month (left-hand side), Top Performers (right-hand side) and Sales Pivot (bottom).

Upon publishing your dashboard webpage and hitting refresh, notice that the width of your pivot table exceeds the html template of this tutorial. Fixing this phenomenon boils down to adjusting the DataPage from Caspio and limiting the information being displayed, or expanding your html template to fit your current DataPage inside.

This concludes the deployment of all your admin tabs. Your administrators can access them anytime in the navigation menu.