How to add badge icons

To add one of the standard icons before a badge, use the following format by adding a icon name separated by a colon (:):

Available Icons:

• award

• bag-check

• balloon-heart-fill

• bell

• bookmark-heart

• bookmark-star

• box2-heart

• boxes

• chat-heart-fill

• check-all

• check-circle

• check-lg

• check-square-fill

• circle-fill

• coin

• controller

• earbuds

• emoji-frown

• emoji-sunglasses

• fire

• gem

• hand-thumbs-down

• hand-thumbs-up

• headphones

• heart

• house-check

• lightning-charge-fill

• music-note-beamed

• patch-check

• patch-exclamation

• rocket-takeoff

• star-fill

• stars

• trophy

Example:

To add the "award" icon with a badge "Editor's choice", use:

award:Editor's choice

Custom SVG Icons

To add custom SVG icons for badges, use the cegg_svg_icon_list filter. This filter allows you to easily extend the list of available icons by adding new ones. Below is an example of how to add custom icons:

function add_custom_icons($icons) {
    // Check-square icon
    $icons['check-square'] = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check-square" viewBox="0 0 16 16"><path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z"/><path d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425z"/></svg>';
    
    // Star-fill icon
    $icons['star-fill'] = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16"><path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/></svg>';

    return $icons;
}
add_filter('cegg_svg_icon_list', 'add_custom_icons');

For more SVG icons, you can explore a large collection from the Bootstrap Icons Library.