10 советов по оптимизации вашей темы WordPress

[ad_1]
⭐
- 1 Ограничьте количество слов отрывка
- 2 Добавить фавикон с помощью хука WordPress
- 3 Обнаружение Safari на iOS
- 4 Удалить элементы из заголовка
- 5 Перенаправление фидов WordPress на FeedBurner
- 6 Показывать избранные изображения в ленте
- 7 Показывать контент только подписчикам RSS
- 8 Показывать контент только зарегистрированным пользователям
- 9 Отображение ссылок для обмена сообщениями в социальных сетях
- 10 Добавить логотип на страницу входа
- 11 Заключительные мысли
10 советов по оптимизации вашей темы WordPress
Прелесть WordPress в том, насколько легко его адаптировать для разных задач. Его можно расширить всего парой строк кода. В этом посте мы рассмотрим 10 фрагментов шорткода, которые настроят и оптимизируют вашу тему WordPress. Вы можете добавить все эти фрагменты кода в functions.php
файл в вашей теме WordPress.
Ограничьте количество слов отрывка
Одна вещь, которая может пойти не так в темах журнала WordPress, — это когда пользователи включают слишком много слов перед more
ярлык. Конечно, они могли бы создать отрывок вручную в специальном поле, но на веб-сайте с сотнями постов, на котором текст над more
тег всегда использовался в качестве выдержки, возвращаться к созданию выдержек для всех этих сообщений вручную было бы обременительно. В этом случае мы можем ограничить количество слов, отображаемых в отрывке, используя этот код:
add_filter('excerpt_length', 'ilc_excerpt_length');
function ilc_excerpt_length( $length ){
return 10;
}
Здесь мы используем ловушку фильтра WordPress, которая представляет собой функцию, которая анализирует и (обычно) изменяет данные перед тем, как они будут сохранены в базе данных или отображены на странице. В этом случае мы устанавливаем количество слов, показанных в отрывке, равным 10.
Добавить фавикон с помощью хука WordPress
Хуки позволяют нам вставлять пользовательский код, не касаясь шаблона. Это дает нам большую гибкость, потому что теперь, когда нам нужно что-то изменить, нам нужно изменить только функцию, подключенную к определенному хуку. Например, вы можете добавить фавиконку на свой веб-сайт, не касаясь header.php
файл, просто подключив функцию к wp_head
крюк:
add_action( 'wp_head', 'ilc_favicon');
function ilc_favicon(){
echo "<link rel="shortcut icon" href="" . get_stylesheet_directory_uri() . "/favicon.ico" />" . "n";
}
То favicon.ico
файл должен находиться в корне вашей темы. Теперь мы используем хук действия, который представляет собой функцию, которая запускается в определенные моменты во время выполнения ядром WordPress. В этом случае хук запускает любую прикрепленную к нему функцию при запуске страницы в браузере. Но другие хуки могут срабатывать при сохранении поста, регистрации пользователя и так далее. В некоторых темах даже есть свои собственные хуки действий, которые, как и основные хуки действий WordPress, можно использовать для запуска функций в определенных точках выполнения.
Обнаружение Safari на iOS
В настоящее время веб-сайты обслуживают мобильные версии, используя различные методы. WordPress предлагает безопасный способ проверки мобильного браузера Safari, чтобы вы знали, когда посетитель использует iPhone или iPad.
WordPress устанавливает $is_phone
переменная внутри, и вы можете использовать ее для встраивания альтернативной таблицы стилей, отображения альтернативного контента или отображения другого формата видео. В следующем примере $is_iphone
переменная запускается, и в зависимости от возвращаемого значения применяются разные таблицы стилей:
add_action('wp_print_styles', 'ilc_enqueue_styles');
function ilc_enqueue_styles(){
global $is_iphone;
if( $is_iphone ){
wp_enqueue_style('iphone-css', get_stylesheet_directory_uri() . '/iphone.css' );
}
else{
wp_enqueue_style('common-css', get_stylesheet_directory_uri() . '/common.css' );
}
}
В этом случае мы используем стандартную функцию WordPress. wp_enqueue_style
чтобы добавить стили в head
элемент веб-страницы. Действие, к которому мы присоединяем нашу функцию, wp_print_styles
; Итак, мы в основном говорим WordPress выводить соответствующую таблицу стилей, когда он печатает все остальные необходимые таблицы стилей.
Удалить элементы из заголовка
WordPress выводит несколько вещей в head
раздел. В частности, generator
метатег, т. РСД ссылка и wlwmanifest
ссылка будет не очень полезна для многих пользователей:
<meta name="generator" content="WordPress 3.2.1">
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://example.com/xmlrpc.php?rsd">
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://example.com/wp-includes/wlwmanifest.xml">
Некоторые блоггеры говорят, что вам следует избавиться от generator
метатег, чтобы никто не мог сказать, какую версию WordPress вы используете. Но помните, вы всегда должны использовать последнюю версию.
Если вам не нужны функции XML-RPC, вы можете удалить ссылку RSD (вторая строка в приведенном выше фрагменте). То же самое происходит, если вы не используете Windows Live Writer: вы можете безопасно удалить третий элемент.
В этом случае вы можете добавить этот код:
add_filter('the_generator', create_function(’, 'return "";'));
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
Эти строки удалят соответствующие элементы в приведенном выше фрагменте.
Перенаправление фидов WordPress на FeedBurner
Здорово, что WordPress предлагает фиды из коробки. Но если вам нужна статистика о ваших подписчиках, вам придется использовать FeedBurner или аналогичный сервис. Чтобы перенаправить ваш канал на один из них, используйте следующий фрагмент кода. Таким образом, если вы попытаетесь перейти к https://www.smashingmagazine.com/feed
вы будете перенаправлены на каналы FeedBurner для Smashing Magazine.
add_action('template_redirect', 'ilc_rss_redirect');
function ilc_rss_redirect() {
if ( is_feed() && !preg_match('/feedburner|feedvalidator/i', $_SERVER['HTTP_USER_AGENT'])){
header('Location: https://feeds.feedburner.com/smashingmagazine');
header('HTTP/1.1 302 Temporary Redirect');
}
}
Заменять https://feeds.feedburner.com/smashingmagazine
с URL-адресом вашего собственного канала из FeedBurner.
Показывать избранные изображения в ленте
Чтобы побудить подписчиков посетить ваш веб-сайт, а не просто потреблять контент через ваш RSS-канал, вы можете отображать только выдержки и избранные изображения сообщений. Но WordPress по умолчанию не отображает избранное изображение в RSS-канале. Для этого используйте следующий код. Вы даже можете добавить к нему HTML.
add_filter('the_content_feed', 'rss_post_thumbnail');
function rss_post_thumbnail($content) {
global $post;
if( has_post_thumbnail($post->ID) )
$content="<p>" . get_the_post_thumbnail($post->ID, 'thumbnail') . '</p>' . $content;
return $content;
}
Показывать контент только подписчикам RSS
Чтобы увеличить количество подписчиков на ваш RSS-канал, вы можете предложить подарок, доступный только им. Приведенный ниже код создает новый шорткод, с помощью которого можно обернуть контент, чтобы скрыть его от обычных посетителей, но не от подписчиков RSS.
add_shortcode( 'feedonly', 'ilc_feedonly' );
function ilc_feedonly( $atts, $content = null ) {
if( is_feed() ) return '<p>' . $content . '</p>';
else return;
}
Показывать контент только зарегистрированным пользователям
Точно так же вы можете показывать контент только зарегистрированным пользователям вашего сайта. Приведенный ниже код создает новый шорткод, с помощью которого можно обернуть контент, чтобы скрыть его от случайных посетителей, но не от зарегистрированных пользователей.
add_shortcode( 'loggedin', 'ilc_loggedin' );
function ilc_loggedin( $atts, $content = null ) {
if( is_user_logged_in() ) return '<p>' . $content . '</p>';
else return;
}
Если по какой-то причине вы не хотите использовать стандартные кнопки Facebook, Twitter и других социальных сетей для обмена сообщениями, вы можете добавить свои собственные ссылки с помощью приведенного ниже кода, возможно, используя его в сочетании с одной из иконок Smashing Magazine. наборы, такие как Flavours.
Здесь мы будем фильтровать содержимое с помощью the_content
функция. Но, в отличие от того, что мы делали, когда корректировали длину отрывка или удаляли generator
метатег, мы не хотим его перезаписывать, а скорее добавляем к нему наши ссылки. Таким образом, этот фильтр возвращает исходный контент сообщения, объединяя наши ссылки социальных сетей сразу после него.
add_filter( 'the_content', 'ilc_share' );
function ilc_share( $content ) {
global $post;
$postlink = get_permalink($post->ID);
$posttitle = get_the_title($post->ID);
$html="<ul class="share-entry">";
// Twitter
$html .= '<li><a class="share-" title="Share on Twitter" rel="external" href="https://.com/share?text=".$posttitle."&url=".$postlink."">Share on Twitter</a></li>';
// Facebook
$html .= '<li><a class="share-facebook" title="Share on Facebook" rel="external" href="https://www.facebook.com/share.php?u=' . $postlink . '">Share on Facebook</a></li>';
// LinkedIn
$html .= '<li><a class="share-linkedin" title="Share on LinkedIn" rel="external" href="https://www.linkedin.com/shareArticle?mini=true&url=" . $postlink . "&title=" . $posttitle . "">Share on LinkedIn</a></li>';
// Digg
$html .= '<li><a class="share-digg" title="Share on Digg" rel="external" href="https://digg.com/submit?url=" . $postlink . "">Share on Digg</a></li>';
// StumbleUpon
$html .= '<li><a class="share-stumbleupon" title="Share on StumbleUpon" rel="external" href="https://www.stumbleupon.com/submit?url=" . $postlink . "&title=" . $posttitle . "">Share on StumbleUpon</a></li>';
// Google+
$html .= '<li><a class="share-googleplus" title="Share on Google+" rel="external" href="https://plusone.google.com/_/+1/confirm?url=" . $postlink . "">Share on Google+</a></li>';
$html .= '</ul>';
return $content . $html;
}
Этот код добавит ссылки как в полный просмотр сообщений, так и на страницы архива (например, страницы категорий и тегов). Если вы хотите, чтобы они отображались только в полном представлении для сообщений, добавьте следующее прямо перед global $post;
:
if( !is_singular() ) return $content;
Таким образом, ссылки будут добавляться только тогда, когда пользователь посещает полную публикацию или страницу с изображением.
Добавить логотип на страницу входа
Чтобы добавить свой логотип на страницу входа для администраторов, используйте login_head
хук действия, который выполняет все функции, прикрепленные к нему на странице входа в систему. head
элемент. Здесь мы делаем две вещи: меняем логотип и меняем ссылку, на которую он указывает.
add_action( 'login_head', 'ilc_custom_login');
function ilc_custom_login() {
echo '<style type="text/css">
h1 a { background-image:url('. get_stylesheet_directory_uri() . '/images/login-logo.png' . ') !important; margin-bottom: 10px; }
padding: 20px;}
</style>
<script type="text/javascript">window.onload = function(){document.getElementById("login").getElementsByTagName("a")[0].href = "'. home_url() . '";document.getElementById("login").getElementsByTagName("a")[0].title = "Go to site";}</script>';
}
Код CSS заменит логотип WordPress на ваш собственный. Вы можете настроить путь к изображению в четвертой строке кода выше в соответствии с вашей темой.
Кроме того, JavaScript изменяет URL-адрес логотипа, чтобы вы не перескакивали на wordpress
а на свою домашнюю страницу.
Заключительные мысли
Мы увидели, как настраивать ссылки и значки социальных сетей WordPress, как отображать контент только для зарегистрированных пользователей, как настраивать RSS-канал и многое другое. Но самое главное, что нужно усвоить, это то, что вы можете использовать это бесконечными способами. Например, вы можете добавить ссылки на социальные сети только в свою ленту, или добавить свой логотип в конец ленты, или настроить страницу входа с помощью CSS, и это лишь некоторые из возможностей.
Перехватчики действий и фильтры являются эффективными инструментами для настройки вывода темы, независимо от того, записаны ли они в базу данных или запущены в браузере посетителя. Вы можете прочитать больше о действиях и фильтрах в Кодексе WordPress.

(аль)
[ad_2]
Source: https://smashingmagazine.com
Заключение
Вы ознакомились с статьей — 10 советов по оптимизации вашей темы WordPress
Пожалуйста оцените статью, и напишите комментарий.