How to set up Umbraco Forms
uSkinned Site Builder for Umbraco is fully compatible with Umbraco Forms. Umbraco Forms are great for when you need to collect more complicated data, such as document uploads, dates etc.
Login to the CMS.
From the menu in the top bar, go to "Forms".
You will now see a green button in the middle of the screen that reads "Install Forms". Click this button.
Please wait while Forms installs. The CMS will refresh once complete. This may take several minutes.
Once the installation has been completed, use the button "Create a form" to start building your first form.
Name your form.
Add the relevant fields to your form. You can choose from a wide range, including, text field, text area, select box dropdown and multiple choice checklist plus lots more.
Once you're happy with the form you can set up a unique workflow. This can be extended to integrate a number of other third-party CRM systems etc.
In this guide, we will just set up the form to send an email to the recipient and save the entry in the database to be viewed via the CMS.
In the top right, go to Settings. From the options next to the label "Styling", you should check the box "Disable default stylesheet". This will ensure that your Umbraco Form adopts the styling of your uSkinned website.
Save your form.
You can add a Umbraco Form to many areas of your site including, as a Component, Pod, Split component item or in the Footer. In this following example, we will add it as a component.
Go to the "Content" section of the CMS. In the tree menu, go to any page or post — or create a new one.
Go to the 'Content' tab. At 'Main Content' add a new component.
From the slide-out panel, select 'Form'.
From the options provided, select "Umbraco Form".
Now click "Add" to add your new Umbraco Form.
From the slide-out panel choose the correct form.
Save and publish.
View and test the form on the front end of your uSkinned Site Builder website.
More ways to display Umbraco Forms
There are a variety of places you can add a Umbraco Form to your uSkinned Site Builder website.
You can try this out using the same steps for:
— Pods component > Form
— Split component > Form
— Global components > Form
— Reusable components > Form
— Global pods > Form
— Extra Content pods > Form
— Reusable pods > Form
— Footer pods > Form