Display an Icon on a form button | Community
Skip to main content
W
William_van_Deventer
December 14, 2020

Display an Icon on a form button

  • December 14, 2020
  • 3 replies
  • 2048 views

What is the recommended way to display an Icon on a button in an Adaptive From instead of the usual text?

I've checked the button component's  widget.jsp and while there is a <span class="iconButton-icon"></span> being rendered, I don't see anything that appears to allow specifying an icon to display. Ideally I'd like to use the built-in icons already provided by aem.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

MHWinter
MHWinter
Level 4
December 15, 2020

I am not an expert so this may not be the most elegant way of doing it: a simple solution is just to place an image object over the button object. I tried and it works 🙂

    W
    William_van_DeventerAuthor
    December 22, 2020
    How did you place the image over the button?
      Mayank_Gandhi
      Adobe Employee
      Mayank_GandhiAdobe Employee
      Adobe Employee
      December 17, 2020

      @william_van_deventer  You can use the image component or text component and embed the image using source edit.

        W
        William_van_DeventerAuthor
        December 22, 2020

        How does this work with a button?

          Mayank_Gandhi
          Adobe Employee
          Mayank_GandhiAdobe Employee
          Adobe Employee
          December 22, 2020

          @william_van_deventer Have you tried the style editor to add inline css?

            N
            NitroHazeDev
            Level 9
            June 4, 2024

            Late, but anyone trying to find an option , try overriding button.scss and add before annotations to place an icon say remix icon and use style system to choose and set for buttons. 

            Terms & ConditionsAccessibility statement

            Loading footer...