Skip to content

mrvi0/oyster-farm

Repository files navigation

Oyster Farm — WordPress Theme

Описание

Современная WordPress-тема для сайта гастроэкскурсий на устричную ферму. Поддерживает:

  • Кастомные типы записей (услуги, продукция)
  • Гибкую галерею с загрузкой множества фото
  • Гибкую форму заявки (Contact Form 7)
  • Глобальные контакты и соцсети через Customizer
  • Современный дизайн, адаптивность, чистый код

Структура темы

  • functions.php — регистрация CPT, метаполей, кастомайзер, скрипты
  • inc/custom-fields.php — метабоксы для главной страницы (герой, отзывы, галерея, форма)
  • page-home.php — шаблон главной страницы (вывод всех секций)
  • style.css — все стили темы (адаптив, переменные, сетки, кнопки, формы)
  • header.php / footer.php — шапка и подвал, динамические контакты, меню

Главная страница (page-home.php)

Секции:

  1. Hero — заголовок, подзаголовок, кнопка, фон (редактируется через метабокс)
  2. Услуги — выводятся из CPT service (меню "Услуги" в админке)
  3. Продукция — выводится из CPT product (меню "Продукция" в админке)
  4. Отзывы — редактируются через метабокс на главной
  5. Галерея — массив фото через метабокс (WP media uploader), выводится masonry/grid
  6. Форма заявки — Contact Form 7, выводится через шорткод (метабокс)

Кастомные типы записей (CPT)

Услуги (service)

  • Меню "Услуги" в админке
  • Поля: название, описание, миниатюра, цена, иконка (FontAwesome)
  • Выводятся на главной в секции "Наши услуги"

Продукция (product)

  • Меню "Продукция" в админке
  • Поля: название, описание, миниатюра, цена
  • Выводятся на главной в секции "Продукция"

Галерея

  • Находится в метабоксе "Галерея (несколько фото)" на главной странице
  • Используется стандартный WP media uploader (можно выбрать любое количество фото)
  • Порядок фото задаётся порядком выбора (или можно менять в медиабиблиотеке)
  • На фронте: masonry/grid, вертикальный скролл, lightbox при клике

Контакты и соцсети

  • Все контакты (адрес, телефон, соцсети) задаются через Customizer ("Настроить")
  • Телефон и адрес автоматически подставляются в хедер и футер, кликабельны
  • Соцсети (VK, Telegram, Instagram) — отдельные поля, выводятся иконками (FontAwesome)

Форма заявки (Contact Form 7)

  • Шорткод формы указывается в метабоксе на главной
  • Стилизация формы полностью через style.css (см. .wpcf7, .wpcf7-form ...)
  • Рекомендуемый минималистичный код формы:
    [text* your-name placeholder "Ваше имя"]
    [tel* your-phone placeholder "+7 (___) ___-__-__"]
    [number* your-people min:1 max:20 placeholder "Количество человек"]
    [acceptance your-privacy] Я согласен с политикой конфиденциальности
    [submit class:booking-form-submit "Записаться"]
    
  • Письмо на почту — можно использовать HTML-шаблон (см. пример в истории чата)

Стилизация

  • Все стили в style.css, используются CSS-переменные для цветов, шрифтов, радиусов
  • Секции, карточки, кнопки, формы — всё адаптивно и современно
  • Галерея — masonry/grid, без отступов, lightbox
  • Форма — стилизована под современный UX, кнопка яркая, поля крупные

Кастомизация

  • Цвета, шрифты, радиусы — через переменные в style.css
  • Контакты и соцсети — через Customizer
  • Контент секций — через метабоксы или CPT
  • Галерея — через метабокс на главной
  • Форма — через Contact Form 7 (шорткод в метабоксе)

Email-уведомления

  • Рекомендуется использовать HTML-шаблон письма (см. пример выше)
  • Можно добавить свою рекламу/подпись в письмо (например, ссылку на Telegram)
  • Все поля формы можно вставлять в письмо через [shortcode]

FAQ

Q: Как добавить услугу/товар? A: В админке WordPress — раздел "Услуги" или "Продукция" → "Добавить новую".

Q: Как добавить фото в галерею? A: Откройте главную страницу в редакторе, найдите метабокс "Галерея (несколько фото)", выберите изображения через "Выбрать изображения".

Q: Как изменить контакты/соцсети? A: В админке WordPress → "Внешний вид" → "Настроить" → "Контакты".

Q: Как изменить форму? A: В админке WordPress → "Contact Form 7" → выберите нужную форму, отредактируйте поля, скопируйте шорткод в метабокс на главной.

Q: Как изменить стили? A: Все стили в style.css. Можно править переменные :root или отдельные блоки.


Поддержка и реклама

Тему разработал: Mr Vi

Если нужна доработка, поддержка или новый сайт — пиши в Telegram!


Лицензия

MIT (или любая другая по желанию)