Articles in this section
Category / Section

Advanced Settings for Configuring Contact us Web Form

Published:

While using Custom CSS and Custom JS, BoldDesk allows you to customize the web form. Check out this video for more details
.

How to add a Custom CSS

To add the Custom CSS, follow the steps below.

  • Go to the Admin module and select Web Forms.

    image.png

  • Select the web form to which you want to apply the Custom CSS.

  • Add additional CSS to override the existing styles of the web form.

    image.png

  • For example, you can add the style as shown below.

    image.png

.widget-feedback-form-container .form-builder .phone-number-field {
   display: none;
}

How to add a Custom JS

  • Select the web form to which you want to apply the Custom JS.

  • Add the Custom JS for the web form.

    image.png

  • For instance, use this as custom JS for changing static field Label

    Example this script will change label text of field “How can we help?” to “Description

    image.png

var label = 'Description';
var element = document.querySelector(".description-field .custom-field-label");
element.setAttribute('data-title', `${label}`);
element.innerText = `${label}`;

Note:

  • Any custom code you add to the web form is your responsibility. Please take care when making these modifications because they could cause an impact on your customer experience.
  • When incorporating CSS or JS, please use proper syntax.
Was this article useful?
Like
Dislike
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied