WordPress – полезные фишки, трюки и коды
Размер текста: A+ A-

WordPress – полезные фишки, трюки и коды

Нажмите, чтобы оценить наш труд:
[Всего: 1 Средняя: 5]

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

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

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

Ссылки на другие наши записи по этой же теме, где прочие вопросы были рассмотрены более подробно:

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

Содержание скрыть

Как узнать ID поста, рубрики и автора ?

Все довольно просто, прямо из админки сайта.

ID поста в WordPress или страницы легко увидеть так:

  1. Откройте список Все записи (или Все страницы).
  2. Наведите курсор на название нужного поста.
  3. Посмотрите в левый нижний угол браузера — там появится ссылка вида post.php?post=12345. Число после post= и есть ID .

Ещё проще: откройте пост на редактирование и посмотрите на адресную строку — там то же самое post=12345 .

ID рубрики в WordPress или страницы легко увидеть так:

  1. Перейдите в Рубрики (или Метки).
  2. Наведите мышь на название нужной рубрики.
  3. В левом нижнем углу увидите ссылку с tag_ID=123 (для меток аналогично). Это и есть ID 

ID пользователя в WordPress или страницы легко увидеть так:

  1. Зайдите в Пользователи → Все пользователи.
  2. Наведите курсор на имя нужного пользователя.
  3. В ссылке ищите параметр user_id=123 .

Вывод изображения в записи, если тема его не выводит.

Простой код, где цифры в (512, 288 – width="512" height="288") – размеры изображения. Чтобы вывести изображение отдельной записи, если тема не показывает, нужно добавить в файл single.php:

<?php
// Получаем текущий пост
global $post;

// Получаем все прикрепленные изображения к текущему посту
$attachments = get_attached_media( 'image', $post->ID );

// Проверяем, есть ли прикрепленные изображения
if ( $attachments ) {
// Перебираем прикрепленные изображения
foreach ( $attachments as $attachment ) {
// Получаем URL изображения
$image_url = wp_get_attachment_image_src( $attachment->ID, 'full' );

// Проверяем, что URL изображения существует
if ( $image_url ) {
// Выводим изображение после заголовка H1
echo '<div style="text-align: center;">'; // Открываем блок с центрированием
echo '<img src="' . $image_url[0] . '" width="" height="" alt="' . get_the_title() . '">';
echo '</div>'; // Закрываем блок с центрированием
break; // Прерываем цикл после вывода первого изображения
}
}
}
?>

Вывести метки (теги) после записи, если тема не поддерживает

Для этого нужно добавить код, например, в single.php:

<?php
if ( has_tag() ) {
echo '<div class="post-tags">';
the_tags( '<ul><li>', '</li><li>', '</li></ul>' );
echo '</div>';
}
?>

Запреты индексации

Что закрыть от поисковых систем нежелательные страницы, нужно добавить эти коды в functions.php:

// Запрет индексации страницы тегов
function noindex_tag_archive() {
if ( is_tag() ) {
echo '<meta name="robots" content="noindex,follow" />' . "\n";
}
}
add_action( 'wp_head', 'noindex_tag_archive' );

// Запрет индексации страницы архива
function noindex_archive_page() {
if ( is_archive() ) {
echo '<meta name="robots" content="noindex,follow" />' . "\n";
}
}
add_action( 'wp_head', 'noindex_archive_page' );

// Запрет индексации страницы поиска
function noindex_search_page() {
if ( is_search() ) {
echo '<meta name="robots" content="noindex,follow" />' . "\n";
}
}
add_action( 'wp_head', 'noindex_search_page' );

// Запрет индексации страницы календаря
function noindex_calendar_page() {
if ( is_date() ) {
echo '<meta name="robots" content="noindex,follow" />' . "\n";
}
}
add_action( 'wp_head', 'noindex_calendar_page' );

Как очистить базу данных через phpMyAdmin ?

Как очистить базу данных через phpMyAdmin от тем (шаблонов), которые больше не использую, но были ранее использованы ?

Если просмотреть свою базу данных, то там вы найдете, что прописаны ваши прошлые темы сайта, хотя их уже нет и они удалены. К примеру ваша тема называется “MyTheme” (поставьте сюда свое точное значение, обычно оно совпадает с именем папки). Напишем код SQL запроса:

DELETE FROM wp_options WHERE option_name LIKE 'theme_mods_%' AND option_name NOT LIKE 'theme_mods_MyTheme';

Как очистить базу WordPress от ранее использованных плагинов ?

Как очистить базу WordPress от ранее использованных плагинов, которые сейчас не активны ? Это можно сделать с помощью SQL запроса в phpMyAdmin. Вот пример такого запроса:

DELETE FROM wp_options WHERE option_name LIKE '%_transient_%';
DELETE FROM wp_options WHERE option_name LIKE '%_site_transient_%';

Этот SQL запрос удаляет из таблицы wp_options все записи, связанные с временными данными (transients), которые могли оставаться после удаления или отключения плагинов.

Как избавиться от редиректа на localhost ?

Почему происходит редирект на https://localhost/www/wp-login.php когда все файлы уже на хостинге ? Вы можете изменить адрес сайта напрямую в базе данных WordPress через phpMyAdmin, следуя этим шагам:

  1. Войдите в phpMyAdmin и выберите базу данных, связанную с вашим сайтом WordPress.
  2. Найдите таблицу с названием wp_options (префикс wp_ может отличаться в вашей установке WordPress, поэтому убедитесь, что используете правильный префикс).
  3. В таблице wp_options найдите записи с option_name, которые имеют значения siteurl и home. Эти записи содержат текущие URL вашего сайта.
  4. Нажмите на значок редактирования (обычно это иконка карандаша) рядом с каждой из этих записей.
  5. Введите правильный URL вашего сайта в поле option_value для обеих записей (siteurl и home).
  6. Нажмите кнопку “OK” или “Сохранить”, чтобы сохранить изменения.

Проблема с изображениями после переноса с локального сервера localhost

При переносе с локального сервера localhost на хостинг некоторые вставленные в записи фотографии перестали открываться, url у них прописан как “http://localhost/www/wp-content/uploads/и так далее”. Можно исправить неправильные URL изображений в базе данных WordPress через phpMyAdmin, следуя этим шагам:

  1. Войдите в phpMyAdmin и выберите базу данных, связанную с вашим сайтом WordPress.
  2. Найдите таблицу wp_posts. Обычно это таблица с названием wp_posts, но префикс wp_ может отличаться в вашей установке WordPress.
  3. Выполните SQL-запрос для обновления всех записей, содержащих неправильные URL изображений. Запрос должен выглядеть примерно так:
UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://localhost/www/wp-content/uploads/2024/05/', 'https://yourdomain.com/wp-content/uploads/2024/05/');

Здесь меняем http://localhost/www/wp-content/uploads/2024/05/ на то что у вас и yourdomain.com на ваш URL.

Вывод текста в зависимости от рубрики

Как в WordPress сделать так, чтобы  в зависимости от названия метки рубрики (та что в URL на английском), выводился разный текст. Напишем PHP код:

<?php
// Получаем название текущей метки рубрики из URL
$category_slug = get_query_var('category_name');

// Проверяем значение метки рубрики и выводим соответствующий текст
if ($category_slug === 'category1') {
echo "Текст для категории 1";
} elseif ($category_slug === 'category2') {
echo "Текст для категории 2";
} elseif ($category_slug === 'category3') {
echo "Текст для категории 3";
} else {
echo "Текст по умолчанию";
}
?>

 

Вывод текста только на одной главной странице сайта

WordPress. Как вывести текст только на одной главной странице сайта ? Чтобы вывести текст только на одной главной странице сайта, вы можете воспользоваться условием, проверяющим текущую страницу. Вставьте этот PHP-код в нужное место:

<?php
// Проверяем, является ли текущая страница главной и не является ли страницей пагинации
if ( is_front_page() && !is_paged() ) {
// Выводим текст только на главной странице
echo "Текст для главной страницы";
}
?>

Если не работает, вот второй вариант. Добавляем в файл functions.php:

function is_desktop() {
return wp_is_mobile() ? false : true;
}

Затем в файл index.php в нужное место добавляем условие:

<?php if ( is_desktop() ) : ?>
...ваш код только для главной страницы...
<?php endif; ?>

Вывод иконки (favicon)

Как вывести в браузере иконку сайта (favicon), чтобы код учитывал все возможные варианты размеров и форматов. Для этого разместите в файле header.php в любом месте до закрывающего тега </head> этот код:

<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-48x48.png" sizes="48x48">
<link rel="icon" type="image/png" href="/favicon-64x64.png" sizes="64x64"><link rel="icon" href="/favicon.ico" type="image/x-icon">

Этот код добавляет несколько ссылок на изображения favicon различных размеров. Браузеры будут выбирать наиболее подходящее изображение в зависимости от разрешения экрана и других факторов. Убедитесь, что файлы favicon с такими размерами действительно существуют и доступны по указанным URL-адресам на вашем сервере.

Удаление версии WordPress из исходного кода

Как удалить версию WordPress из исходного кода ? Чтобы удалить эту информацию, добавьте следующий код в файл functions.php вашей темы:

remove_action('wp_head', 'wp_generator');

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

Как скрыть панели администрирования для не администраторов в WordPress ? Чтобы панель администрирования отображалась только для администраторов, добавьте следующий код в файл functions.php:

if (!current_user_can('administrator')) {
show_admin_bar(false);
}

Добавление миниатюр к RSS

Как добавить миниатюры к записям в RSS-ленту ? Если вы хотите, чтобы миниатюры отображались в RSS-ленте, добавьте этот код в файл functions.php:

function add_featured_image_to_feed($content) {
global $post;
if (has_post_thumbnail($post->ID)) {
$content = '<p>' . get_the_post_thumbnail($post->ID, 'thumbnail') . '</p>' . $content;
}
return $content;
}
add_filter('the_excerpt_rss', 'add_featured_image_to_feed');
add_filter('the_content_feed', 'add_featured_image_to_feed');

Количество ревизий у постов

Как ограничить количество ревизий записей ? WordPress по умолчанию сохраняет все ревизии записей, что может со временем увеличить размер базы данных. Чтобы ограничить количество ревизий, добавьте следующий код в файл wp-config.php:

define('WP_POST_REVISIONS', 1);

Значение 1 означает, что будет сохраняться только одна последняя редакция, но вы можете поставить 2 или сколько вам нужно. Этот подход позволит эффективно удалить лишние данные и оптимизировать базу данных.

Перенаправление на URL после входа

Как сделать перенаправление пользователей после входа в систему ? Чтобы перенаправить пользователей на определенную страницу после входа в систему, добавьте этот код в файл functions.php:

function custom_login_redirect($redirect_to, $request, $user) {
// Проверяем роль пользователя
if (isset($user->roles) && is_array($user->roles)) {
if (in_array('administrator', $user->roles)) {
// Перенаправление для администраторов
return admin_url();
} else {
// Перенаправление для всех остальных
return home_url();
}
}
return $redirect_to;
}
add_filter('login_redirect', 'custom_login_redirect', 10, 3);

Автоматическое удаление мусора

Как организовать в WordPress автоматическое удаление мусора ? WordPress периодически создает мусорные записи, такие как авто-сохранения и ревизии. Чтобы настроить автоматическое удаление мусора, добавьте следующий код в файл wp-config.php:

define('EMPTY_TRASH_DAYS', 7); // Количество дней, после которых мусор будет автоматически удален

Скрытие ненужной колонки в админке

Как в WordPress удалить (скрыть) ненужную колонку на странице записей в админке сайта ?

Допустим, какой-то плагин добавил свою колонку на страницу записей, которая вам не нужна, и которая портит читаемость названий записей. Чтобы убрать ненужную колонку, нужно посмотреть в коде страницы как эта колонка обозначена.

Например, плагин “Contextual Related Posts” (похожие записи) добавил свою колонку. Смотрим исходный код страницы (CTRL+U) и видим следующее:

<td class='crp_columns column-crp_columns' data-colname="Contextual Related Posts">
function hide_crp_column() {
echo '<style>
.column-crp_columns { display: none !important; }
</style>';
}
add_action('admin_head', 'hide_crp_column');

Добавьте этот код в functions.php. Колонка была убрана из страницы записей посредством ее скрытия при помощи CSS: скрыт класс column-crp_columns.

Удаление ссылок “следующая” и “предыдущая “

Как удалить из темы ссылки в конце поста, типа “следующая запись и предыдущая запись” ?

Это может быть не совсем простой задачей, так как все темы и шаблоны различаются и используют различные методы вывода этих ссылок. Приведем все возможные варианты:

Удаление через файл темы (single.php или content-single.php). Найдите строку, содержащую функции:

the_post_navigation();

или

previous_post_link();
next_post_link();

Удалите эти строки или закомментируйте их.

Отключение через файл functions.php. Если вы не хотите редактировать шаблоны напрямую, добавьте код в файл functions.php вашей темы или дочерней темы:

add_filter('the_post_navigation', '__return_empty_string');

Если не работает, и вы немного разбираетесь в PHP, то добавьте этот код functions.php, замените your_navigation_function на название функции, которая отвечает за вывод навигации. Найти её можно, изучив код файла single.php или других связанных файлов:

remove_action('template_redirect', 'your_navigation_function');

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

Если ничего вышесказанное не сработало, попробуйте глобально отключить все виды навигации. Добавьте в functions.php следующий код:

remove_action('wp_footer', 'the_post_navigation'); // Удаление из подвала
remove_action('wp_head', 'the_post_navigation'); // Удаление из шапки
remove_action('template_redirect', 'the_post_navigation'); // Отключение навигации

Например, для платной (и бесплатной версии) шаблона Astra работает такой код:

add_action('init', function() {
remove_all_actions('astra_entry_after');
});

Удаление старых ревизий

Как удалить старые ревизии записей в WordPress ? У некоторых постов скопились по несколько ревизий (правок), которые были сделаны давно и более не актуальны.

Лучшее решение удаления всех ревизий записей в WordPress будет очистка редакций через SQL-запрос.

  1. Сделайте резервную копию базы данных, на всякий случай.
  2. Войдите в phpMyAdmin или подключитесь к базе данных через консоль.
  3. Выполните следующий SQL-запрос:
DELETE FROM wp_posts 
WHERE post_type = 'revision' 
AND ID NOT IN (
SELECT MAX(ID) 
FROM wp_posts 
WHERE post_type = 'revision' 
GROUP BY post_parent
);
  • Удаляются все записи типа revision, кроме последних редакций для каждой записи (post_parent).
  • Предполагается, что таблицы имеют префикс wp_. Если у вас другой префикс, замените wp_ на свой префикс.

Дальше желательно сделать отключение будущих редакций, смотри пункт 14 в нашем обзоре (выше).

Очистка БД от мусора

Как очистить базу данных WordPress от мусора чтобы ее немного ускорить ? Какие именно вещи можно очистить (удалить) ?

Выше мы уже рассмотрели, как сделать:

  • См. пункт 4. “Как очистить базу данных через PHPMyAdmin от тем (шаблонов), которые больше не использую, но были ранее использованы ?”
  • См. пункт 5. “Как очистить базу WordPress от ранее использованных плагинов, которые сейчас не активны ?”

Еще можно удалить следующие ненужные данные:

Неиспользуемые метаданные постов и комментариев – иногда плагины и темы оставляют “мусорные” метаданные. В phpMyAdmin выполните SQL запрос:

DELETE pm FROM wp_postmeta pm
LEFT JOIN wp_posts wp ON wp.ID = pm.post_id
WHERE wp.ID IS NULL;

DELETE cm FROM wp_commentmeta cm
LEFT JOIN wp_comments wc ON wc.comment_ID = cm.comment_id
WHERE wc.comment_ID IS NULL;

Сессионные данные в wp_options. Иногда база wp_options забивается временными данными. Очистка временных значений:

DELETE FROM wp_options WHERE option_name LIKE '_transient_%';

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

DELETE t, tt FROM wp_terms t
INNER JOIN wp_term_taxonomy tt ON t.term_id = tt.term_id
LEFT JOIN wp_term_relationships tr ON tt.term_taxonomy_id = tr.term_taxonomy_id
WHERE tr.object_id IS NULL;

Оптимизация таблиц базы WordPress. После очистки необходимо оптимизировать таблицы для лучшей производительности. Вот SQL-команда:

OPTIMIZE TABLE wp_posts, wp_postmeta, wp_comments, wp_commentmeta, wp_terms, wp_term_taxonomy, wp_term_relationships, wp_options;

Отложенная загрузка фото

Отложенная загрузка изображений (Lazy Load) для скорости сайта.

Google учитывает скорость загрузки (Core Web Vitals). Этот код добавляет атрибут loading="lazy" ко всем изображениям и iframe, ускоряя загрузку страницы.

// Добавить в functions.php
function add_lazy_loading_to_content($content) {
if (is_feed() || is_admin()) return $content;
if (false === strpos($content, 'img src=') && false === strpos($content, 'iframe src=')) return $content;
$content = preg_replace_callback('/<(img|iframe)\s+([^>]+?)(?:\s*\/)?>/i', function($matches) {
if (false !== strpos($matches[2], 'loading=')) {
return $matches[0];
}
return '<' . $matches[1] . ' loading="lazy" ' . $matches[2] . '>';
}, $content);
return $content;
}
add_filter('the_content', 'add_lazy_loading_to_content', 10);/* Your code... */

Автоматическая разметка Schema

Автоматическая разметка Schema для хлебных крошек (навигации по структуре сайта).

Структурированные данные помогают Google лучше понимать сайт. Если у вас нет плагина, этот код добавит разметку BreadcrumbList.

// Добавить в functions.php (работает с Yoast или Rank Math, если они не переопределяют)
add_action('wp_head', function() {
if (is_singular() && function_exists('yoast_breadcrumb') && !is_front_page()) {
$breadcrumbs = yoast_breadcrumb('<nav id="breadcrumbs">','</nav>', false);
if ($breadcrumbs) {
$items = [];
preg_match_all('/<a[^>]*href="([^"]*)"[^>]*>([^<]*)<\/a>/', $breadcrumbs, $matches, PREG_SET_ORDER);
$position = 1;
foreach ($matches as $match) {
$items[] = [
"@type" => "ListItem",
"position" => $position++,
"name" => strip_tags($match[2]),
"item" => $match[1]
];
}
if ($items) {
echo '<script type="application/ld+json">' . json_encode([
"@context" => "https://schema.org",
"@type" => "BreadcrumbList",
"itemListElement" => $items
], JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE) . '</script>';
}
}
}
});

Автоматическая вставка alt-текста

Автоматический alt-текст, если он не заполнен. Пустые alt у изображений — минус для SEO и доступности. Этот код автоматически добавляет название поста, если alt отсутствует.

// Добавить в functions.php
function auto_add_alt_to_images($content) {
if (!is_admin()) {
global $post;
$title = esc_attr($post->post_title);
$content = preg_replace('/<img(?!.*?\salt=)([^>]*)>/i', '<img alt="' . $title . '" $1>', $content);
}
return $content;
}
add_filter('the_content', 'auto_add_alt_to_images', 999);

Удалить параметры версий файлов

Удаление параметров версий из статических файлов. Код убирает ?ver=... из CSS и JS, улучшая кэширование (может повлиять на оценку скорости).

// Добавить в functions.php
function remove_script_version($src) {
if (strpos($src, 'ver=')) {
$src = remove_query_arg('ver', $src);
}
return $src;
}
add_filter('script_loader_src', 'remove_script_version');
add_filter('style_loader_src', 'remove_script_version');

Предзагрузка шрифтов

Предварительная загрузка шрифтов (Preload) для Core Web Vitals.

Ускорение загрузки шрифтов. Пример для шрифта Inter. Путь к файлу нужно указать свой.

// Добавить в functions.php или header.php
function preload_fonts() {
echo '<link rel="preload" href="' . get_template_directory_uri() . '/fonts/Inter.woff2" as="font" type="font/woff2" crossorigin>';
}
add_action('wp_head', 'preload_fonts');

Добавление кэширования в .htaccess

Кэширование в .htaccess (для Apache).

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

В корне сайта найдите файл .htaccess:

# Добавить в .htaccess в корне сайта
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
</IfModule>

<IfModule mod_headers.c>
<filesmatch "\.(ico|flv|jpg|jpeg|png|gif|css|swf|webp)$">
Header set Cache-Control "max-age=31536000, public"
</filesmatch>
</IfModule>

Отключить эмодзи

Отключение лишних эмодзи (WP Emojis). Код удаляет скрипты и стили, которые WordPress добавляет для поддержки старых эмодзи, уменьшая количество HTTP-запросов.

// Добавить в functions.php
function disable_wp_emojis() {
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('admin_print_scripts', 'print_emoji_detection_script');
remove_action('wp_print_styles', 'print_emoji_styles');
remove_action('admin_print_styles', 'print_emoji_styles');
remove_filter('the_content_feed', 'wp_staticize_emoji');
remove_filter('comment_text_rss', 'wp_staticize_emoji');
remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
add_filter('tiny_mce_plugins', function($plugins) {
return is_array($plugins) ? array_diff($plugins, ['wpemoji']) : [];
});
}
add_action('init', 'disable_wp_emojis');

Удаляем нужный участок кода в постах

Запрос SQL: как удалить нужный участок кода в постах (статьях) WordPress.

В phpMyAdmin выполните запрос, предварительно сделав бэкап базы. Также лучше сначала нажать на имитацию запроса и посмотреть, работает ли он в вашем случае (ответ будет такой: затронуто строк: число).

Пример. Нужно удалить все что находится между участками кода (включая сами HTML теги):

<blockquote><p><span style="color: #800000;">...любой текст...</span></p></blockquote>

Вот SQL запрос:

UPDATE wp_posts
SET post_content = REGEXP_REPLACE(
post_content,
'<blockquote>.*?800000.*?</blockquote>',
''
)
WHERE post_content REGEXP '800000';

Запрос ищет в wp_posts записи, где в post_content встречается 800000, и удаляет из них весь фрагмент <blockquote>...</blockquote>, внутри которого содержится это значение.

Функция REGEXP_REPLACE заменяет найденный блок на пустую строку, поэтому конкретный blockquote полностью исчезает, а остальные данные остаются без изменений.

Еще один пример. Нужно удалить все что внутри и сами теги во всех постах (статьях):

<p class="my-css"><strong>любой текст</strong></p>

Вот SQL запрос:

UPDATE wp_posts
SET post_content = REGEXP_REPLACE(
post_content,
'<p class="my-css">.*?</p>',
''
)
WHERE post_content REGEXP '<p class="my-css">';

Если внутри могут быть разные пробелы или переносы строк:

UPDATE wp_posts
SET post_content = REGEXP_REPLACE(
post_content,
'<p\\s+class="my-css">.*?</p>',
''
)
WHERE post_content REGEXP 'class="my-css"';

Увеличение текста в статьях

Как добавить к статьям средства увеличения текста без плагина ?

Допустим, вы хотите добавить кнопки увеличения текста (+ и -), но только для постов, причем без сторонних плагинов.

Для этого, добавляем этот код в конец файла functions.php:

add_action('wp_footer', function() {
if (is_single()) : ?>
<script type="text/javascript">
jQuery(document).ready(function($) {
var step = 2; // шаг изменения шрифта
var min = 8; // минимальный размер
var max = 100; // максимальный размер
$('#increase-font').click(function(e) {
e.preventDefault();
$('.resize').each(function() {
var current = parseFloat($(this).css('font-size'));
var newSize = current + step;
if (newSize <= max) {
$(this).css('font-size', newSize + 'px');
}
});
});
$('#decrease-font').click(function(e) {
e.preventDefault();
$('.resize').each(function() {
var current = parseFloat($(this).css('font-size'));
var newSize = current - step;
if (newSize >= min) {
$(this).css('font-size', newSize + 'px');
}
});
});
});
</script>
<?php endif;
});

Ну, и, в файл для постов (обычно это single.php) в любое нужное место этот код. Это место выбрано для нашего конкретного случая, до вывода контента:

<!-- Кнопки изменения размера текста -->
<div class="font-resizer">
<span>Размер текста:</span>
<a href="#" id="increase-font" class="resizer-btn">A+</a>
<a href="#" id="decrease-font" class="resizer-btn">A-</a>
</div>

<!-- Контейнер для контента -->
<div class="resize">
<?php что-то вроде primary_content_top(); ?>
<?php что-то вроде content_loop(); ?>
<?php что-то вроде primary_content_bottom(); ?>
</div>
  1. Скрипт вставляется прямо в подвал страницы — не нужно создавать отдельные файлы и переживать о путях.
  2. Используется стандартный jQuery, который есть в WordPress.
  3. Обработчики клика вешаются на кнопки по ID.
  4. Стили для кнопок добавьте по желанию в CSS.

Стили, как пример. Добавьте их в свой CSS файл:

.font-resizer {
margin-bottom: 5px; /* отступ снизу ровно 5px */
text-align: right; /* выравниваем по правому краю */
font-family: inherit;
}
.font-resizer span {
margin-right: 8px;
font-size: 14px;
color: #666;
}
.resizer-btn {
display: inline-block;
width: 32px;
height: 32px;
line-height: 32px;
text-align: center;
margin-left: 5px;
background: #f5f5f5;
color: #333;
border: 1px solid #ddd;
border-radius: 4px;
text-decoration: none;
font-weight: bold;
font-size: 16px;
transition: all 0.2s ease;
cursor: pointer;
user-select: none;
}
.resizer-btn:hover {
background: #e0e0e0;
border-color: #ccc;
transform: scale(1.05);
}
.resizer-btn:active {
background: #d0d0d0;
transform: scale(0.98);
}/* Your code... */

Ровно тоже самое организовано у нас на сайте.

Добавление hreflang для английской версии сайта

Как сделать так, чтобы данные hreflang вставлялись автоматически в head для английской и русской версии статей сайта ?

Нужно добавить 2 статьи: на русском и на английском. Ниже в произвольное поле добавляем адрес английской статьи, в английской статье – наоборот.

Как это подробно делать смотрите тут, уже обсуждали: Английская версия сайта: поддомен, директория или параметры URL

Нажмите, чтобы оценить наш труд:
[Всего: 1 Средняя: 5]
Ethan Carter

Я, Итан Картер – американский разработчик и технический автор с более чем 20-летним опытом в системном и прикладном программировании. Мой основной профиль — низкоуровневая разработка на Assembler: 22 года практики, включая глубокую работу с оптимизацией кода, архитектурой процессоров и производительностью критичных по скорости решений. Я защитил PhD dissertation по Assembler, а также более 18 лет работаю с ASP.NET, создавая корпоративные веб-системы, API и масштабируемые backend-решения.

Дополнительно я имею 9 лет опыта в C++ и C#, а также 7 лет практики программирования микроконтроллеров на Assembler. Благодаря моему сочетанию академической подготовки и прикладного инженерного опыта я могу писать статьи на стыке архитектуры ПО, низкоуровневой оптимизации и современной разработки, делая сложные технические темы понятными для профессиональной аудитории.

Оставьте комментарий

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


Срок проверки reCAPTCHA истек. Перезагрузите страницу.

О нас | Контакты


Прокрутить вверх