Что такое theme.json?

Theme.json — это файл конфигурации, представленный в версии 5.8 и выше WordPress, который содержит параметры и настройки для темы. Он предоставляет разработчикам тем возможность определить цвета, шрифты, размеры, стили кнопок и другие визуальные аспекты, а также настраивать блоки Gutenberg.

Основная фишка:

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

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

• Настройка цветов:
  В файле theme.json можно определить основные цвета темы, такие как основной цвет, вторичный цвет и т.д. Это позволяет легко изменять цветовую схему темы без необходимости вносить изменения в CSS-файлы. Пример использования:

{
  "settings": {
    "colors": {
      "primary": "#ff0000",
      "secondary": "#0000ff"
    }
  }
}

• Настройка типографии:
  С помощью theme.json можно настроить параметры типографии темы, такие как шрифт и размер текста. Пример использования:

{
  "settings": {
    "typography": {
      "fontFamily": "Arial, sans-serif",
      "fontSize": "16px"
    }
  }
}

• Настройка блоков Gutenberg:
  Theme.json позволяет настраивать стили и поведение различных блоков в редакторе блоков Gutenberg. Вы можете определить стили по умолчанию для блоков, изменить их настройки и поведение, а также добавить новые стили блоков. Пример использования:

{
  "blocks": {
    "core/paragraph": {
      "styles": {
        "color": "#333333"
      }
    },
    "core/button": {
      "styles": {
        "backgroundColor": "#ff0000",
        "color": "#ffffff"
      }
    }
  }
}

• Расширение функциональности:
  Theme.json позволяет расширять функциональность вашей темы, добавляя различные ключи и секции. Например, вы можете указать поддержку определенных функций WordPress, таких как миниатюры, пользовательские заголовки, пользовательские фоновые изображения и другие. Пример использования:

{
  "supports": {
    "align-wide": true,
    "responsive-embeds": true
  }
}

Вот пример простого файла theme.json для темы WordPress:

{
  "version": 1,
  "settings": {
    "colors": {
      "primary": "#ff0000",
      "secondary": "#0000ff"
    },
    "typography": {
      "fontFamily": "Arial, sans-serif",
      "fontSize": "16px"
    }
  },
  "blocks": {
    "core/paragraph": {
      "styles": {
        "color": "#333333"
      }
    },
    "core/button": {
      "styles": {
        "backgroundColor": "#ff0000",
        "color": "#ffffff"
      }
    }
  },
  "supports": {
    "align-wide": true,
    "responsive-embeds": true
  }
}

В этом примере:

• "version": указывает версию файла theme.json.
• "settings": определяет основные настройки темы, в данном случае цвета и типографику.
• "colors": определяет основные цвета темы, например, "primary" и "secondary".
• "typography": определяет параметры типографики, такие как шрифт и размер.
• "blocks": настраивает стили и параметры для различных блоков Gutenberg.
• "core/paragraph": определяет стили для блока параграфа.
• "core/button": определяет стили для блока кнопки.
• "supports": указывает поддерживаемые функции WordPress, такие как широкое выравнивание ("align-wide") и адаптивные встроенные элементы ("responsive-embeds").

Вот пример использования настроек из файла theme.json в коде темы WordPress:

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

// Получение значения цвета primary из настроек theme.json
$primary_color = get_theme_mod( 'primary_color', '#ff0000' );

// Использование полученного значения цвета в коде
echo '<div style="background-color: ' . $primary_color . ';">Пример контента</div>';

Использование типографии:

// Получение значения шрифта из настроек theme.json
$font_family = get_theme_mod( 'font_family', 'Arial, sans-serif' );
$font_size = get_theme_mod( 'font_size', '16px' );

// Использование полученных значений типографии в коде
echo '<p style="font-family: ' . $font_family . '; font-size: ' . $font_size . ';">Пример текста</p>';

Использование настроек блоков:

// Получение значения цвета параграфа из настроек theme.json
$paragraph_color = get_theme_mod( 'core/paragraph_color', '#333333' );

// Использование полученного значения цвета в коде блока параграфа
echo '<p style="color: ' . $paragraph_color . ';">Пример текста в блоке параграфа</p>';

// Получение значений стилей кнопки из настроек theme.json
$button_background_color = get_theme_mod( 'core/button_background_color', '#ff0000' );
$button_text_color = get_theme_mod( 'core/button_text_color', '#ffffff' );

// Использование полученных значений стилей в коде блока кнопки
echo '<button style="background-color: ' . $button_background_color . '; color: ' . $button_text_color . ';">Пример кнопки</button>';

Таким образом, вы можете использовать полученные значения из настроек theme.json в вашем коде, чтобы динамически применять внешний вид и стили к различным элементам и блокам вашей темы WordPress.

Заключение:

Файл theme.json является мощным инструментом, предоставляющим разработчикам тем более гибкий и централизованный способ настройки внешнего вида и функциональности темы. Он позволяет упростить процесс разработки и обновления тем, а также предоставляет возможность пользователям легко настраивать внешний вид темы. С использованием theme.json разработчики могут создавать более гибкие и настраиваемые темы WordPress, соответствующие потребностям пользователей.

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

Сообщение theme.json в WordPress — централизованная настройка тем появились сначала на Wiki | PWODEV.

Поиск плагина:

wp plugin search plugin_name

Вместо plugin_name напишите название Вордпресс плагина который хотите найти.

Установить и активировать:

wp plugin install plugin_name --activate

Обновить плагины WordPress

wp plugin update

Активировать все плагины:

wp plugin activate --all

По мере необходимиости буду дописывать эту шпаргалку по работе с плагинами вордпресс через командную строку

Сообщение Работа с плагинами в WP CLI появились сначала на Wiki | PWODEV.

Установка:

curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
chmod +x wp-cli.phar
sudo mv wp-cli.phar /usr/local/bin/wp

Готово, WP CLI установлено. Теперь чтобы проверить работает ли вордпрессная командная строка делаем следующую команду:

wp --info

Этой командой мы получим информацию о WP CLI.

Продолжение следует…

Сообщение Как установить WP CLI появились сначала на Wiki | PWODEV.

wp db search 'значение'

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

На официальном сайте имеется большее количество полезных параметров к этой команде.

Сообщение wp db search — поиск по всей базе данных появились сначала на Wiki | PWODEV.

• Plugin Name — Название плагина, которое отображается в списке плагинов в админке.
• Description — Описание плагина, тоже отображается в списке плагинов. Желательно не больше 140 символов.
• Plugin URL — Домашняя страница этого плагина.
• Author URI — Сайт автора плагина.
• Author — Имя автора.
• Version — Версия плагина. Пример: 1.0 или 1.0.5. Чтобы сравнить версию используем функцию: version_compare();
• Text Domain — код перевода плагина или домен локализации (пишется слитно через дефис). Пример «my-plugin«. Код должен совпадать с названием главного файла и папки плагина.
• Domain Path — путь к папке с переводом плагина. Должен начинаться с «/».
• License — Название лицензии
• License URI — Сыллка на лицензию

Правильный заголовок WordPress пример:

<?php
/*
Plugin Name:    Plugin Name
Description:    Plugin Description
Plugin URL:     http://wiki.pwodev.com

Author URI:     http://wiki.pwodev.com
Author:         Author Name

Version:        1.0.0
Text Domain:    plugin-name
Domain Path:    /languages

License:        GPL2
License URI:    https://www.gnu.org/licenses/gpl-2.0.html
*/

Заполнив эти данные вы увидите на странице плагинов свой новый плагин.

После этого можно писать свой код плагина.

На этом все. Если у вас есть вопросы или пожелания — пишите в комментариях. Регистрируйтесь у нас на сайте чтобы получить возможность дополнять наш проект своими статьями.

Сообщение Заголовок WordPress плагина появились сначала на Wiki | PWODEV.

Есть два способа скачать последнюю версию WordPress с помощью терминала или командной строки. Один способ это скачать с помощью гита (GIT) в этом случае мы скачиваем из официального репозитория альфа версию WP. Еще один способ это скачать последую версия через http. как бы через браузер. Ссылка на последнюю версию вордпресс: https://wordpress.org/latest.zip

1. Способ скачиваем по ссылке.

Я тестировал этот способ с помощью Терминала MAC. Заходим в нужную нам папку куда ходим скачать и установить install wordpress. Вводим следующую команду:

curl -O https://wordpress.org/latest.zip
unzip latest.zip
mv wordpress/* .
rm -R wordpress/
rm latest.zip
mv wp-config-sample.php wp-config.php

Что было сделано:

• curl… — скачали последнюю версию
• unzip… — разархивировали появилась папка wordpress
• mv… — переместили все из папки wordpress в текущую папку
• rm… — удалили папку wordpress
• rm… — удалили zip файл
• mv… — переименовали файл конфигурации

2. Способ WP GIT репозиторий.

Итак чтобы установить Вордпресс (install WordPress) из командной строки нам потребуется GIT. Собственно и все. Приступим:

• Открываем командную строку или терминал в маке.
• Заходим в нужную нам папку где хотим поместить последнюю версию WordPress
• Запускаем команду

git clone git://core.git.wordpress.org/ folder_name

folder_name — это папка в которую скачается вордпресс основываясь на текущей директории

• заходим в эту папку

cd folder_name

и удаляем .git

rm -rf .git/

Все последняя версия WP скачена. Теперь настроем ее.

wp-config

• Прежде чем начать нам нужно создать новую базу данных MySQL
• После того как создали базу данных, переименуем wp-config-sample.php → wp-config.php
• Редактируем wp-config.php
• Заполняем настройки MySQL
• Копируем содержимое из https://api.wordpress.org/secret-key/1.1/salt/ и заменяем в нужном месте в wp-config.php
• Изменяем $table_prefix = «wp_» на свой. Для примера «prefix_»

Установка

• Запускаем в баузере урл с нашим сайтом. Должно появиться окно установки.
• Идем по пунктам.

Удалить все темы:

find wp-content/themes/. -type d -exec rm -rf {} \;

Сообщение Install WordPress с помощью командной строки появились сначала на Wiki | PWODEV.

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

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

Примеры шорткода:

[shordcode]

[shordcode id='123']

[shordcode] текст [/shordcode]

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

add_shortcode( $tag , $func );

$tag (строка) (обязательный) — Название шоткода. Нельзя использовать нестандартные символы вроде: & / < > [ ] =.

$func (строка) (обязательный) — Название функции, которая отвечает за этот шоткод.

Функция получает 3 параметра:

1. $atts (массив) — Ассоциативный массив атрибутов указанных в шорткоде.
2. $content (строка) — Текст шорткода, когда используется закрывающая конструкция шорткода: [foo]текст шорткода[/foo]
3. $tag (строка) — Тег шорткода. Может пригодится для передачи в доп. функции. Пр: если шорткод — [foo], то тег будет — foo.
   По умолчанию: текущий тег

Примеры:

function shortcode_function(){
  return "Text from shortcode_function";
}
add_shortcode('shortcode_name', 'shortcode_function');

Результат этой функции при вводе в тексте в редакторе [shortcode_name] будет текст «Text from shortcode_function»

Чтобы вызвать этот шорткод в php коде вызываем функцию do_shortcode()

do_shortcode('[shortcode_name]');

На этом пока все. Если у вас есть дополнения по этой статье, оставляйте комментарии ниже.

Сообщение Добавляем шорткод в WordPress — add_shortcode появились сначала на Wiki | PWODEV.

Это делается в файлике php.ini параметром upload_max_filesize.  Я использую локальный сервер Mac OS и у меня этот файлик лежит по такому пути: /usr/local/etc/php/5.6/php.ini. У вас путь к файлу php.ini может отличаться.

Также помимо этого параметра, я изменил сразу 2 остальных. Это post_max_size и memory_limit.

upload_max_filesize — Устанавливает максимальный размер файла для закачки.

post_max_size — Устанавливает максимально допустимый размер данных, отправляемых методом POST.

memory_limit —  Устанавливает выполняемому скрипту максимальный обьем используемой памяти.

В итоге вот то что нам нужно изменить:

upload_max_filesize = 128M
post_max_size = 128M
memory_limit = 128M

После изменений в php.ini не забудьте перезагрузить сервер. Вот статья на как управлять локальным сервером. Пример как это делать в Mac OS:

sudo apachectl -k restart

Советы и дополнения оставляйте в комментариях.

Сообщение php.ini — Увеличить размер загружаемого файла появились сначала на Wiki | PWODEV.

Если есть только FTP доступ к сайту, и нужно подключиться к базе данных, а доступа к серверу MySQL нет, приходит на помощь эта замечательная PHP утилита Sypex Dumper. Ее можно использовать для бекапа базы данных, экспорта и импорта, а так же если нужно перенести сайт с одного сервера на другой.

Для работы утилиты Sypex Dumper нужно:

1. Скачиваем PHP утилиту Sypex Dumper — скачать последнюю версию можно тут.
2. Заливаем утилиту по FTP в корень сайта.
3. Иногда требуется прописать права 777 к папке и файлам которые мы залили по FTP.
4. В браузере в адресной строке вводим http://site/sxd — если папу утилиты назвали по другому то вводим название папки.
5. Открывается формочка ввода Пользователя и Пароля базы данных. DB User и DB Password к базе данных, если это WordPress, можно найти в корне в файлике wp-config.php. Там сохранены логин и пароль от базы данных MySQL
6. После того как мы подключились через утилиту Sypex Dumper к нашей базе данных SQL, можно делать необходимые нам манипуляции с базой.
7. После того как закончите пользоваться sxd утилитой, не забудьте удалить ее через FTP.

Сообщение Sypex Dumper — утилита для работы с базой MySQL появились сначала на Wiki | PWODEV.

Если у вас возникают такие вопросы, то скорее всего вы переписали часть ядра WordPress или плагина, что не рекомендуется, поэтому попробуйте создать свой плагин со своими изменениями, либо добавить все эти изменения напрямую в вашей теме, но если такой вариант вам не подходит, я объясню как все-же отключить обновления и все сообщения об обновлении.

Для начала открываем в теме файл function.php.

1. Чтобы отключить проверку обновления версии WordPress пишем следующий код:

add_filter('pre_site_transient_update_core',create_function('$a', "return null;")); 
wp_clear_scheduled_hook('wp_version_check');

2. Чтобы отключить проверку обновлений плагинов пишем этот код:

remove_action( 'load-update-core.php', 'wp_update_plugins' );
add_filter( 'pre_site_transient_update_plugins', create_function( '$a', "return null;" ) );
wp_clear_scheduled_hook( 'wp_update_plugins' );

3. Чтобы отключить проверку обновлений шаблонов вставляем этот код:

remove_action('load-update-core.php','wp_update_themes');
add_filter('pre_site_transient_update_themes',create_function('$a', "return null;"));
wp_clear_scheduled_hook('wp_update_themes');

4. Чтобы убрать пункт меню обновления нужен следующий код:

function remove_update_menu(){
 remove_submenu_page( 'index.php', 'update-core.php' );
}
add_action( 'admin_menu', 'remove_update_menu' );

Теперь в админке вашего WordPress больше не будет видны обновления.

Для удобства весь код который отключает все сразу:

add_filter('pre_site_transient_update_core',create_function('$a', "return null;"));
wp_clear_scheduled_hook('wp_version_check');

remove_action( 'load-update-core.php', 'wp_update_plugins' );
add_filter( 'pre_site_transient_update_plugins', create_function( '$a', "return null;" ) );
wp_clear_scheduled_hook( 'wp_update_plugins' );

remove_action('load-update-core.php','wp_update_themes');
add_filter('pre_site_transient_update_themes',create_function('$a', "return null;"));
wp_clear_scheduled_hook('wp_update_themes');

function remove_update_menu(){
 remove_submenu_page( 'index.php', 'update-core.php' );
}
add_action( 'admin_menu', 'remove_update_menu' );

На этом все, пишите комментарии 🙂

Сообщение Отключить автоматические обновления WordPress появились сначала на Wiki | PWODEV.