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.

Customising required field asterix - part 2

Gravity Support Forums » Plugin Support » Gravity Forms

  1. sascha
    Member

    Hi there,
    Rob replied to this topic before, but 2 questions were unanswered yet.
    I would like to customise the way that the required fields asterix is being displayed. I'm thinking off either:

    1. Using my own graphic/png/jpg and not display the aterix at all

    2. Using a different standard sign or string (i.e # or <required>)
    Is there a hook I can use to achieve this?

    P.S: It would be great to leave topics open for a while, so people can contribute. Or better give people the option to re-open a ticket/topic...

    Posted 12 years ago on Saturday December 3, 2011 | Permalink

  2. Rob Harrell
    Member

    Sascha, you can use jQuery to replace the *.

    Do this with a jQuery snippet added to your theme file. You would look for the "gfield_required" span and replace the contents with whatever you'd like. This of course assumes that you have already enqueued the jQuery library in your theme header.

    jQuery.noConflict();
  jQuery(document).ready(function($) {

     $('.gform_wrapper .gfield_required').html('* required');

  });

    screenshot: http://grab.by/aczC

    Posted 12 years ago on Saturday December 3, 2011 | Permalink

  3. sascha
    Member

    Hi Rob (the targeting CSS Jquery beast!),
    thanks for the super quick reply. Still finding my way around all the different possibilities of manipulating stuff.

    Posted 12 years ago on Saturday December 3, 2011 | Permalink

  4. Rob Harrell
    Member

    No problem, glad to help. Manipulate away!

    Posted 12 years ago on Saturday December 3, 2011 | Permalink

  5. kyle
    Member

    It looks like the asterisks get the class gfield_required. I'm not certain they are the only items with that class, but if they are you can do an image replace with this CSS:

    .gfield_required {
background: url(images/myimage.png) no-repeat 0 0;
display: block;
text-indent:-9999px;
height: 16px;
width: 14px;
}
    Posted 12 years ago on Saturday December 3, 2011 | Permalink