Задать вопрос
ae_ph
@ae_ph
I'm a owl )

Как добавить редактирование блока в wordpress?

6478ecc4e7aef050006564.png

Натягиваю вёрстку на wordpress.
Есть блок в котором есть другие блоки поменьше.
Как можно сделать так, что-бы иметь возможность редактировать данные блоки?
Нужно изменять URL ссылку, Изображение (там сейчас заглушки чёрные стоят на скрине) и название (видно при наведении на скрине).
Добавлять данные блоки и удалять а так-же перемещать между собой.

У меня получается просто залить вёрстку но суть в том, что-бы облегчить добавление и редактирование контента.

Попробовал сделать это через плагин Advanced Custom Fields (ACF)
На странице сайта в php файла добавил код для подключения плагина
Но я не понимаю это нужно каждый раз мне тогда редактировать php файл для добавления нового блока.
И я так и не понял где отредактировать содержимое его.
<div class="wrapper-the-work">
                  <div class="the-work">
                    <a class="myworks__mysite--piture" href="my_works/01/index.html" target="_blank">
                      <img src="<?php echo get_template_directory_uri(); ?>/media/job_1.webp" alt="image">
                      <div class="myworks__mysite--open">
                        <p class="ff2 fz3 myworks__mysite--open-text">site</p>
                      </div>
                    </a>
                  </div>
                </div>
  • Вопрос задан
  • 66 просмотров
Подписаться 1 Простой Комментировать
Решения вопроса 1
ae_ph
@ae_ph Автор вопроса
I'm a owl )
Я использовал плагин "Getting Started with ACF"

В панели Wordpress нажимаем на плагин "ACF"
Группы полей, нажимаем "добавить"
Тип поля, выбираем "повторитель 'Repeater - на английском'"
Документация – www. advancedcustomfields .com/resources/repeater/
Функция платная но вы знаете что делать :D ‍☠️
В гугле бейте "Скачать Advanced Custom Fields Pro 6.1.1" и там вроде самый первый сайт wp-club.
Опять-же на свой страх и риск в плане безопасности! Я не призываю, просто делюсь.

Заполняем поля "Ярлык поля" и "Имя поля" – название должно совпадать с тем что у вас в файле php
Например my_works_fields
P.S. Должно совпадать вроде "Имя поля" а не "Ярлык поля" я не проверял ещё везде указал одно и то-же...

Вот мой код для примера Обратите внимание в коде я добавляю только 3 поля! Для текста, ссылки и изображения. Если вы будете в шаблоне плагина добавлять ещё что-то соответственно нужно дописать код!
<?php if (have_rows('my_works_fields')) : ?>
                <?php while (have_rows('my_works_fields')) : the_row(); ?>
                <div class="wrapper-the-work">
                  <div class="the-work">
                    <!-- Получаем значения полей для каждого блока -->
                    <?php $link = get_sub_field('Link');
                    $image = get_sub_field('Image');
                    $title = get_sub_field('Description');
                    ?>
                    <a class="myworks__mysite--piture" href="<?php echo $link; ?>" target="_blank">
                      <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
                      <div class="myworks__mysite--open">
                        <p class="ff2 fz3 myworks__mysite--open-text"><?php echo $title; ?></p>
                      </div>
                    </a>
                  </div>
                </div>
                <?php endwhile; ?>
                <?php endif; ?>


Добавляем нужные поля, опять-же "Имя поля" или "Ярлык поля" должны совпадать с теми что в файле PHP!

Вот пример $title = get_sub_field('Description');
647a30376b941270950303.png

Чуть ниже я выбрал "блок" среди доступных: "таблица", "блок", "строка".
Спускаемся ещё ниже и в настройках выбираем привязку к нужно странице на сайте
647a31cabd11a559189927.png
Всё все нужные поля заполнили и создали шаблон для блока, в правом верхнем углу жмём кнопку "Save Changes"

Далее идём в панель Wordpress, переходим в раздел "Страницы" и нажимаем изменить нашу страницу
Тут страницу где у вас вставлен php код "как я выше показывал".

Там мы видим наш шаблон который мы создали в плагине "ACF"
Заполняем все поля которые насоздавали...
Если хотим добавить ещё один блок, жмём кнопку "добавить" и у нас появится ещё один точно такой-же шаблон.

Вот пример
647a353e4f981258692032.png

Возможно вам нужно будет на этой странице в правом верхнем углу нажать на "Три вертикальные точки"
В самом низу нажать "предпочтения", далее выбрать с лева блок "панели"
И в разделе: (Дополнительно | Добавьте дополнительные области в редактор.) Включить кнопку.

647a36793b2c1976048714.png

После всего этого у вас должно всё работать!
Больше не нужно заходить в файл php и добавлять каждый раз код нового блока.
Достаточно того кода который я привёл выше.
Нужен новый блок, зашли на страницу добавили ещё один шаблон, заполнили его, нажали кнопку "обновит" страницу и всё у вас ещё один блок на сайте.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
anatoly_kulikov
@anatoly_kulikov
Помог ответ? Отметь решением!
В идеале это можно сделать для редактора Gutenberg, создав там специальный блок, чтобы потом из админки собирать контент как душе угодно (и легко это редактировать).

Писать там кода придется немало, но результат будет тот, что надо.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы