Theme Image Block

The Theme Image Block plugin allows you to register images from your theme and make them available as blocks in the WordPress editor. This is useful for logos, icons, and other images that are part of your theme’s design system.

Usage

Registering Theme Images

Theme images should be registered using HappyPrime\ThemeImageBlock\register_theme_image(). This is likely best done on the init or after_setup_theme action.

HappyPrime\ThemeImageBlock\register_theme_image(
    'happy-prime-logo',
    [
        'title' => 'Happy Prime Logo',
        'description' => 'The Happy Prime logo.',
        'alt' => 'Happy Prime',
        'path' => 'images/happy-prime-logo.svg',
        'width' => '300',
        'height' => '',
        'variations' => [
            'small' => [
                'path'   => 'images/happy-prime-logo-small.svg',
                'width'  => '100',
                'height' => '100',
            ],
            'medium' => [
                'path'   => 'images/happy-prime-logo-medium.svg',
                'width'  => '200',
                'height' => '200',
            ],
            'large' => [
                'path'   => 'images/happy-prime-logo-large.svg',
                'width'  => '300',
                'height' => '300',
            ],
        ],
        'sizes' => '(max-width: 600px) 100vw, 300px',
    ]
);

Registering Theme Image Styles

Theme image styles should be registered using HappyPrime\ThemeImageBlock\register_theme_image_style(). This is likely best done on the init or after_setup_theme action.

HappyPrime\ThemeImageBlock\register_theme_image_style(
    'hero',
    [
        'name'   => 'Hero',
        'width'  => 'clamp(10rem, 100vw, 60rem)',
        'height' => 'auto',
    ]
);