Bootstrap Design in Web Forms for Marketers Sitecore
I want to create a form according to the bootstrap:
<form class="form-inline">
<div class="control-group">
<div class="input-append">
<input class="span2" placeholder="Email Address" name="email" id="email" type="text">
<button class="btn" type="submit">Go!</button>
</div>
</div>
</form>
How can I customize the WFFM design?
EDIT
I want to create a form exactly the same
Here is my html example
<div class="inputBtn">
<input class="" placeholder="Email Address" name="email" id="email" type="text">
<button class="" type="submit">Go!</button>
</div>
</div>
I created the inputBtn class and applied as above, but it doesn't look exactly what I want. It looks like this.
source to share
First you need to add your Css class definition to the file site.css
.
Next, you need to create a new item in Sitecore using the default path based /sitecore/system/Modules/Web Forms for Marketers/Settings/Meta data/Css Classes
on the extended template list item. In the box, Value
you will need to enter your Css class.
Now in your form designer, select the field you want to add to the class. Then you will see on the left, you can select your class from the Css Class dropdown. See below
EDIT
You can go down the route to create your own field type. You will need to add html to the ascx, in the code behind the tool BaseUserControl
.
By implementing BaseUserControl, you will need to add your code for the send email action in the method Result
.
From there, you need to add a new custom field type to Sitecore. To add a new Web Form for Marketers field, in the Content Editor, navigate to the path /sitecore/system/Modules/Web Forms for Marketers/Settings/Field Types/Custom
and insert a new field type by entering the Assembly name and class name in the appropriate fields. See below
This will allow you to select a new type of field with this exact style using the form designer. Links and more information below:
https://divamatrix.wordpress.com/2011/12/20/wffm-custom-field-type-made-easy/ http://jonathanrobbins.co.uk/2015/02/18/sitecore-web-forms- for-marketers-send-email-with-attachment-save-action /
source to share