How can I add texture to my form?

  • deliverygurullc
    Asked on June 25, 2015 at 1:36 AM

    I love the texture of the Jotform site and would very much like to do something similiar

  • ibrahim JotForm UI Developer
    Replied on June 25, 2015 at 3:07 AM

    Hi,

    You can inject CSS code for adding texture. Here's sample code: 

    .form-all {

      background-image: url(texture.jpg);

      background-repeat:repeat;

    }

    Thanks.

  • deliverygurullc
    Replied on June 25, 2015 at 3:08 AM

    Trying it out now, thanks!

  • deliverygurullc
    Replied on June 25, 2015 at 4:58 AM

    I'm assuming it's not okay to use the Jotform textured background as my textured Jotform frame. Would that be accurate?

  • Welvin Support Team Lead
    Replied on June 25, 2015 at 8:42 AM

    It's up to your preferences. You can use it if you want to, I think that's okay. :)

    Let us know if you need some help about it.

    Thanks

  • deliverygurullc
    Replied on September 25, 2015 at 10:20 AM

    Welvin,

    Yes sir I would like some help with that exactly please sir. Thank you

  • Welvin Support Team Lead
    Replied on September 25, 2015 at 11:33 AM

    Sure. I need to know what texture of the website that you'd like to apply to your form. If you can take a screenshot and put an arrow to it, that would be great. Here's our guide on how to upload a screenshot to this support forum: https://www.jotform.com/answers/277033.

    Thanks

  • deliverygurullc
    Replied on September 25, 2015 at 4:18 PM

    How can I add texture to my form? Image 1 Screenshot 20

    Any an all of the areas above would be sweet. If, there is a way to maintain a slightly darker outer frame that would be extra nice. Thanks for your help sir!

  • Boris
    Replied on September 25, 2015 at 4:45 PM

    I believe that you are talking about your form http://www.jotformpro.com/form/52272047015951

    I have cloned it to my account, and applied the texture to it:

    http://form.jotformpro.com/form/52676081531960

    You can apply the same styling by opening the Designer:

    How can I add texture to my form? Image 1 Screenshot 30

    In the Designer, change to the CSS tab, and paste the following code into the textbox:

    .supernova { background: #444 url("../images/themes/tile-black.jpg") repeat scroll 0px 0px !important; }
    .form-all { background: rgba(78,78,78,.7) !important; }

    How can I add texture to my form? Image 2 Screenshot 41

    Please let us know if you need further help with this, and we will be happy to assist.

  • deliverygurullc
    Replied on September 25, 2015 at 4:50 PM

    Nice! Thank you very much!

  • Boris
    Replied on September 25, 2015 at 4:52 PM

    You are most welcome, we are happy if you are happy! :)

    Please don't hesitate to contact us again should you need any other assistance with your forms, and we will be happy to help.