Вітаю! У цій статті розглянемо ще один спосіб приховування посилань авторів коментарів на їхні сайти. До цього ми вже розглядали спосіб приховування посилань за допомогою чистого JavaScript та CSS. Але цього разу ми звернемося до чудового фреймворку jQuery.
Як і раніше, всі дії (зміни коду) я буду виконувати на встановленій темі «Twenty Twelve».
Всі операції досить прості, і я не думаю, що у вас виникнуть якісь труднощі. Але якщо щось — ставте запитання в коментарях.
Перш ніж читати цю статтю, я би рекомендував ознайомитися зі статтею «Як заборонити індексацію посилань авторів коментарів у WordPress», оскільки вони мають спільну тематику.
Перше. Відкриваємо файл функцій теми «/wp-content/themes/twentytwelve/functions.php». І в самий кінець файлу додаємо наступну функцію:
function my_get_comment_author_link( $comment_ID = 0 ) {
$url = get_comment_author_url( $comment_ID );
$author = get_comment_author( $comment_ID );
if ( empty( $url ) || 'http://' == $url )
{
$return = $author;
}
else
{
$return = "<span class='s-link' data-link="".str_replace('http://', '_', $url)."">".$author."</span>";
}
return apply_filters( 'my_get_comment_author_link', $return, $author, $comment_ID );
}
Завдання у функції такі ж, як у «my_get_comment_author_link» в цій статті. Відмінність лише в одному рядку:
$return = "<span class='s-link' data-link="".str_replace('http://', '_', $url)."">".$author."</span>";
У цьому випадку ми використовуємо атрибут «data-link», щоб приховати посилання.
Далі знайдіть у файлі «functions.php» функцію «twentytwelve_comment(...)», а в ній — «get_comment_author_link()» та замініть її на «my_get_comment_author_link()».
На цьому етапі, замість звичних посилань буде відображатися:
<span class='s-link' data-link="_example.com/">Семен</span>
У вашому випадку ім’я та посилання будуть відповідно іншими.
Друге. Підключаємо фреймворк jQuery:
if(function_exists('my_wp_enqueue_scripts') == FALSE):
function my_wp_enqueue_scripts()
{
wp_enqueue_script("jquery");
}
add_action('wp_enqueue_scripts', 'my_wp_enqueue_scripts');
endif;
Вставте цю функцію нижче попередньої.
Третє. І, напевно, найцікавіше. Нам потрібно знайти на сторінці всі елементи span з класом «s-link» і замінити їх на звичні для нас теги «a». Для цього використовуємо наступний код:
if(function_exists('my_wp_head') == FALSE):
function my_wp_head()
{
?>
<script type="text/javascript">
jQuery(document).ready(function()
{
jQuery('.s-link').each(function(i){
jQuery(this).parents('.fn').html('<a href="' + jQuery(this).data('link').replace("_","http://") + '" target="_blank"">' + jQuery(this).text() + '</a>');
});
});
</script>
<?php
}
add_action('wp_head', 'my_wp_head');
endif;
Розглянемо детальніше. За допомогою:
jQuery('.s-link') — ми шукаємо на сторінці всі елементи з класом «s-link»
each(...) — дозволяє пройтись циклом по кожному знайденому елементу. Основна логіка наступна:
jQuery(this).parents('.fn').html('<a href="' + jQuery(this).data('link').replace("_","http://") + '" target="_blank"">' + jQuery(this).text() + '</a>');
де:
jQuery(this) — поточний елемент
parents('.fn') — переходимо до батьківського елементу з класом «.fn»
html(...) — вставляємо HTML з посиланням
Посилання формуємо з атрибуту:
jQuery(this).data('link') — беремо URL
jQuery(this).text() — ім’я автора
Цей спосіб хороший тим, що автор коментаря не дізнається, що його посилання — насправді просто span. Посилання буде працювати звичайно, лише перегляд коду покаже правду.
Але є одне «але» — невідомо, чи пошукові роботи бачать оброблений DOM як браузери, чи лише сирий код.
Здається, поки що бачать тільки HTML та JavaScript без виконання останнього.
