Рассмотрим одну интересную возможность конструктора Bricks Builder, которая поможет вам создать именно ту структуру html которую вы задумали. Речь пойдет о произвольных тегах для блока. Самое простое это банальный набор который мы можем выбрать из выпадающего списка.
Как мы видим на рисунке, для виджета DIV есть выбор html тега . На основе того, какой тег мы выберем, открываются нужные настройки. Например , если выбрать самый популярный тег a[Link] то блок превратится в ссылку, а то что внутри будет обернуто тегом <a> .
Но самая интересная тут возможность это произвольный тег. При выборе опции Custom , у нас появляется возможность выбрать самостоятельно какой тег будет у нашего блока, ведь по умолчанию он DIV .
При выборе Custom нам достаточно ввести название тега и мы получим нужный html тег.
Практика
Перейдем к практике. Например мне нужно вывести на страницу таблицу с ценами работ в виде таблицы. Сама таблица создается с помощью произвольных полей ACF .
Чтобы вывести такую таблицу на сайт, многие просто выводят это в виде отдельных div блоков и стилизуют под таблицу. (cобственно так делали в Elementor через лишнии дополнения) . Но в Bricks можно создать и настоящую html таблицу за счет произвольных тегов.
Опишу сначала на словах. Создаем Блок Div (далее просто блок) и указываем ему тег Table . Далее внутри создаем блок с тегом TR . На данный блок вешаем запрос перебора с поля ACF с таблицей. И внутри еще блок с тегом TD в который помещаем виджет текста и устанавливаем ему тег span . Конечно в тексте выводим динамическую переменную из полей ACF таблицы. Если стилизуете таблицу, границы к тегу TD то необходимо схлопнуть границы с помощью css кода к тегу таблицы table {border-collapse: collapse;}
В итоге мы получили вот такую чистую обычную таблицу. Чистый код, ничего лишнего 🙂