Add an icon to a button

You can add icons or images to buttons, like a phone icon (📞) for click-to-call buttons, an email icon (📧), arrows (⬅️ ➡️) for read more buttons, or anything you can think of. Learn how to add icons to buttons in this guide.

There are many sites where you can find images or icons you can use on your site. A few examples include:

• Most Windows, Macs, and mobile devices have built-in emojis that can be added to buttons.
• You can also copy emojis from sites like Get Emoji.
• Google Fonts includes an icons option.
• Font Awesome is a popular site that has free and paid icons.

If using an image, SVG or PNG (transparent) file types are recommended. You can upload the icon to your Media Library before you add the button or upload the icon as you add the button (described below).

You can add an icon or image to a button in WordPress.com using the Buttons block and an icon of your choice. Follow these steps to add an icon to a button.

1. Add a button and include the text and link for your button.
   • You can also create a click-to-call or click-to-email link.
2. Click the button and position your cursor before or after the text.
3. Depending on whether you are using an emoji or an image:
   • Emoji: Use the keyboard shortcut for Windows or Mac and select the emoji. Or, copy and paste the emoji from a site like Get Emoji.
   • Image: In the toolbar that appears, click the down arrow (More) and select the “Inline Image” option.
     • Choose your image from your Media Library or upload a new image.
     • Double-click the image to change the image size and add ALT text.
4. Click Save or Publish to save your changes.

The following example uses the Mac keyboard shortcut to add an emoji. You can also use the Windows keyboard shortcut or copy and paste an emoji from another site.