In this blog post, we’ll show how to create a simple WebForm using MS Dynamics CRM which will be used to collect clients’ data directly into CRM. The easiest way is to install XRM.WebForm add-on in your CRM and in a few minutes get functional Web Form that can be deployed onto your website.

This blog post will focus on general steps of creating and deploying Web Form with a simple use case, while in following blog posts, details, tips & tricks and good practice advices will be shared.

  1. Register on powerxrm.com website: http://www.powerxrm.com/register/ , activate it your account by link from your e-mail and download CRM solution from: http://www.powerxrm.com/xrmwebform/ . Make sure to choose correct version of your CRM instance (2013, 2015 and 2016 are supported versions).
  2. Import the solution in your CRM. Open it and enter credentials of your powerxrm.com account, and then of your CRM instance. After configuration is complete, refresh browser to see the changes. If any problems appear, please consult first with Installation and Configuration Guide: http://www.powerxrm.com/wp-content/uploads/2016/06/XRM.WebForm_Installation_and_Configuration_Guide.pdf
  3. New area on sitemap should appear with “PowerXRM” title. Under that area, you’ll see “WebForms” entity. Open it and create New WebForm.
  1. On the form for configuring WebForm, enter basic fields about the WebForm: the name used in CRM and target entity. Target entity is CRM entity whose record will be created with each WebForm submission. Let’s create a Lead WebForm.
  1. You can configure some other WebForm details and submission settings such as: whether to include Google’s reCAPTCHA, what will be written on submit button, what e-mail address to notify when submission happens and where to redirect WebForm visitor after submission. After setting all details, save the WebForm to continue adding fields on it.

  1. WebForm fields can be added by clicking on “+” sign. Form for configuring field should be filled with configuration data. You will notice that you got two fields automatically: “Last Name” and “Topic”, which are business required fields for Lead entity. We will rename “Topic” to “Subject”.

  1. We will create additional fields: “First name”, “Message” and “E-mail”. On form of each of them, main things that need to be configured are Label name and Target Entity Field. Label name will be written next to field on the WebForm and Target Entity Field will determine into which Lead’s field value entered by WebForm visitor will be written. We will choose corresponding names and target entity fields.

  1. Besides these two, numerous other details about each WebForm field can be configured. The most important are “Type” (by default Text) which determines appearance of the field on the WebForm and “Row” and “Column” which determine the position of the field on the WebForm, in correspondence to other fields. Among other details, you can determine default value of the field, tooltip or placeholder. You can also choose whether label will be visible and whether field will be required. After finishing configuration of a single field, save the form and close the window.
  2. You can add CSS and JavaScript to your WebForm. You can add CSS and JS files or write CSS directly. You can also determine class selectors for HTML elements representing form fields and WebForm as a whole in order to easily add CSS and JS attributes, without need to intervene with HTML directly. By default, bootstrap CSS and JS files and class selectors are added and we’ll leave them as they are in our use case.
  3. When you’re done with WebForm configuring, save it and click on “Preview & Deploy” button on the ribbon. When doing it for the first time, be patient because it could take some time (next time it will be much faster). Patience will pay off because after several seconds you will be able to preview WebForm that you’ve just created. If you’re satisfied with how it looks, click on “Publish” button to publish it. Otherwise, you can just click on “Close” button, edit WebForm and preview it again.
  4. After publishing the WebForm, it is ready to be used. You can take it as URL, iframe or HTML content. By clicking on buttons “Iframe”, “URL” and “HTML” you will preview HTML tag for iframe, URL or HTML content respectively. You can copy it and paste it to your website. Best way is to use it as iframe because all changes made afterwards on WebForm will automatically reflect on you website.
  5. When you incorporate your WebForm to the website whether as link, iframe or HTML content, it will become available for all visitors of your website. When they fill it out and submit it, major result of it will be a record created in CRM. It will be a record of the entity specified as “target entity” when WebForm was configured. Besides the record created, you can track submissions through “WebForm Activity” entity which can be found under “PowerXRM” area as well. After each submission, new activity will appear with detailed report on submissions. Final way to track submissions is by e-mail reports which will be sent to e-mail address specified as “e-mail address for notifications”.

    WebForm deployed as URL

    Created lead record

    WebForm Activity

    E-mail report

  1. WebForm can be modified at any time. Only thing needed to do is to find specific WebForm (from “PowerXRM” area on sitemap), open its form for configuring, change it in any way: add/remove form fields, modify existing one, change CSS, JS…, save the changes and click on “Preview & Deploy” button. Don’t worry, your changes will not be automatically applied, but you’ll be able to preview old and new version. If changes are satisfying, you should click on “Publish” button and only then the changes will apply. If the WebForm is deployed as HTML content, you’ll need to copy new content and replace it with existing. Otherwise, if WebForm is deployed as iframe or URL, changes will be applied automatically and you will not need to do anything.

This was only a brief overview over XRM.WebForm add-on. It should only the basic steps in lifecycle of installing add-on – creating WebForm – deploying WebForm – tracking submissions – editing WebForm, but for simple WebForm, such as one created as example in this blog post, these basic steps are more than enough.

For more detailed explanations on each of these steps, with richer examples and all configuration options covered, you should check out User guide: http://www.powerxrm.com/wp-content/uploads/2016/06/XRM.WebForm_User_Guide-.pdf. The Guide should have an answer for any question. If not, feel free to contact me directly. Also, this is only a first blog post in series on topic of WebForms and MS Dynamics CRM. In following blog posts, we will dive deeper into configuration and deployment details of XRM.WebForm.