Alex I
30.09.2024
19.01.2025

Как сделать ссылку у блока Cover? Или группы?

Вот есть большая проблема у Gutenberg блоков. Надо сделать ссылку на Cover блок или что то такое. Как это сделать?

Все официальные методы не работают. Надо либо ставить специальные наборы блоков, либо придумывать что то свое.

Вот тут люди просят сделать что то рабочее и официальное https://github.com/WordPress/gutenberg/issues/19776

Но там нет решений.

Мы можем сделать какой то плагин, чтобы он добавлял url в блок — но все что было официальное — не работает.

Вариант 1. Через расширение стиля блока

Можем добавить новый стиль блока так:


register_block_style(
    'core/cover',
    [
        'name'  => 'link-to-group',
        'label' => "Link",
        'is_default' => false,
        'inline_style' => '
            .wp-block-cover.is-style-link-to-group {
                position: relative;
            }
            .wp-block-cover.is-style-link-to-group a:first-child {
                text-decoration: none;
            }
            .wp-block-cover.is-style-link-to-group a:first-child:after {
                content: "";
                position: absolute;
                inset: 0;
            }
        '
    ]
);

Что тут такого особенного?

мы берем основной блок как position: relative;
затем берем запрос что любая ссылка далее должна стать на весь блок и работать как ссылка
мы должны указать content: «»; position: absolute; и inset: 0;

Теперь любая ссылка внутри блока будет на весь блок размером.

У этого решения есть минусы:

не понятно куда вставлять ссылку и это может путать
блок перестает редактироваться пока выбран этот вариант стиля и надо менять стиль на типовой — чтобы редактироватья

Но как быстрое решение — иногда выручает.