PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Add a CSS class to one word in the field label

  1. Hey,

    I've searched all over the internet for a solution to this to no avail. I am looking for a way to add a CSS class to one word in my field labels either with a simple span tag or I wouldn't be adverse to writing a simple shortcode to do the trick either. But Gravity forms renders both options useless, it seems.

    Is there a solution here which I am missing?

    Here is a quick screenshot of what I'm trying to do: http://alleysandcorners.com/sfs/2012-11-04_1043.png

    Thanks for any help you can provide!

    Posted 12 years ago on Sunday November 4, 2012 | Permalink
  2. I don't think you will be able to do this in the form builder. You're going to have to resort to jQuery to change the display of that one word in your label. It would be an approach similar to this: http://stackoverflow.com/a/8881222

    Posted 12 years ago on Monday November 5, 2012 | Permalink
  3. I did finally find another thread which gave the same suggestion, but I'm really rather disappointed by this. Resorting to Javascript for display issues feels like really bad form IMHO.

    Ultimately, I coded the following in case anyone else is curious. This should REALLY be solved in some form. Maybe enable shortcodes in the field label when the form is displayed. That would have made my life so much easier... :-/

    <script type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function($) {
    function replaceblue() {
    $("label").each(function(index) {
    var html = $(this).html();
    var reghtml = html.replace(/\*([A-z0-9 _\/]*)\*/gi, function($1, $2) { return '<span class="evblue">' + $2 + '</span>'});
    $(this).html(reghtml);
    });
    }
    jQuery(document).bind('gform_post_render', function(){
    replaceblue();
    });
    replaceblue();
    });

    </script>

    Posted 12 years ago on Monday November 5, 2012 | Permalink
  4. Is this the post you are referencing?
    http://www.gravityhelp.com/forums/topic/allow-html-in-field-label?message=closed#post-5565

    The issue does not come up frequently which is why it has not been added as a feature. I'll tag it as a feature request so we don't lose track of it.

    Posted 12 years ago on Monday November 5, 2012 | Permalink
  5. Thanks :).

    Posted 12 years ago on Monday November 5, 2012 | Permalink

This topic has been resolved and has been closed to new replies.