Бегущая строка на WordPress

Итак, при создании одного из сайтов на WP мне понадобилось сделать Бегущую строку объявлений, ну и соответственно я спросил у google.ru про модуль Бегущей строки на wp. И естественно такой модуль существует. Перешел по первой ссылке сразу на не безызвестный сайт для любителей wordpress — wp-skins.info. Там был модуль бегущей строки, но не совсем тот, который мне нужен, посмотреть работу того модуля Вы можете там же на сайте. Строка одной из пяти последних тем красиво выходит, ну и исчезает сразу же, как только кончается название темы, и уже на том же месте выходит следующая, но если мне нужно предыдущая? А нажать я не успел? — Не удобно. Я решил, что мне нужна простая, обыкновенная бегущая строка, именно бегущая, а не исчезающая ;). А такого модуля в интернете мне найти не удалось (может и плохо искал).

Собственно желаемое было достигнуто усилиями скрипта с сайта mihalytch.org.ua и собственными руками.

Установка модуля бегущей строки для WordPress происходит следующим образом:

Для начала скачайте файл: beg

Разархивируйте его и закиньте beg.php в папку с Вашей темой.

Затем в нужном Вам месте (где будет выводиться бегущая строка) вставьте код:

<div class="marquee-container" id="marquee_container">
 
<div class="marquee-subcontainer" id="marquee_subcontainer">
 
<div class="marquee-text" id="marquee_text">
 
<?php $CountPost = 5; $CategoryName = ''; ?>
 
<?php $cnt = 0; $my_query = new WP_Query("category_name=".$CategoryName."&showposts=".$CountPost);
 
while ($my_query->have_posts()) : $my_query->the_post(); ?>
 
<span style="padding:0px 50px;"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></span>
 
<?php endwhile; ?>
 
</div>
 
</div>
 
</div>
 
<?php include (TEMPLATEPATH . '/beg.php'); ?>
<?php $CountPost = 5; $CategoryName = ''; ?>

Здесь выставляем количество выводимых постов, и соответственно имя категории (именно имя, а не id).

Собственно на этом и всё. Редактировать размер, длину строки Вы можете в beg.php в стилях, а скорость вывода объявлений или ещё чего там:) вы можете изменяя значения переменых

var step = 1;

var tdelay = 20;

Значения в пикселях…

Ну, а если не хотите мучатся, то есть простой html вариант, вставляйте в нужное место код:

<marquee>ТЕКСТ ВАШЕЙ БЕГУЩЕЙ СТРОКИ</marquee>

Но при таком варианте — Вам нужно будет в ручную менять текст…

——————————————————————

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

24 комментария Комментарии。

  1. При тестировании выявились косяки в IE. Если у вас всё съезжает, то в файле beg.php:
    редактируем css

    стиль .marquee-container {
    в нём
    margin:0px auto;
    заменяем на
    margin:0 0 0 0px;
    и добавляем строку относительного позиционирования
    position: relative;

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

  2. А есть вариант поставить бегущую строку просто на текст со ссылкой? Не силен в PHP, боюсь что сам не разберусь… Можно, конечно, использовать этот способ, создать отдельную категорию, вместо поста сделать редирект… Но ведь это изврат. Хотелось бы как-то проще…
    Если есть решение, намыльте, пожалуйста.

  3. Конечно можно, и легко
    Используйте html тег marquee и в него просто текст ссылкой… Всё в html…

    Можно поиграться со стилями, и получить желаемый результат…

  4. Прошу прощения за глупость, никак не могу въехать… Ну, с файлом в папку шаблона — понятно. А дальше? что менять на html? <skj бы очень желательно сделать возможность вставить бегущую строку в любой пост или страницу… А если бы еще не ставить плагин, который будет позволять выполнять PHP в записи — вообще бы было здорово. Можете сделать пример кода? Например со ссылкой на Вашу главную страницу с текстом Бегущая строка на WordPress?
    Спасибо.

  5. Вообщем, ни в каком виде не получилось прикрутить бегущую строку… Не утверждаю, что она не работает… Есть вариант, что руки кривые 🙂
    Плохо не знать синтаксис PHP, надо учиться 🙁
    Мне бы полностью заполненный код, чтобы просто поменять данные на свои — может и получилось бы…
    Пошел искать другое решение…

  6. МиниКину отписал на почту, так как в комментариях код просто отрабатывает 🙂

    Вот пример:


    Мой блог

  7. asokr, большое спасибо. Пробовать уже не буду. Нашел решение здесь: http://gopi.coolpage.biz. Вполне удобный плагинчик и настройки вполне понятны…
    Поставил на этом сайте справа вверху.
    Все равно СПАСИБО 🙂

  8. Полезный плагин. За обзор спасибо, надо будет себе прикрутить.

  9. Отличный скрипт, скиньте на почту правку к коду, чтоб скрипт можно было прикрутить к любой строке в блоге. Спасибо.

  10. Infector,
    Простой html тег есть в конце поста.

    А JS вариант работает…

    Так что отправлять что-либо на почту нет нужды

  11. Спасибо, строка настроилась за 5 минут. Прикольная шняжка. Только вот никак не изменяется скорость вывода. Поставил tdelay 5000, эффект нулевой. В чем мой косяк?

  12. Anri, Увеличьте «шаг»
    var step = 1;
    А задержки оставьте как есть
    var tdelay = 20;

  13. // шаг (в пикселях), с которым будем перемещать текст
    var step = 5;
    // задержка между перемещениями на step пикселей
    var tdelay = 20;
    // строка никак не реагирует, зараза. бежит себе с той же скоростью

  14. Мне вот как раз нужна произвольная строка. Поэтому второй код мне подходит большеТЕКСТ ВАШЕЙ БЕГУЩЕЙ СТРОКИ. Но как вставить в эту строчку кликабельную ссылку?

  15. Простите за глупый вопрос. С сылкой я разобралась. Это же обычный html.

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

  16. Света, вот решение для Вас:

    <marquee onMouseOver="this.stop()" onMouseOut="this.start()">
    ТЕКСТ ВАШЕЙ БЕГУЩЕЙ СТРОКИ
    </marquee>
  17. Да, все работает. Спасиб. 🙂

  18. Татьяна

    Здравствуйте!

    Попробовала Вашу бегущую строку, понравилось.

    Но у меня вопрос. Как изменить интервал между заголовками? (То есть: «Заголовок 1/интервал 1/Заголовок 2/интервал 2/».)

    Заранее спасибо.

  19. полезный сайт! спасибо автору!

  20. тролль

    реализация бегущей строки удалась, но смущает такой момент: после того, как последнее слово скрывается, наступает длинный промежуток (где-то 7 секунд). а это не очень удобно. каким образом можно сократить данный промежуток, то есть, в момент, когда скрывается «хвост фразы», показывалась «голова»?

  21. тролль

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

  22. Спасибо за плагин! как его интегрировать в тему, чтоб на каждой странице была бегущая лента новостей, например под горизонтально расположенным меню…

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


Примечание - Вы можете использовать эти HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>