Skip to content

Latest commit

 

History

History
322 lines (262 loc) · 21.2 KB

File metadata and controls

322 lines (262 loc) · 21.2 KB

Пояснительная записка - Post Wall v2.2.2

Общее описание проекта

Post Wall — это полноценный WordPress плагин версии 2.2.2, предназначенный для визуализации активности публикаций на сайте в виде интерактивной календарной диаграммы (heat map). Плагин создает кафельную стенку постов, отображающую интенсивность публикаций по дням с возможностью детализации по месяцам и годам.

Назначение

Плагин позволяет администраторам и посетителям сайта наглядно видеть:

  • Динамику публикаций контента за различные периоды
  • Наиболее активные и наименее активные дни
  • Временные тренды в создании контента
  • Быстро переходить к архивам постов за конкретные периоды

Техническая архитектура

Основные компоненты

1. Ядро плагина (postwall.php)

  • Класс PostWall: Основной класс плагина, реализующий паттерн Singleton
  • Константы:
    • POSTWALL_PLUGIN_PATH: Абсолютный путь к папке плагина
    • POSTWALL_PLUGIN_URL: URL к папке плагина
    • POSTWALL_PLUGIN_VERSION: Версия плагина (2.2.0)

2. API обработчик (includes/class-postwall-api.php)

Класс PostWall_API - центральный компонент для работы с данными:

  • Получение постов через WordPress REST API
  • Прямой доступ к базе данных для текущего сайта
  • Кэширование данных (время жизни: 3600 секунд)
  • Поддержка фильтрации по годам и периодам
  • Обработка ошибок API
  • Проверка доступности внешних API

Ключевые методы:

  • get_posts_from_site() - получение постов с внешних сайтов
  • get_posts_from_current_site() - получение постов с текущего сайта
  • get_post_stats() - получение статистики по дням
  • get_available_years() - получение списка доступных годов
  • check_api_availability() - проверка доступности API

3. AJAX обработчик (includes/class-ajax-handler.php)

Класс PostWall_Ajax_Handler - обработка асинхронных запросов:

  • Безопасная валидация входных данных
  • Проверка nonce токенов для защиты от CSRF
  • Передача данных о постах во фронтенд
  • Обработка ошибок и возврат JSON ответов

4. Регистрация Gutenberg блока (includes/block-registration.php)

  • Регистрация динамического блока postwall/post-wall
  • Атрибуты блока: siteUrl, headingTag, selectedYear
  • Серверный рендеринг HTML разметки
  • Извлечение доменов из URL
  • Генерация локализованных заголовков

Фронтенд архитектура

5. JavaScript компоненты

Основной файл (build/frontend.js):

  • Класс PostWall: Главный класс для управления визуализацией
  • Функциональность:
    • Интерактивная календарная сетка
    • AJAX загрузка данных
    • Обработка кликов по дням и месяцам
    • Генерация URL для архивов
    • Локализованные подсказки
    • Поддержка темной темы

6. CSS стили (build/style-index.css)

  • Адаптивный дизайн (CSS Grid)
  • Цветовая схема для уровней активности (0-4)
  • Поддержка темной темы
  • Hover эффекты
  • Responsive breakpoints для мобильных устройств

Система локализации

Поддерживаемые языки

  • Русский (ru_RU): Полная локализация с учетом форм множественного числа
  • Английский (en_US): Базовый язык интерфейса

Файлы локализации

  • postwall.pot - шаблон для переводов
  • postwall-ru_RU.po/.mo - русские переводы
  • postwall-en_US.po/.mo - английские переводы

Функциональные возможности

Основные функции

1. Календарная визуализация

  • Формат отображения: Сетка месяцев с календарем 7×6 (неделя × неделя в месяце)
  • Уровни активности: 5 уровней (0-4) на основе количества постов за день
  • Цветовая схема:
    • Уровень 0: Отсутствие постов (светло-зеленый)
    • Уровень 1: 1 пост (зеленый)
    • Уровень 2: 2 поста (темно-зеленый)
    • Уровень 3: 3-4 поста (насыщенный зеленый)
    • Уровень 4: 5+ постов (темно-насыщенный зеленый)

2. Выбор временного периода

  • Последние 12 месяцев: Динамический период от текущей даты
  • Конкретный год: Выбор из доступных лет публикаций
  • Автоматическая адаптация: Обновление заголовков и данных в зависимости от выбранного периода

3. Интерактивность

  • Кликабельные дни: Переход к архиву постов за конкретную дату
  • Кликабельные месяцы: Переход к архиву постов за месяц
  • Подсказки (tooltips): Отображение количества постов и их заголовков при наведении
    • Если пост один: заголовок отображается в одну строчку с датой и количеством
    • Если постов несколько: заголовки отображаются друг над другом
  • Адаптивные ссылки: Генерация правильных URL для архивов WordPress

4. Гибкость отображения

  • Настройка заголовков: Выбор тега заголовка (h1-h6, div)
  • Динамические заголовки: Автоматическое формирование с доменом сайта
  • Локализация интерфейса: Полный перевод на поддерживаемые языки

Технические особенности

1. Производительность

  • Кэширование: Автоматическое кэширование данных на 1 час
  • Версионирование: Использование filemtime для обновления кэша браузера
  • Оптимизация запросов: Минимизация количества API вызовов
  • Ленивая загрузка: Загрузка данных только при необходимости

2. Безопасность

  • CSRF защита: Проверка nonce токенов
  • Валидация данных: Проверка форматов URL и годов
  • Санитизация: Очистка всех входных данных
  • Обработка ошибок: Безопасная обработка API ошибок

3. Совместимость

  • WordPress: 5.0+
  • PHP: 7.4+
  • Gutenberg: Поддержка современного редактора блоков
  • REST API: Интеграция с WordPress API
  • Темы: Совместимость с большинством WordPress тем

Пользовательский интерфейс

Редактор Gutenberg

При добавлении блока в редактор доступны настройки:

  • URL сайта: Поле для ввода адреса сайта для анализа
  • Год: Селектор выбора периода (последние 12 месяцев или конкретный год)
  • Тег заголовка: Выбор HTML тега для заголовка блока

Фронтенд отображение

  • Заголовок: Автоматически генерируемый с названием сайта и периодом
  • Календарная сетка: Визуальное представление активности публикаций
  • Интерактивные элементы: Кликабельные дни и месяцы
  • Подсказки: Информация при наведении на дни
  • Состояния загрузки: Индикаторы загрузки данных

Структура файлов проекта

postwall/
├── postwall.php                    # Основной файл плагина
├── sol.md                          # Инструкция по разработке
├── pz.md                           # Пояснительная записка (этот файл)
├── includes/                       # Вспомогательные PHP классы
│   ├── class-assets-manager.php    # Менеджер ресурсов
│   ├── class-ajax-handler.php      # AJAX обработчики
│   ├── class-postwall-api.php      # API для работы с данными
│   └── block-registration.php      # Регистрация Gutenberg блока
├── assets/                         # Исходные файлы
│   ├── css/                        # Стили
│   │   └── frontend.css
│   └── js/                         # JavaScript
│       └── frontend.js
├── build/                          # Собранные файлы
│   ├── frontend.js                 # Собранный фронтенд JavaScript
│   ├── index.js                    # JavaScript для Gutenberg редактора
│   ├── style-index.css             # Собранные стили
│   └── index.css                   # Стили для редактора
└── languages/                      # Файлы локализации
    ├── postwall.pot               # Шаблон переводов
    ├── postwall-ru_RU.po          # Русские переводы
    ├── postwall-ru_RU.mo          # Скомпилированные русские переводы
    ├── postwall-en_US.po          # Английские переводы
    └── postwall-en_US.mo          # Скомпилированные английские переводы

API и интеграция

WordPress REST API интеграция

Плагин взаимодействует с WordPress REST API для получения данных о постах:

  • Endpoint: /wp-json/wp/v2/posts
  • Параметры: Фильтрация по дате (after, before), количество (per_page)
  • Обработка: Проверка статуса ответа, парсинг JSON данных

Внутренние WordPress хуки

  • init - регистрация блока и ресурсов
  • enqueue_block_editor_assets - подключение ресурсов редактора
  • wp_enqueue_scripts - подключение фронтенд ресурсов
  • wp_ajax_postwall_get_post_data - AJAX обработчик для авторизованных
  • wp_ajax_nopriv_postwall_get_post_data - AJAX обработчик для всех пользователей

Особенности разработки

Код стандарты

  • PSR-4 совместимость для автозагрузки
  • WordPress Coding Standards для PHP кода
  • ECMAScript 6+ для JavaScript
  • CSS Grid и Flexbox для макетов
  • JSDoc документация для JavaScript функций

Отладка и логирование

  • Обработка всех возможных ошибок API
  • Валидация входных данных на всех уровнях
  • Graceful degradation при недоступности внешних ресурсов
  • Информативные сообщения об ошибках для пользователей

Эксплуатационные требования

Минимальные требования

  • WordPress: 5.0 или выше
  • PHP: 7.4 или выше
  • MySQL: 5.6 или выше
  • JavaScript: Включен в браузере
  • REST API: Должен быть доступен на анализируемых сайтах

Рекомендуемые настройки

  • PHP memory_limit: 128MB или выше
  • WordPress кэширование: Рекомендуется для производительности
  • HTTPS: Для безопасной работы с внешними API
  • Gzip сжатие: Для оптимизации загрузки ресурсов

Развитие и поддержка

История версий

  • v1.0.0: Базовая функциональность отображения календаря
  • v2.0.0: Переход на Gutenberg блоки, улучшенная архитектура
  • v2.1.2: Добавление выбора года
  • v2.2.0: Кликабельные месяцы, улучшенная локализация
  • v2.2.1: Исправление бага с отображением месяцев в календаре (feb/mar issue)
  • v2.2.2: Добавление заголовков постов в тултипы

Планы развития

  • Поддержка дополнительных языков
  • Настройка цветовых схем
  • Экспорт данных в различных форматах

История исправлений

v2.2.2 (Дата текущая)

Добавленная функциональность:

  • Заголовки постов в тултипах: В подсказках при наведении на день теперь отображаются не только дата и количество постов, но и заголовки самих постов
  • Умное форматирование:
    • Если пост один - заголовок отображается в одну строчку с датой и количеством
    • Если постов несколько - заголовки отображаются друг над другом для удобства чтения
  • Улучшенная структура данных: Изменена структура данных API для хранения заголовков постов вместе с количеством
  • Затронутые файлы:
    • includes/class-postwall-api.php - изменена структура возвращаемых данных статистики
    • assets/js/frontend.js - обновлен метод formatTooltip() и обработка данных
    • build/frontend.js - обновлен собранный файл
  • Обратная совместимость: Код поддерживает как новую, так и старую структуру данных для плавного перехода

v2.2.1 (30.11.2025)

Исправленные баги:

  • Критический баг с отображением месяцев: Исправлена проблема, когда в календаре вместо февраля второй раз отображался март
  • Причина бага: Метод JavaScript setMonth() ведет себя непредсказуемо при переходе через год (например, с декабря на январь)
  • Решение: Заменено использование setMonth() на создание новых объектов Date через new Date(year, month, 1)
  • Затронутые файлы:
    • assets/js/frontend.js - исходный код
    • build/frontend.js - собранный файл
  • Влияние: Календарь теперь корректно отображает все 12 месяцев без дублирования
  • Тестирование: Проведено автоматическое тестирование с проверкой на дубли месяцев

Безопасность и соответствие

Меры безопасности

  • CSRF защита: Все AJAX запросы защищены nonce токенами
  • SQL Injection: Использование подготовленных запросов WordPress
  • XSS защита: Санитизация всех выходных данных
  • Валидация данных: Проверка всех входных параметров

Соответствие стандартам

  • WordPress Plugin Guidelines: Соблюдение официальных рекомендаций
  • GDPR: Плагин не собирает персональные данные
  • Accessibility: Поддержка клавиатурной навигации и скринридеров

Установка и настройка

Установка

  1. Загрузить папку плагина в /wp-content/plugins/
  2. Активировать плагин через админ-панель WordPress
  3. Блок "Post Wall" станет доступен в редакторе Gutenberg

Настройка

  1. Добавить блок "Post Wall" на страницу
  2. В настройках блока указать URL сайта для анализа
  3. Выбрать период отображения (последние 12 месяцев или конкретный год)
  4. Настроить внешний вид заголовка при необходимости

Использование

Основные сценарии

  1. Мониторинг активности: Отслеживание интенсивности публикаций
  2. Планирование контента: Анализ лучших периодов для публикаций
  3. Презентация статистики: Демонстрация активности сайта клиентам
  4. Архивный обзор: Быстрый доступ к публикациям за определенные периоды

Примеры использования

  • Блог о путешествиях: отслеживание частоты публикации отчетов
  • Новостной сайт: мониторинг ежедневной активности журналистов
  • Корпоративный блог: анализ контент-стратегии
  • Портфолио: демонстрация регулярности обновлений

Заключение

Post Wall v2.2.0 представляет собой комплексное решение для визуализации активности публикаций на WordPress сайтах. Плагин сочетает в себе современные технологии веб-разработки, продуманную архитектуру и удобный пользовательский интерфейс. Благодаря поддержке Gutenberg блоков, полной локализации и оптимизированной производительности, плагин подходит как для личных блогов, так и для корпоративных сайтов.

Проект демонстрирует современный подход к разработке WordPress плагинов с использованием лучших практик программирования, обеспечением безопасности и вниманием к пользовательскому опыту.


Разработчик: Владимир Бычко Email: vladimir@bychko.ru Веб-сайт: https://bychko.ru Версия документа: 1.0 Дата: 19 ноября 2025