Form

Posted by Community Admin on 03-Aug-2018 09:35

Form

Sitefinity - General Discussions

All Replies

Posted by Community Admin on 09-Jan-2014 00:00

Hello,
I have already created a form and called it on a page but I can neither center it nor enlarged the text.  I have also add CSS to it,  but the latter is applied only to the header's part.  I want to modify the text boxes and format the submit button.  Can someone please help me.

Thank You
Vishika

Posted by Community Admin on 14-Jan-2014 00:00

Hi Vishika,

Could you please take a look at the following article from the Sitefinity documentation to get the list of CSS classes applied to forms widget. Then you can create a .css file in your project's folder and add your CSS styles. Here is an example:

/*Input field of Textbox and Paragraph text box form widgets*/
.sfTxt
    width: 200px;
    height: 40px;
    border-radius: 6px;
    background-color: #dedede;
 
/* label wrappers */
.sfLeftLbls, .sfRightLbls, .sfTopLbls
    text-align: center;
 
/*Submit button*/
input[type=submit]
    background-color: #24ca23;
    color: white;
    width: 200px;
    height: 40px;
    border-radius: 6px;
 
/*Field label of Textbox, Multiple choice, Checkboxes,
    Paragraph text box, Dropdown list form widgets.*/
.sfTxtLbl
    font-size: 18px;

After writing the CSS you can drag the CSS widget to the page where the form is populated and click the Edit button of the CSS widget. Then please select the Link to a CSS file tab and select the CSS file you have just created. The styles should be applied as shown in the screenshot.

Another option is to select the Write CSS tab and enter the CSS code in the textbox. In the following article you can find additional information on how to apply CSS styles to your page using the CSS widget. 

If you have a custom theme applied to this page you can go to your theme and add CSS styling to your forms.

Regards,
Sabrie Nedzhip
Telerik
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 14-Jan-2014 00:00

Dear Sabrie 

I think it could be helpfull if in every section of the .css documentaion there were a download link to the default theme .css so we could take this as a starting point.

Markus

Posted by Community Admin on 17-Jan-2014 00:00

Hi Markus,

Thank you for the feedback. I have forwarded your suggestion to the Documentation team. For the time being you can download the Basic theme from your SDK installation folder/Content/Resources/BasicFrontendTheme.

Regards,
Sabrie Nedzhip
Telerik

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

This thread is closed