Skip to content
WPBits WPBits WPBits Documentation

Custom Icon Upload

Custom Icon Upload lets you replace the default block icon with your own custom image.

Supported Formats

Section titled “Supported Formats”
FormatRecommended
SVG✅ Yes
PNG✅ Yes
JPG✅ Yes
GIF✅ Yes

Uploading Icons

Section titled “Uploading Icons”

Step 1: Select Block

Section titled “Step 1: Select Block”
  1. Open the block in WPBits Block Studio
  2. Go to the General tab
  3. Find the Icon section

Step 2: Choose Icon Source

Section titled “Step 2: Choose Icon Source”
  1. Click the Icon field
  2. A popup will appear with two tabs:
    • Dashicons — WordPress built-in icons
    • Custom Icons — Your uploaded icons

Custom Icons Popup

Step 3: Upload Custom Icon

Section titled “Step 3: Upload Custom Icon”
  1. Click the Custom Icons tab
  2. Click Upload or select from Media Library
  3. Choose SVG, PNG, JPG, or GIF file
  4. Click Select

Upload Custom Icon

The icon will appear in the block settings.

Icon Guidelines

Section titled “Icon Guidelines”
Section titled “Recommended Size”
  • 512x512 pixels for PNG/JPG/GIF
  • SVG scales automatically

File Size

Section titled “File Size”
  • Keep under 50KB for best performance

Troubleshooting

Section titled “Troubleshooting”

SVG Upload Not Working

Section titled “SVG Upload Not Working”

If SVG uploads fail:

  1. Install a plugin like Safe SVG to enable SVG support
  2. Or use PNG/JPG format instead

Next Steps

Section titled “Next Steps”