Помощь Как сделать плавающий блок/модуль рекламы. CMS Joomla 1.5

Статус
В этой теме нельзя размещать новые ответы.
Gudym

Gudym

Постоялец
Регистрация
18 Мар 2013
Сообщения
55
Реакции
24
Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра ссылки Войди или Зарегистрируйся Для просмотра ссылки Войди или Зарегистрируйся » 04 фев 2014, 22:37

Здравствуйте, уважаемые! Хотелось бы попробовать вывести блок рекламы РСЯ в плавающем блоке левой или правой колонке сайта. Движок сайта Joomla 1.5. Пример такого плавающего блока вот: Для просмотра ссылки Войди или Зарегистрируйся. Блок перемещается плавно. Как там написано такое реализуется с помощью jQuery. В интернете есть инструкции, как такое реализовать, но конкретно под Joomla толкового описания не нашел. Т.е. скриптов готовых вроде бы хватает, но как их правильно применить на Joomla 1.5, т.е. какие файлы править, куда вставлять код и т.д.

Есть небльшие познания в HTML и CSS, но вот в скриптах вообще ничего не понимаю.

И так, что имеем. РСЯ вывожу с помощью модуля Mod PHP или можно стандартным текстовым модулем (там есть режим вставки скриптов). В самом модуле есть форма, куда можно вставлять любой код (HTML, CSS, PHP, JS). Вот туда я вставляю код, назначаю позицию модуля (в данном случае это левая или правая колонка), активирую его и реклама отображается в нужном месте. Нужно заставить этот модуль двигаться. Прописываю стили в CSS файле шаблона, чтобы подмарафетить обертку блока и заодно пробовал прописывать position: fixed - но такой грубый вариант фиксации мне совсем не понравился.

Нужно как-то к этому блоку прикрутить эту jQuery. В исходном коде сайта jQuery мелькает несколько раз, наверное она уже установлена, т.к. есть интересный модуль, в котором используются сложные визуальные эффекты.

Если кто-нибудь из форумчан знает, как такое реализовать, то буду рад выслушать любые советы! Всем спасибо!
 
Есть готовое решение для J1.5 Для просмотра ссылки Войди или Зарегистрируйся
Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

Для 2.5 и 3 > Для просмотра ссылки Войди или Зарегистрируйся
Создавайте свой custom html модуль какой вам надо, и ставьте в позицию шаблона.. ну и настраивайте плагин указанный выше..

да, модуль не проверял на зловреды, взят на просторах нета..
 
Последнее редактирование:
Вы же сами дали пример плавающего блока Для просмотра ссылки Войди или Зарегистрируйся
Добавьте стили, подключите jQuery, вставьте код JavaScript в модуль а ниже это кода напишите блок из HTML
в нем вставьте свой код рекламы.
Ведь все прекрасно описано
 
StanyXXX и Genk0, спасибо! Слава Богу получилось разобраться в этом самому, метод тыка творит чудеса. Для таких "непрошаренных" как я сделал подробную инструкцию, как сделать плавающий модуль рекламы в левой или правой колонке на Joomla 1.5 с помощью jQuery.

Шаг 1. Сначала нужно подключить jQuery.

Самый простой способ - это установить плагин plg_jqueryintegrator_j1.5. Вот тут можно скачать сам плагин и посмотреть видео урок по его настройке: Для просмотра ссылки Войди или Зарегистрируйся.
Или можно подключить jQuery вручную. Для этого нужно в файле index.php (лежит в папке с шаблоном) между тегами <head></head> прописать такой вот код:
Код: 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
В данном случае jQuery будет подключаться с сервера Google, что должно обеспечить высокую скорость загрузки. jQuery можно также подключать и с Яндекса, и с официального сайта jQuery, и с собственного сайта. Об этом очень хорошо написано здесь: Для просмотра ссылки Войди или Зарегистрируйся.
Я пробовал подключать jQuery и плагином, и вручную. Разницы никакой, все работает!

Шаг 2. Прописываю класс стиля для модуля в CSS.

В моем случае прописывал класс в файле template_css.css, который лежит в папке CSS шаблона. Сам стиль:
Код: 
#fixed {
    background: #E7E7E7;
    padding: 10px;
    border: 3px solid #597D00;
}

Шаг 3. В менеджере модулей создаю новый модуль.

Можно создать стандартный custom_html модуль, но я использую скачанный mod_php_joomla 1.5, он мне больше нравиться.

Шаг 4. Вставляю код РСЯ и плавающий скрипт в сам модуль.

В настройках модуля вставляю оба скрипта. Сначала вставляю плавающий скрипт, а потом сразу же за ним скрипт РСЯ внутри тегов <div></div>. Получилось вот так:
Код: 
<script type="text/javascript">
    $(function() {
        var offset = $("#fixed").offset();
        var topPadding = 7;
        $(window).scroll(function() {
            if ($(window).scrollTop() > offset.top) {
                $("#fixed").stop().animate({marginTop: $(window).scrollTop() - offset.top + topPadding});
            }
            else {$("#fixed").stop().animate({marginTop: 15});};});
    });
</script>
<div id="fixed"><!-- Яндекс.Директ -->
<script type="text/javascript">
//<![CDATA[
yandex_partner_id = xxxxxx;
yandex_site_bg_color = 'FFFFFF';
yandex_site_charset = 'utf-8';
yandex_ad_format = 'direct';
yandex_font_size = 1.4;
yandex_font_family = 'verdana';
yandex_direct_type = 'vertical';
yandex_direct_limit = 1;
yandex_stat_id = 3;
yandex_direct_title_font_size = 2;
yandex_direct_title_color = 'CC0000';
yandex_direct_url_color = '000000';
yandex_direct_text_color = '000000';
yandex_direct_hover_color = '990000';
yandex_direct_favicon = true;
yandex_no_sitelinks = true;
document.write('<sc'+'ript type="text/javascript" src="http://an.yandex.ru/system/context.js"></sc'+'ript>');
//]]>
</script>
</div>
Включаю модуль и вуаля - модуль плавно передвигается, как нам и надо. Методом тыка также удалось выяснить, что значение var topPadding = 7 делает отступ модуля (когда он в движении) от верхней границы окна браузера, а marginTop: 15 - это отступ модуля (в статичном положении) от верхнего предшествующего ему модуля.
Вместо рекламы подобным путем можно выводить все что угодно, например, формы подписки, контактов и другую важную информацию!
Возможно эта инструкция кому-то поможет и сэкономит драгоценное время. Мне же пришлось возится с этим почти 3 дня :( Зато теперь есть дополнительные знания и понимание!
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху