Add icon inside Input field

  • Resolved Abid Hasan

    (@abidhasan112)


    3 years, 5 months ago

    Please check this screenshot: https://prnt.sc/GEd8225Jj66E

    As you can see on my attached screenshot there are two forms. Top one is built with another plugin and the bottom one is built with Fluent Forms plugin.

    I’m re-building the previous forms with Fluent Forms plugin. So as you can see in previous form there are icons (inside the input field). Can I add icons just like my previous form in Fluent Forms?

    Thank you in advanced!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Tahmid ul Karim

    (@tahmidulkarim)

    3 years, 5 months ago

    Hello @abidhasan112,

    There is an an option to set Prefix and Suffix Label in FluentForms fields, so you can set any text or icons and this will make the form like the example that you have shared. See this screenshot: https://prnt.sc/i7FLKPA8Mnxk

    Another option is to use custom CSS codes and use the :before pseudo class to insert any custom icons within the input field.

    Thank you.

    Thread Starter Abid Hasan

    (@abidhasan112)

    3 years, 5 months ago

    Hi @tahmidulkarim ,

    Thanks for your reply. Actually I’ve tried with CSS, but it cant possible as I need the icon inside the input field (placeholder area and left align ).

    Regarding the prefix – I’ve found that option in email field not in name field. Any idea? 🙁

    Tahmid ul Karim

    (@tahmidulkarim)

    3 years, 4 months ago

    Hi @abidhasan112 ,

    Sorry for the delayed response. Unfortunately, there isn’t any option to add prefix in the name field. Apart from these two methods, there aren’t any other ways to add icons in an input field.

    Thank you.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Add icon inside Input field’ is closed to new replies.