Как создавать диаграммы в WordPress (3 простых шага)

Опубликовано: 2024-01-10

Хотите создавать диаграммы и графики WordPress? Этот пост покажет вам, как создавать диаграммы в WordPress и отображать их на своем сайте!

Как создавать диаграммы в WordPress

Примерное время чтения : 4 минуты.

Вы работаете над веб-сайтом WordPress, которому действительно нужно продемонстрировать некоторые данные?

Добавление динамической диаграммы или графика — отличный способ привлечь внимание посетителей и одновременно получить некоторую статистику.

Получите лучшие формы БЕСПЛАТНО!

Но сложно создать диаграмму для WordPress, не так ли? На самом деле это намного проще, чем вы думаете, особенно если вы используете правильный плагин.

В этом посте мы быстро расскажем, что нам нужно от хорошего плагина диаграмм. Затем мы покажем вам, как именно мы создаем диаграммы для WordPress, не написав ни единой строки кода!

Получите грозные формы прямо сейчас!

Используйте плагин диаграмм и графиков WordPress.

Конечно, на первый взгляд графики кажутся простыми. Но «за кулисами» их может быть сложно кодировать.

Вместо того, чтобы тратить часы на изучение создания интерактивной диаграммы с нуля, потратьте две минуты на установку плагина, который справится с этой сложной задачей за вас!

Хороший плагин диаграмм WordPress предлагает:

  • Простота использования: всего за несколько кликов ваши данные преобразуются в привлекательные визуальные эффекты.
  • Несколько типов диаграмм: круговая, точечная, пузырьковая диаграмма... что угодно! Вы можете переключить его за секунду.
  • Частые обновления: ваши графики будут выглядеть хорошо год за годом.
  • И больше времени заниматься любимым делом!

Итак, какой плагин лучше всего подходит для создания диаграмм в WordPress? Ответ: Грозные формы !

Правильно, лучший конструктор форм WordPress также является лучшим плагином диаграмм WordPress. Это настоящий швейцарский армейский нож для вашего сайта.

Теперь давайте посмотрим, насколько легко создавать диаграммы для WordPress с помощью Formidable Forms.

Как создавать диаграммы для WordPress

Подписаться на YouTube

  • Шаг 1. Установите плагин диаграммы Formidable Forms.
  • Шаг 2. Добавьте блок «Грозная диаграмма» на свою страницу.
  • Шаг 3. Отредактируйте диаграмму в WordPress

    Чтобы следовать этому пошаговому руководству, вам понадобится плагин WordPress Formidable Forms. Надстройка графиков и диаграмм включена в план Formidable Plus и выше.

    Если у вас ее еще нет, просто нажмите ниже, чтобы получить лицензию!

    Профессиональные планы Formidable Forms

    Как только вы установлен и активирован Грозно, мы можем начать создавать нашу диаграмму!

    В качестве сегодняшнего примера мы воспользуемся нашим ведущим блогом по наблюдению за птицами Here Birdie Birdie .

    Вот сайт Birdie Birdie

    На нашем веб-сайте мы создали форму, позволяющую посетителям сообщать о птицах, которых они заметили. Затем сайт автоматически публикует каждую запись в виде сообщения в блоге. Круто, правда?

    Форма наблюдения за птицами

    Хотя это отлично подходит для обмена подробностями, многие посетители спрашивали, каких птиц видят чаще всего.

    Вместо того, чтобы бороться с файлами CSV и таблицами Google, чтобы выполнять математические расчеты и создавать визуальные эффекты, диаграммы или графики, давайте добавим на наш сайт адаптивную диаграмму, чтобы показать количество наблюдений каждого вида птиц.

    Шаг 1. Установите плагин диаграммы Formidable Forms.

    В админке WordPress перейдите в Formidable → Дополнения . Найдите надстройку «Диаграммы », затем нажмите синюю кнопку, чтобы установить ее , и активируйте ее.

    Отлично, теперь перейдем к самому интересному!

    Шаг 2. Добавьте блок «Грозная диаграмма» на свою страницу.

    Далее давайте создадим страницу/пост WordPress, куда мы хотим вставить нашу диаграмму. Для нашего примера мы создадим новую страницу под названием «Статистика наблюдения за птицами».

    В редакторе Гутенберга нажмите кнопку значок, чтобы добавить новый блок. Затем найдите «Грозный» и вставьте блок «Грозная диаграмма» .

    Как добавить диаграмму в WordPress с помощью блока «Диаграмма» из Formidable Forms

    На правой боковой панели выберите форму, которая будет использоваться в качестве источника данных. Теперь мы должны увидеть некоторые данные!

    Выберите форму в качестве источника данных диаграммы

    Не видите переключатель источника данных? Возможно, вам придется открыть боковую панель, нажав кнопку в правом верхнем углу редактора WordPress.

    Шаг 3. Отредактируйте диаграмму в WordPress

    Мы подумали, что столбчатый график (также известный как гистограмма) лучше всего покажет, сколько раз был замечен тот или иной тип птиц. И, к счастью для нас, это тип диаграммы по умолчанию!

    Создайте столбчатую диаграмму в WordPress

    Следующим шагом в создании нашей гистограммы/гистограммы является указание источников данных по осям X и Y здесь, на боковой панели.

    В этом случае мы установим по оси X значение «Тип птицы», а по оси Y — «Количество записей».

    Базовая диаграмма WordPress

    Неплохо, но могло бы выглядеть лучше...

    Оформите свою диаграмму или график в WordPress

    Давайте изменим цвета нашей диаграммы, чтобы сделать ее немного ярче.

    Для этого перейдите на правую боковую панель. В разделе «Внешний вид» выберите нужные цвета.

    Изменить цвет диаграмм в WordPress

    Теперь эта диаграмма обязательно привлечет внимание птицелова!

    Пример гистограммы для WordPress

    Но наш график мог бы быть лучше, вам не кажется?

    Изменение типа диаграммы

    Вместо столбчатой ​​диаграммы лучшим способом визуализации наших данных может быть круговая диаграмма.

    Итак, как мы можем вставить круговую диаграмму в WordPress?

    Перейдем на правую боковую панель и изменим Type со Column на Pie . Да, Formidable Forms также работает как плагин круговой диаграммы!

    Вставьте круговую диаграмму в WordPress

    И вот мы идем! Теперь у нас в WordPress есть круговая диаграмма, показывающая процент каждого ответа, полученного в нашей форме!

    В качестве завершающего штриха мы просто переключим кнопку «Легенда» на боковой панели, чтобы сделать ситуацию еще более понятной.

    Красочная круговая диаграмма

    Осталось только опубликовать нашу страницу. Теперь на нашем сайте WordPress есть круговая диаграмма, которая обновляется в режиме реального времени, когда кто-то отправляет нашу форму! Красиво летать! (На 99% нам жаль эту шутку).

    Не хотите столбчатую или круговую диаграмму? Без проблем! Блок диаграмм в Formidable позволяет переключаться между всеми типами диаграмм и таблиц одним щелчком мыши:

    • Круговая диаграмма
    • Гистограмма (столбиковая диаграмма)
    • Линейный график (линейный график)
    • График рассеяния
    • Диаграмма площади
    • Ступенчатая диаграмма
    • карта
    Типы диаграмм и графиков Formidable

    И Formidable не ограничивается созданием форм и диаграмм для WordPress. Премиум-плагин также включает в себя:

    • Адаптивные таблицы и диаграммы для любой темы (включая Elementor)
    • Интеграция с WooCommerce
    • Платежные шлюзы
    • конструктор приложений WordPress
    • И многое другое

    Один плагин, который делает все это? Впечатляющий!

    Готовы создавать диаграммы для WordPress?

    Не позволяйте диаграммам WordPress раздражать вас. Вместо этого просто установите Formidable Forms и используйте его мощные функции визуализации данных!

    Так что забудьте о поиске отдельного плагина для графиков или диаграмм. Для создания диаграмм в WordPress вам нужен только отличный конструктор форм WordPress.

    Получите грозные формы прямо сейчас!

    Но не забудьте подписаться на нас в Facebook, Twitter и YouTube, чтобы получать больше советов и рекомендаций по WordPress!

    Узнайте больше о диаграммах для WordPress


    Знаете ли вы, что Formidable Forms — самый продвинутый плагин форм WordPress из доступных? Попробуйте бесплатную версию для начала или раскройте все возможности с помощью нашего премиум-конструктора форм WordPress!