Привлекаем внимание посетителя ядовой ленточкой

Здравствуйте, дорогие читатели блога. Попользовался плагином page peel, кто не знает, это красивый загибающийся уголочек вверху, который как будто колышется на ветру.

Да плагин красивый, спору нет, вот только блог он нагружает не кисло. И к тому же, на сайте появляются различные ошибки валидности, поэтому нашел более простое решение, — это плагин FCC Ribbon Manager.

Плагин FCC Ribbon Manager — назначение ленточки

Пусть плагин FCC Ribbon Manager и не такой красивый, хотя как сказать, если уделить внимание, можно сделать классную ленточку, которая будет даже эффективней, нежели загибающийся уголок. Вообще, зачем нужна такая ленточка?

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

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

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

Ленточку можно организовать двумя способами:

1) при помощи плагина  FCC Ribbon Manager
2) при помощи php кода.

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

Плагин  FCC Ribbon Manager – установка и настройка.

По старинке, нам в первую очередь нужно скачать плагин.

После того, как архив лежит на компьютере, плагин нужно установить и активировать.

После активации плагина, в административной панели, в разделе «Настройки» появится новый пункт – «Ribbon Manager»,

заходите в настройки и попадете на такую страницу.

Как видите, настроек очень мало, но их вполне достаточно для наших целей.  Пойдем сверху вниз.

1.    Image Location Url: — в этом поле задается адрес, где лежит картинка. Вот, можете скачать мою и закинуть к себе, ну, картинка не совсем моя, я ее тоже стянул;) но вскоре сделаю свою.

2.    Ribbon size: — указываем размеры для картинки, подгоняется индивидуально под каждый сайт.
3.    Destination Url: — указать адрес ссылки, куда будет попадать пользователь после нажатия на ленточку.
4.    Title Url: — я оставил пустым, у меня заголовок появляется в непонятном месте.
5.    Align: — указать, где вы хотите видеть красивую ленточку, рекомендую верхний правый угол.
6.    Update – после всех настроек, не забываем сохранять изменения.

Вот и все, после обновления настроек, у вас в углу будет болтаться симпотная ленточка, которая будет привлекать внимание посетителя.

P.S Ленточку конечно лучше доработать или сделать свою. Давайте рассмотрим второй вариант.

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

В первую очередь отключаем плагин FCC Ribbon Manager, если он у вас стоял. Затем нам нужно будет покопаться в коде шаблона, а конкретней, открывайте файл footer.php, и до закрывающего тега «/body» , нужно вставить следующий код:

div class="lenta"><a href="ссылка на страницу" target="_blank">Название ссылки</a></div>

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

После того, как всё прописали, открывайте файл style.css, находится он также в папке с темой, в него нужно вставить следующий код, вставляйте в самый конец:

.lenta{
 background: url('http://ссылка на картинку') no-repeat 1px 1px;
 width: 125px;
 height: 95px;
 position: fixed;
 top: 0px;
 right: 0px;
 }
.lenta a{
 text-decoration: none;
 text-indent: -2000px;
 display: block;
 width: 205px;
 height: 49px;
 margin: 43px 2px;
 -o-transform: rotate(44deg);
 -webkit-transform: rotate(44deg);
 -moz-transform: rotate(44deg);
 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
 }

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

Ну вот, на этом все ребятки, я избавился от плагина FCC Ribbon Manager, вывел ленточку при помощи php кода и сделал ее индивидуальной, наблюдать можно в правом верхнем углу или на скрине. Хотите узнать, какие плагины установлены у меня? Вот, пожалуйста, мне не жалко — ссылка.

Подписывайтесь на обновления блога, все самое интересное и полезное впереди!

Еще полезные статьи:

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

Жду ваших комментариев;)

С Уважением, Михед Александр