What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Is it possible to change the feedback button image / style?

    Asked by tybriscoe on September 30, 2012 at 05:01 PM

    How would I go about changing the feedback button image / style?

    Page URL:
    www.split-it.biz

  • Profile Image
    JotForm Support

    Answered by liyam on September 30, 2012 at 06:33 PM

    Hello tybriscoe.  Yes, it's possible to change the feedback button image / style. 

    You can insert on your webpage the CSS code by using this CSS selector to override inline styles made by the feedback button: a.jotform-feedback-link[style]

    Here's an example:

    a.jotform-feedback-link[style] { background: url('http://max.jotfor.ms/images/logo.png') !important;

    Inserting the CSS on your webpage will replace your feedback button's background with the jotform image. 

    If you need further assistance, please do let us know.

    Thanks.

  • Profile Image

    Answered by tybriscoe on September 30, 2012 at 09:21 PM
    Thanks for the reply.
    Where exactly would I place that piece of code?
    Ty Briscoe
    310.806.0769
    skype: tybriscoe
  • Profile Image
    JotForm Support

    Answered by liyam on September 30, 2012 at 11:51 PM

    You can insert the CSS code inside the same HTML file where you have placed your feedback form code, in between your <style> ... </style> tags.

    To be able to help you further, can you tell us if you're using a CMS or an HTML static page?

  • Profile Image

    Answered by tybriscoe on October 01, 2012 at 01:35 AM
    Html static page.
    Thanks for the help.
    Ty Briscoe
    310.806.0769
    skype: tybriscoe
  • Profile Image
    JotForm Support

    Answered by liyam on October 01, 2012 at 03:14 AM

    Thanks for your response, Ty.

    Since you're using an HTML file, then simply open the HTML file and then insert the sample code. Feel free to modify it the way you like. 

    You can either set your background and font color within the script:

    <script src="http://max.jotfor.ms/min/g=feedback2" type="text/javascript">  
       new JotformFeedback({
         formId : "22735680421148",
         buttonText : "Page Alert!",
         base : "http://jotform.us/",
         background : "#FF001E",

         fontColor : "#FFFFFF",

         buttonSide : "right",
         buttonAlign : "top",
         type : false,
         width : 400,
         height : 400
       });

    </script
    >

    Or you can use the CSS selector I provided:
    a.jotform-feedback-link[style] { background: url('http://max.jotfor.ms/images/logo.png') !important;})

    And insert some of these codes to override the current CSS generated by the script:
     

    padding: 7px 15px;
    position: fixed; right: 0px;
    font-family: verdana;
    font-size: 15px;
    color: rgb(255, 255, 255);
    background: none repeat scroll 0% 0% rgb(255, 0, 30);
    z-index: 999;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    border-radius: 5px 5px 0px 0px;
    margin-right: -39.5px; top: 35px;
    margin-top: 39.5px;

    An example script that you'd put within your style tags would look like this:

    =====
    a.jotform-feedback-link[style] {
       background
    : url('http://max.jotfor.ms/images/logo.png') !important;
      font-family: Arial !important;
      font-size: 12px !important;
    }

    =====

  • Profile Image

    Answered by tybriscoe on October 02, 2012 at 02:51 PM


     


     


     


     


     


     


     


    split_it_logo.jpg


    Social Commerce Platform


    Coming Soon


    Copyright 2012 Split Things, Inc.


     


     


     




  • Profile Image
    JotForm Support

    Answered by Rodjit on October 02, 2012 at 03:38 PM

    Hi tybriscoe,

    Your image is not working, can you please reupload it and just give us the URL? May we also please know if you have further questions?

    Thanks

  • Profile Image

    Answered by tybriscoe on October 02, 2012 at 04:29 PM
    http://split-it.biz
    http://split-it.biz/images/logo_small.png
    Thanks!
    Ty Briscoe
    310.806.0769
    skype: tybriscoe
  • Profile Image
    JotForm Support

    Answered by NeilVicente on October 02, 2012 at 08:22 PM

    Ty,

    Please add the following codes to your html page where the feedback form was embedded:

    <style type="text/css">
    a.jotform-feedback-link[style] {
    background: url('http://split-it.biz/images/logo_small.png') no-repeat !important;
    margin-top: 0 !important;
    text-indent: -9999px;
    line-height: 90px !important;
    width: 150px !important;
    padding-bottom: 0 !important;
    }
    </style>

    This worked great on Chrome, Safari, IE and Firefox, at least on my end.

    If you're having any issues, feel free to contact us again.

    Thanks!

  • Profile Image

    Answered by tybriscoe on October 02, 2012 at 09:20 PM
    90 degrees clockwise?
    Looks good.
    Thanks!
    Ty Briscoe
    310.806.0769
    skype: tybriscoe
  • Profile Image
    JotForm Support

    Answered by jonathan on October 02, 2012 at 09:28 PM

    @tybriscoe

    Hi, the image did follow the orientation of the feedback button(you can noticed this similarly on the button text)

    Perhaps rotating the orientation of the image itself using an image editor to a 90 deg angle, will fix the orientation view. (if you locate the feedback button at bottom, the image will be oriented correctly as is)

    Please inform us if you require further assistance.

    Thanks.