Архив метки: Wordpress

Красивые смайлики в WordPress для комментариев с плагином Qipsmiles и без

Доброго времени суток, уважаемые посетители inetsovety.ru! В этом посте я наглядно покажу как добавить красивые смайлы в комментариях от Qip под формой для комментирования. Возможность вставить смайл в комментарий дает Вашим посетителям дополнительное удобство для выражения своих чувств. Также положительно сказывается на поведенческих факторах сайта, увеличивая время посещения Вашего сайта.

Приступим непосредственно к процессу добавления смайлов в комментариях. Ставить смайлы мы будем из Qip, они давно полюбились многим пользователям. И поможет нам в этом плагин Qipsmiles.

Установка и настройка плагина Qipsmiles

Сначала Вам понадобится скачать архив с плагином Qipsmiles по этой ссылке.

Второй шаг — установка и активация плагина. Смотрим на картинку ниже и устанавливаем в той последовательности, как показано на ней:

Смайлы в комментариях wordpress

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

Когда плагин установлен и активирован. Остался последний шаг — добавить функцию вывода смайлов под формой комментариев в файл comments.php. На всякий случай сделайте резервную копию файлов шаблона, что быстро восстановить работу сайта в случае возникновения проблем.  Хотя работа не сложная и напортачить практически не реально.

В админ панели сайта заходим в меню «Внешний вид» — «Редактор» и открываем файл comments.php вашей темы. Добавляем туда следующий код:

<?php if (function_exists('qipsmiles')) qipsmiles('ru'); ?>

Я добавила код под полем для ввода текста комментария и над кнопкой «Добавить комментарий», смотрите картинку ниже:

куда вставить код смайлов для комментариев wordpress

Как это будет выглядеть видно на скрине:

Как выглядят смайлы в комментариях под формой комментирования

Как видите добавить смайлы для комментариев на блог с помощью плагина Qipsmiles очень легко. Это займет не более 10 минут. Если на Вашем блоге еще нет смайлов для комментариев, воспользуйтесь этой наглядной инструкцией и установите их.

Вывод без плагина

Если у Вас был установлен плагин QIP Smiles, то деактивируйте его и удалите строку с кодом, которая выводила смайлы, из файла comments.php.

Далее нужно вставить код функции для вывода смайлов.

Код, который нужно добавить, смотрите в текстовом документе на Яндекс Диске https://yadi.sk/i/xiPBFq8RmAsZa

По умолчанию будут добавлены некрасивые стандартные смайлы. Но их можно заменить на симпатичные смайлы от QIP или Skype. И это сделать очень легко.

Скачайте этот архив себе на компьютер. После этого распакуйте его. Дальше нужно заменить стандартные смайлы, которые находятся на хостинге на те, которые Вы только что загрузили себе на компьютер. Соединитесь с сайтом через фтп клиент и откройте на хостинге папку wp-includes, в ней images, а потом smilies. Теперь замените картинки смайлов, которые находятся на хостинге, теми что Вы скачали на компьютер. Если Вам нравятся смайлы от скайпа, скачайте данный архив и замените этими файлами стандартные смайлы от wordpress.

Обратите внимание, что с обновлением Вордпресс, смайлы придется обновлять заново, поскольку они находятся в системной папке wp-includes/images/smilies/

Как по мне, то добавить в комментарии смайлы с помощью кода, который приводится в этой статье, немного проще, чем с помощью плагина QIP Smiles. Единственный минус этого способа — периодически нужно закачивать изображения смайликов заново после обновления движка.

Каким способом у вас на блоге выводятся смайлики и какие вам больше нравятся? Пишите свои ответы в комментариях к статье.



2013-03-02T05:30:40
Блог на WordPress

Избежать дублирование страниц в WordPress без плагинов

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

Читать

Спойлер в WordPress с помощью плагина Advanced Spoiler

Всем привет! Иногда возникает необходимость скрыть часть текста, которая находится в статье и является вспомогательной. Для этой цели отлично подходит спойлер. Одним кликом по спойлеру скрытая информация откроется и любой желающий ее сможет прочесть.  В этой статье я расскажу о плагине, который поможет скрыть текст в спойлер в статье. Плагин Advanced Spoiler позволит легко добавить спойлер на WordPress блоге.

Если Вы не знаете что такое спойлер, посмотрите на картинку ниже:

Как создать спойлер на WordPress

Подобный спойлер Вы могли видеть на торрент трекерах.

Найти несложную инструкцию по добавлению спойлера без плагина мне пока не удалось, поэтому я расскажу как это легко можно реализовать данную возможность с плагином Advanced Spoiler.

Настройка Advanced Spoiler

Первым делом устанавливайте плагин Advanced Spoiler. Устанавливается он стандартно, как и все плагины. Заходи в раздел «Плагины» и добавляете в строку поиска название. По названию находите в списке результатов поиска нужным Вам и нажимаете на ссылку «установить». После успешной установки активируете.

Далее найдите плагин Advanced Spoiler в меню Параметры и сделайте несколько настроек. Укажите какая надпись будет показаться на закрытом и открытом спойлерах. По умолчанию там надписи «Show» и «Hide». Русифицируем их, вписав «Показать» и «Спрятать». Если хотите, можете поэкспериментировать с эффектами открытия спойлера.

настройки плагина Advanced Spoiler

Больше ничего настраивать не нужно. Сохраняете изменения.

Чтобы добавить спойлер в статью нужно на странице редактора записи выделить текст, который нужно спрятать и нажать на кнопку добавить спойлер:

добавляем спойлер в статью на wordpress

Вот что получилось после публикации статьи:Как сделать спойлер на WordPress с помощью плагина Advanced Spoiler

Плагину явно не хватает цветового оформления, как-то не выразительно он выглядит в тексте статьи.

Установка и настройка данного плагина не должна вызвать трудностей даже у новичка. Все интуитивно понятно. Как Вы могли заметить, что перевод у плагина кривоват, но это не помешает разобраться. Вот собственно и все. Устанавливайте и пользуйтесь на здоровье :)

Красивый спойлер для WordPress сайта без плагинов

Честно говоря, мне самой не нравился способ вывода спойлера с помощью плагина. Графическое оформление у него отсутствовало, а ссылка «Показать содержимое спойлера», была совсем не привлекательной. Когда я заказывала новый уникальный шаблон для своего блога, я попросила программиста красиво оформить спойлер и задать его вывод без использования каких-либо плагинов. И вот сейчас я хочу поделиться в Вами кодом вывода спойлера в статье.

Для новичков я хочу пояснить, что такое спойлер на сайте и для чего он нужен. Спойлер представляет собой блок, внутри которого спрятан текст или другое содержание. Спойлер содержит заголовок, кликнув по которому открывается, спрятанное ранее содержание, вот наглядный пример работы спойлера не моем блоге:

Кликните, чтобы увидеть содержание спойлера

Поздравляю! Вы открыли спойлер :)

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

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

Последовательно работы:

  1. Откройте файлы header.php, footer.php и function.php и проверьте нет ли там кода подключения библиотеки jquery. Нажмите комбинацюи клавиш Ctrl + F и введите в строку поиска jquery.min.js. Если ничего не найдено ни в одном из файлов, тогда в файл header.php до строки </head> добавьте следующий код

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

  1. Теперь в файл footer.php до тэга добавьте вот этот код, который обеспечивает работоспособность спойлера:

<script type="text/javascript">

$(".closed").toggleClass("show");

 

$(".title").click(function(){

 $(this).parent().toggleClass("show").children("div.contents").slideToggle("medium");

 if ($(this).parent().hasClass("show"))

 $(this).children(".title_h3").css("background","rgb(253, 253, 253)");

 else $(this).children(".title_h3").css("background","rgb(231, 242, 255)");

});

</script>

  1. Стили оформления спойлера прописываем в файле style.css. Вы можете на свое усмотрение поменять цветовую гамму.

.spoiler {

 overflow: hidden;

 margin-bottom: 20px;

 margin-top: 20px;

 border: 1px solid #FF9574; /* цвет рамки */

 border-left: 2px solid #D02A1B; /* цвет границы слева */

 box-shadow: 0 0 9px #dddddd inset;

}

 

.title_h3 {

 cursor:pointer;

 font-size: 14px;

 background: rgb(231, 242, 255); /* фон заголовка. одновременно нужно изменять и в скрипте */

 margin: 0 -10px 0 -10px;

 padding: 10px;

 padding-left: 30px;

 -moz-box-shadow: 0 0 9px #dddddd inset;

 box-shadow: 0 0 9px #dddddd inset;

}

 

.closed .contents { display:none; }

.closed h3 { background: #CBEBFB; /* фон заголовка */}

.contents { padding: 10px; }

Вот неплохой сервис подбора цвета — ссылка.

На этом настройка спойлера завершена. Теперь в режиме «Текст» в админке блога, добавляйте вот этот код:

<div class="spoiler closed">

<div class="title"><div class="title_h3"><strong>Текст заголовка</strong></div></div>

<div class="contents">Текст, скрытый под спойлером</div></div>

Как Вам такая реализация вывода спойлера на любой странице блога? Сложно? Пишите свои отзывы в комментариях.



2013-02-25T11:11:51
Блог на WordPress

Как вставить видео с YouTube на сайт в любую статью

Доброго времени суток, уважаемый посетитель блога ИнетСоветы.ру. Из этой статьи, вы узнаете, как вставить видео на сайт с Ютуба и настроить его отображение и воспроизведение.

Чтобы не занимать место на своем хостинге, удобнее выложить водеоролик на видеохостинг Youtube и разместить на сайте ссылку на видео. Также эти знания вам понадобятся, если вы для дополнения информативности, публикуемого на сайте материала, размещаете видеоролики других авторов.

Что дает публикация мультимедиа в посте

  • улучшение восприятия материала и дополнение информации в текстовом формате;
  • если информация в статье носит обучающий характер, мультимедиа наглядно продемонстрирует весь процесс на практике;
  • увеличение времени нахождения посетителя на сайте, что позитивно сказывается на поведенческих факторах;
  • повышение доверия к автору и улучшение конверсии в виде подписок и продаж;
  • можно получать дополнительный доход от монетизации видеороликов. Подробнее читайте в статье «Как заработать на видео на Youtube».

Как разместить видеоматериалы на сайте

Способов всего два:

  1. Загрузить файл на хорстинг, где размещен ваш сайт. Дальше подключить видео плеер и показывать медиаролик посетителям. Но у этого метода целых два недостатка. Во-первых, при большом числе одновременных просмотров, создается огромная нагрузка на сервер хостера. Это в свою очередь может привести к тому, что хостер наложит ограничения на сайт или даже временно отключит его, из-за превышения допустимой нагрузки. А во-вторых, видеоролики занимают много места на сервере, а оно тоже ограничено вашим тарифным планом.
  2. Трансляция видео, предварительно загруженного на Ютуб. Ссылка со специальным кодом позволит легко вставить на сайт видео с Youtube. И это не только позволит сэкономить ресурсы сервера, не создавая никакой нагрузки на него, но и позволит привлечь дополнительную аудиторию из популярного видеохостинга.

Как встроить видео с Youtube на сайт

После того, как рассмотрены способы вставки и их преимущества и недостатки, самое время показать, как добавить видео на сайт с Ютуба.

Регистрироваться на Youtube вовсе не обязательно, если вы не планируете вести свой канал. Получить код видео на Ютубе для любого понравившегося видеоролика можно без регистрации.

Как получить html код видео с Youtube

На странице с роликом сразу под видеоплеером найдите кнопку «Поделиться»:

Как разместить на сайте видео с Youtube

Откроется окно с выбором способа отправить ссылку. Для размещения на сайте нас интересует ссылка на видео Youtube в html, и чтобы ее получить нажимаем на кнопку с подписью «Встроить»:

Способы отправить ссылку на ролик на Ютубе в соцсетях и втроить на сайт

После клика по этой кнопке будет показан код для вставки видео с Youtube, выглядит он вот так:

Как получить ссылку с кодом на видео на youtube

Дальше у вас два варианта. Первый — взять и разместить видео на сайте с Ютуба, как есть, ничего не меняя в стандартных настройках кода. Второй – внести правки в код и настроить под себя.

Сначала рассмотрим, какие стандартные настройки нам предлагаются видеохостингом:

  1. Выбрать начало воспроизведения. Ставим птичку в чекбоксе возле надписи «Начало» и вводим время, с которого начинать показ видео. Изменять начало времени воспроизведения стоит, если ролик длинный. Чтобы пользователи не скучали, просматривая ненужный контент, вы им экономите время и сразу предоставляете нужный материал.
  2. Можно отключить показ похожих видео по окончании просмотра.
  3. Не показывать панель управления проигрывателем. Это означает, что пользователь не увидит таких кнопок, как пауза/воспроизведение, полосу прокрутки.
  4. Также можно отключить показ названия ролика и панель действий.
  5. Последняя опция – повышенная конфиденциальность. Это влияет на сбор информации о пользователях, просматривающих ролик.

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

Проделав приведенные выше настройки, вы можете скопировать html-код видео с Youtube, и разместить его в статье на своем сайте.

Если у вас старая версия браузера, чтобы получить html-код, под проигрывателем нажмите «Поделиться», выберите вкладку «HTML-код»:

Изменение настроек

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

  • Автоматическое воспроизведение видео с Youtube на сайте. Если у атрибута autoplay=1 значение 1, то будет происходить автоматический запуск видеоплейера после загрузки страницы. Для отключения установите 0.
  • Для изменения размеров окна проигрывателя укажите нужные размеры у элементов width, height. Первый отвечает за ширину, а второй за высоту. Важно соблюдать пропорции.

Как вставить код видео с Ютуба в html на платформе WordPress

Для того, чтобы вставить ссылку на видео в Ютубе, в редакторе Вордпресс переключаетесь на вкладку «Текст». Далее, выбираете после какого абзаца будет отображаться проигрыватель с роликом и добавляете туда полученный код:

Как вставить видео из youtube на сайт Вордпресс

По умолчанию проигрыватель будет выровнен по левому краю. Если хотите задать выравнивание по центру, заключите его код в тег <center></center>.

Чтобы посмотреть, как встроилось видео с Youtube на сайте, нажмите на кнопку «Посмотреть изменения» и откроется страница с предварительным просмотром оформленной записи.

Как вставить видео с Ютуба в ВК

Разместить видео с Ютуба в ВК намного проще, чем на сайте. Весь процесс публикации заключается в нескольких кликах. Нажмите на ссылку «Поделиться» под роликом, откроется следующее окно, где нужно выбрать социальную сеть ВКонтакте:

Как отправить ссылкуа на видео с Ютуба на свою стену в ВК

Если вы уже авторизованы в своему аккаунте в ВК,откроется страничка, где можно указать, как будет размещено видео (на стене или личным сообщением). Вы можете добавить свой комментарий. Если не хотите, чтобы было опубликовано изображение от видеоролика, снимите птичку возле чекбокса «добавить изображение». Также есть возможность добавить ролик в «Мои видеозаписи».

Как поделиться ссылкой на видео в социальной сети ВКонтакте

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



2013-02-13T12:51:46
Блог на WordPress

Плагин для вывода блока «Топ комментаторов» — Top Commentators Widget

Здравствуйте, уважаемые читатели! Из этой статьи вы узнаете, как вывести в виджете сайдбара блок «Топ комментаторов» при помощи плагина Top Commentators Widget.

С развитием блога его популярность растет и увеличивается число посетителей, а также постоянная аудитория. Растет и число комментариев. Обычно, постоянные читатели оставляют больше комментариев. Чтобы поощрить активных комментаторов можно вывести в сайдбаре виджет с их именами, а также ссылками на ихние сайты. Многие комментаторы имеют свой сайт и указывают его в специальном поле при оставлении комментария. Поэтому кликнув по нику комментатора можно перейти га его сайт.

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

Разбираем настройки Top Commentators Widget

Top Commentators Widget — несложный в настройке плагин, который не требует вставки никаких кодов. Нужно установить, активировать данный плагин и добавить виджет в сайдбар.

Чтобы попасть на страницу с виджетами нужно из меню выбрать раздел Внешний вид — Виджеты. Вот так выглядит страница с виджетами:

Как добавить виджет Топ комментаторов в сайдбарПеретащите Top Commentators Widget в колонку сайдбра в то место, где Вы хотите чтобы отображался список активных комментариев. Настройки плагина на английском и их немало, но я Вам сейчас детально опишу основные обозначения.

Настройка плагина Top Commentators Widget

1 — Название виджета. Например, «Активные комментаторы», «Топ комментаторов».

2 — По желанию можно добавить текст, который будет размещен под названием виджета. Если Вы проводите конкурс среди активных комментаторов с призами, то в этом поле можно упомянуть о нем.

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

4 — Указываем когда список комментаторов должен обнуляться. Если хотите, чтобы каждый месяц обнулялся, то выбираем Month.

5 — Тут можно указать в днях период обнуления. Но обратите внимание на формат.

6 — Какое число комментаторов будет отображаться в списке.

7 — Здесь указывается максимальная длина имени комментатора. У некоторых комментаторов бывают длинные имена, которые займут всю строку.

8 — Напишите какой текст показывать, если нет комментаторов.

9 — Исключаем URL адреса, которые не должны отображаться.

10 — Здесь указываем Email адреса комментаторов, которых нужно исключить из списка.

11 — Какой формат списка топ комментаторов: маркированный или нумерованный.

12 — Выбираем отображать ник, как ссылку на сайт комментатора или нет.

Настройка блока “Топ комментаторов” с помощью плагина Top-Commentators-Widget13 — Укажите как должен открываться сайт комментатора: в новом окне или нет.

14 — Здесь нужно задать добавление атрибута NoFollow к ссылке на сайт комментатора, если Вы не хотите передавать ему вес. Если в списке будет 10 активных комментаторов, то 10 сквозных ссылок из садбара это чересчур много.

15 — Отображать число комментариев для каждого комментатора или нет.

16 — Как сортировать комментаторов в списке. По умолчанию выбрано по Email адресу. Можно поменять на сортировку по имени.

17 — На каких страницах показывать виджет. На главной или на всех страницах.

18 — Показывать только комментаторов, у которых заполнено поле сайт.

19 — Отображать аватар комментатора. В другой статье читайте как настроить аватар для комментариев.

20 — В этом пункте задаем размер аватара и вид картинки.

21 — Тут пишем сколько комментариев нужно оставить,чтобы показывалась медаль.

22  — Указываем путь к изображению медали.

23 — Где отображать иконку с медалью.

24 — Самый важный пункт! Сохраните изменения.

Вот собственно и все. Теперь Вы сможете настроить на своем блоге вывод в садбаре виджета «Топ комментаторов».

На моем блоге вывод блока «Активные комментаторы» осуществляется без плагина. В одном из следующих постов я расскажу как его настроить.



2013-02-11T10:57:56
Блог на WordPress

Кнопка наверх (Back to top) без плагина на WordPress

Доброго времени суток, уважаемые читатели ИнетСоветы.ру! Из этого поста вы узнаете, как добавить кнопку «наверх» без плагина.

Для установки кнопки наверх без плагина необходимо загрузить на хостинг 2 файла и добавить несколько кодов в файлы темы. Читать