Прежде всего, перед началом урока мы хотим убедиться, что вы уже обновили версию Elementor Pro. В этом руководстве мы будем работать с шаблоном Single Post, поскольку шаблон Single Post — это одна из функций конструктора тем Elementor, доступная только в версии Pro.
Редактирование шаблона Single Post
На приборной панели WordPress перейдите в раздел Templates -> Theme Builder. Войдя в окно Конструктора тем, щелкните на меню Single Post, чтобы добавить новый шаблон. Или вы можете выбрать уже существующий.
Добавление класса CSS к виджету Post Info
Далее мы добавим CSS-класс в виджет Post Info для связи с JavaScript-кодом, который мы добавим позже.
В настройках виджета перейдите на вкладку Advanced -> Layout -> CSS Classes. Добавьте remove-commas в поле ввода CSS Classes.
Добавление HTML-виджета в шаблон Single Post
Теперь необходимо добавить HTML-виджет в шаблон. Виджет можно разместить в любом удобном месте. В данном примере мы размещаем виджет HTML под виджетом Post Info.
Далее скопируйте приведенный ниже фрагмент JavaScript и вставьте его в поле ввода HTML Code.
Вот и все. Обновите шаблон Single Post, нажав кнопку Update. Вы можете просмотреть свой шаблон, нажав кнопку Preview (Просмотр) или посетив один из своих постов, чтобы увидеть результат.
(Бонус) Создание потрясающей категории и элементов тега
Возможно, вы задаетесь вопросом, как сделать привлекательные элементы категорий и тегов, как у нас (см. изображение выше). Для этого достаточно добавить пользовательский CSS в виджет Post Info.
В настройках виджета Post Info перейдите на вкладку Advanced -> Custom CSS. Скопируйте приведенный ниже фрагмент CSS и вставьте его в поле ввода Custom CSS.
Итог
Убрав разделитель запятых в виджете Elementor Post Info, вы сможете получить больше контроля над оформлением своих постов и сделать их более привлекательными с визуальной точки зрения. Мы также даем бонусный совет по созданию привлекательных категорий и тегов.
Мы надеемся, что эта статья будет полезной, а если у вас возникнут вопросы или пожелания, пожалуйста, обращайтесь к нам.
