Полезная информация


----

Начать новую тему Ответить на тему
АвторСообщение

 Сообщение Плавающая панель phpbb3 2012-02-15

Аватар пользователя

Введение

Долгое время я потратил на поиск данной плавающей панели, ни гугл ни яндекс не могли подсказать мне, но вот свершилось чудо и я наконец то нашел необходимый скрипт. Для чего он вообще нужен? Ну кому как, а мне пригодилось для разгрузки шапки форума от множества кнопок, да и вид у нее вполне презентабельный. Впринципе ее работу вы смоежете потестировать у нас на Форуме :co_ol:
Установка

Данная панель очень легка в установке, потребуется лишь правка 2 файлов, займет минут 5, но ясень пень я вам не скину своих конфигов панели, каждый будет волен в своей фантазии и настройке. Итак скачиваем архив и распаковываем его в корень форума.
Вложение :
Комментарий к файлу: скрипт полезной плавающей панели для форума phpbb3
root.rar [21.36 KiB]
Скачиваний: 233

Далее открываем styles/ваш стиль/template/overall_header.html и находим закрывающий тег </head>, перед ним вставляем следущий код
<link type="text/css" href="themes/default/jx.stylesheet.css" rel="stylesheet"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"  type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.jixedbar.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
      $("#sample-bar").jixedbar();
    });
</script>
 

Если у вас уже подключена библиотека JQuery, то убираем строку
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"  type="text/javascript"></script>
 

Из приведенного выше кода.
Далее ищем закрывающий тег </body> в файле overall_footer.html и вставляем перед ним сам код нашей панели
<div id="sample-bar">

   <ul>
      <li title="Home"><a href="http://your.domain.tld/"><img src="img/home.png" alt="" /></a></li>
   </ul>

   <span class="jx-separator-left"></span>
   
   <ul>       
      <li title="Around The Web"><a href="#"><img src="img/web.png" alt="Get Social" /></a>
         <ul>
            <li><a href="http://www.facebook.com/account-name"><img src="img/facebook.png" title="Facebook" />Facebook</a></li>
            <li><a href="http://twitter.com/account-name"><img src="img/twitter.png" title="Twitter" />Twitter</a></li>
            <li><a href="http://www.flickr.com/photos/account-name/"><img src="img/flickr.png" title="Flickr" />Flickr</a></li>
         </ul>
      </li>
   </ul>
   
   <span class="jx-separator-left"></span>
   
   <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
   
   <ul class="jx-bar-button-right">
      <li title="Feeds"><a href="#"><img src="img/feed.png" alt="" /></a>
         <ul>
            <li><a href="http://your.domain.tld/feed/"><img src="img/feed.png" title="Content Feeds" />Content Feed</a></li>
            <li><a href="http://your.domain.tld/comments/"><img src="img/comment.png" title="Comment Feeds" />Comment Feed</a></li>
         </ul>
      </li>
   </ul>
   
   <span class="jx-separator-right"></span>
   
</div>
 

Теперь попробую обьяснить какой кусок за что отвечает. Код
 <ul>
      <li title="Home"><a href="http://your.domain.tld/"><img src="img/home.png" alt="" /></a></li>
   </ul>
 

Это одиночная кнопка-ссылка(в панели нашего форума аналог кнопки На Главную)
 <span class="jx-separator-left"></span>
 

Вертикальный разделитель кнопок
<ul>        
      <li title="Around The Web"><a href="#"><img src="img/web.png" alt="Get Social" /></a>
         <ul>
            <li><a href="http://www.facebook.com/account-name"><img src="img/facebook.png" title="Facebook" />Facebook</a></li>
            <li><a href="http://twitter.com/account-name"><img src="img/twitter.png" title="Twitter" />Twitter</a></li>
            <li><a href="http://www.flickr.com/photos/account-name/"><img src="img/flickr.png" title="Flickr" />Flickr</a></li>
         </ul>
      </li>
   </ul>
 

Это уже многострочное меню(аналог кнопка Развлечения), чтобы добавить еще один пункт меню надо добавить еще одну строку, допустим
  <li><a href="http://www.facebook.com/account-name"><img src="img/facebook.png" title="Facebook" />Facebook</a></li>
 

Думаю итак ясно что ссылки и подписи кнопок нужно поменять на свои. Кстати приведенный выше код отвечает за меню, которое позиционируется ближе к левой стороне, а за правую сторону отвечает кусок
<ul class="jx-bar-button-right">
      <li title="Feeds"><a href="#"><img src="img/feed.png" alt="" /></a>
         <ul>
            <li><a href="http://your.domain.tld/feed/"><img src="img/feed.png" title="Content Feeds" />Content Feed</a></li>
            <li><a href="http://your.domain.tld/comments/"><img src="img/comment.png" title="Comment Feeds" />Comment Feed</a></li>
         </ul>
      </li>
   </ul>
 

Впринципе настройка панели легче некуда, если будут вопросы, то задавайте и не забывайте кеш чистить :co_ol:


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!

Теги темы
Плавающая панель phpbb3, панель навигации phpbb3, скрипт панели навигации phpbb3, топ-бар phpbb3
          Вернуться наверх  
 


Аватар пользователя

Не вспомню уже.
Только заметил, без авторизации все норм, авторизируешься, панелька распадается( в юзер ПУ, кстати, панелька всегда была не норм.
Я как то лечил этот глюк. терь все перепробывал
..., не смог.


Во как.. подключаю <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> и на форуме становится не гуд.
отключаю старую <script type="text/javascript" src="{ROOT_PATH}mchat/jquery-1.10.2.min.js"></script> форум норм.. чет в коде портала. счас покручу)

Пошарил, убрал лишнюю <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> и деинсталировал мчат, стало норм :ya_hoo_oo:

Установил mChat повторно, на портале панелька опять не норм :zvez_ochki:


          Вернуться наверх  
 


Аватар пользователя

Так этот же чат опять добавил в шапку джиквери потому панелька и распадается


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

Шапка ни при чем, т.к. на форуме норм, на портале нет


          Вернуться наверх  
 


Аватар пользователя

Ааа, тогда ясно, нужно в подключении скрипта и css указать прямой путь (полную ссылку с доменом) вместо относительного


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

Ребяятаа, чтобы работала панелька + mChat, тупо удалите файл mchat_ajax_mini.js (вариант для ленивых) или не подключайте его в коде (для тех кому не лень)

СТОП чат не работает без mchat_ajax_mini.js :wo_ol:


          Вернуться наверх  
 


Аватар пользователя

Сергей, как мне подружить /jquery/1.4.2/jquery.min.js который в шапке и mchat_ajax_mini.js который нужен мЧату? Я в ступоре (


          Вернуться наверх  
 


Аватар пользователя

Во вложения в рар архиве прикрепите этот скрипт чата


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

Вот он)
Пожалуйста Зарегистрируйтесь чтобы увидеть ссылку


          Вернуться наверх  
 


Аватар пользователя

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


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

Хорошо, перечитаю


          Вернуться наверх  
 


Аватар пользователя

vga2000 , поступите следующим образом.

1. Вместо вашей jquery.min.js подключите последнюю библиотеку 1.11.1
Пожалуйста Зарегистрируйтесь чтобы увидеть ссылку
.
<script src="путь к скрипту/js/jquery.1.11.1.min.js" type="text/javascript"></script>
 


2. Ниже подключите библиотеку 1.7.1
Пожалуйста Зарегистрируйтесь чтобы увидеть ссылку

<script src="путь к скрипту/js/jquery.1.7.1.min.js" type="text/javascript"></script>
<script>var jquery_1_7_1 = jQuery;</script>
 

Последняя строка вышеприведенного кода объединяет две библиотеки в одно целое. Сначала происходит поиск в библиотеке 1.11.1 и если не найдена нужная функция, то в библиотеке 1.7.1.

Если установлен мод сполера с множественными вложениями то билиотека 1.7.1 у вас будет подключена :
<script src="{PPKBB3CKER_ADDONS}js/jquery-min.js" type="text/javascript"></script>
 
и ее нужно исправить по вышеприведенному методу.


3. Далее подключите скрипт чата mchat_ajax_mini.js.

4. Теперь подключаем плавающую панель. Библиотека 1.4.2 не нужна и не подключается.
<!-- jixedbar starts here -->
<link type="text/css" href="путь к папке/menu/default/jx.stylesheet.css" rel="stylesheet" />
<script type="text/javascript" src="путь к папке/js/jquery.jixedbar.min.js"></script>
<script type="text/javascript">
// <![CDATA[
jQuery.noConflict()(function(){
    jQuery(document).ready(function() { 
      jQuery("#sample-bar").jixedbar();
    });})();
   // ]]>
</script>
<!-- jixedbar ends here -->
 


В итоге получаем две подключенные библиотеки (jquery.1.11.1.min и jquery.1.7.1.min.js), с которыми стабильно работают все актуальные на данный момент моды и избавляемся от конфликтной и устаревшей библиотеки jquery.1.4.2.min.js.


          Вернуться наверх  
 


Аватар пользователя

Спасибо большое. Только в таком порядке подключаем:

<script src="http://forma-slova.ru/js/jquery.1.11.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://forma-slova.ru/mchat/mchat_ajax_mini.js"></script>
<script src="http://forma-slova.ru/js/jquery.1.7.1.min.js" type="text/javascript"></script>
<script>var jquery_1_7_1 = jQuery;</script>
<script type="text/javascript" src="http://forma-slova.ru/js/jquery.jixedbar.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#sample-bar").jixedbar();
});



Информация о редактировании
Последний раз редактировалось vga2000 27 окт 2014, 18:10, всего редактировалось 1 раз.
          Вернуться наверх  
 


Аватар пользователя

А если панелька стала такой и уехала влево:


Где, примерно, крутить?

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


          Вернуться наверх  
 


Аватар пользователя

vga2000 писал(а):

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

Сама по себе не должна она вид поменять, вы в панель не добавляли ничего??


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

vga2000 писал(а):

Где, примерно, крутить?
<div id="demo-bar">
        <ul>
            <li title="Главная"><a href="{U_INDEX}" title="{L_INDEX}"><img src="{PPKBB3CKER_ADDONS}images/menu/home.png" alt="" /></a></li>
        </ul>
        <span class="jx-separator-left"></span>
      <ul>       
            <li title="Моды"><a href="#"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" alt="Моды" /></a>
                <ul>
                    <li><a href="{U_INDEX}/karti/"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" title="" alt=""  />&nbsp;&nbsp;&nbsp;Карты</a></li>
                    <li><a href="{U_INDEX}/modi-jazzycat/"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" title="" alt=""  />&nbsp;&nbsp;&nbsp;Моды от Jazzycat</a></li>
                    <li><a href="{U_INDEX}/fizika/"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" title="" alt=""  />&nbsp;&nbsp;&nbsp;Физика. Управление</a></li>
                    <li><a href="{U_INDEX}/sborki/"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" title="" alt=""  />&nbsp;&nbsp;&nbsp;Сборки</a></li>
               <li><a href="{U_INDEX}/raznie-poleznosti/"><img src="{PPKBB3CKER_ADDONS}images/menu/network.png" title="" alt="" />&nbsp;&nbsp;&nbsp;Разные полезности</a></li>
                </ul>
            </li>
        </ul>
        <span class="jx-separator-left"></span>
        <ul>
            <li title="Моддинг"><a href="#"><img src="{PPKBB3CKER_ADDONS}images/menu/info.png" alt="Моддинг" /></a>
            <ul>
               <li><a href="{U_INDEX}/program-modding/"><img src="{PPKBB3CKER_ADDONS}images/menu/info.png" title="Софт для моддинга" />&nbsp;&nbsp;&nbsp;Софт для моддинга</a></li>
            </ul>
         </li>
            <li title="Resume"><a href="http://ryan.rawswift.com/resume/"><img src="{PPKBB3CKER_ADDONS}images/menu/blogs.png" alt="" /></a></li>
         <li title="Portfolio"><a href="http://ryan.rawswift.com/portfolio/"><img src="{PPKBB3CKER_ADDONS}images/menu/block.png" alt="" /></a></li>
        </ul>
        <span class="jx-separator-left"></span>       
      <div class="text-container">jQuery fixed bar plugin.</div>
        <ul class="jx-bar-button-right">
         <li title="Feeds"><a href="#"><img src="{PPKBB3CKER_ADDONS}images/menu/feed.png" alt="" /></a>
                <ul>
                  <li><a href="http://ryan.rawswift.com/feed/"><img src="{PPKBB3CKER_ADDONS}images/menu/feed-doc.png" title="Content Feed" />&nbsp;&nbsp;&nbsp;Content Feed</a></li>
                  <li><a href="http://ryan.rawswift.com/comments/feed/"><img src="{PPKBB3CKER_ADDONS}images/menu/ballon.png" title="Comment Feed" />&nbsp;&nbsp;&nbsp;Comment Feed</a></li>
                </ul>
         </li>
        </ul>
        <span class="jx-separator-right"></span>
</div>
 

Обратите внимание, что в выпадающем списке нужно сделать так: title="" alt=""


          Вернуться наверх  
 


Аватар пользователя

да,да, Игорь, я это учел. Не там собака порылась). И так, удаляю каталог tracker (новый спойлер) нормализуется панелька. Т.е. точку входа лопаты нашел, копать надо там))

Опять этот JQuery как я его ненавижу :po_zor:
Дело в нем(


          Вернуться наверх  
 


Аватар пользователя

Спасибо, это отличная штукенция! Весь интернет обыскала и ничего подобного не нашла! Это то, что надо!!! :bra_vo:

Но у меня возник вопрос:

Меню работает отображается корректно в портале и на форуме, а в галереи вот так:
Пожалуйста Зарегистрируйтесь чтобы увидеть ссылку
Почему? (Кстати, кнопка "вверх" у меня тоже там не работает) Впрочем, это уже пожожн совсем другая тема...
Ещё раз спасибо!

С наступающим новым годом! С новыми успехами! :danser_dans: :ya_hoo_oo:


          Вернуться наверх  
 


Аватар пользователя

Неа, просто надо файлы-скрипты закинуть в корневую папку галереи, тогда и будет работать


_________________
Подпись:
-_- -_-
На вопросы, связанные с phpBB, по ЛС не отвечаю !!!
          Вернуться наверх  
 


Аватар пользователя

Спасибо! :bra_vo:
Заработало :dan_ser:

Я не знаете с чем может быть связано то, что фото из галереии нельзя вставить автоматически? тема...


          Вернуться наверх  
 


Аватар пользователя

Возможно, у меня из-за него новое меню конфликтует. Из хедера код убрала, из оверала тоже. Теперь из корня удалить две папки js и themes, да? Они ж только от этого мода? Больше ничего не слетит?


          Вернуться наверх  
 
 
Начать новую тему Ответить на тему


Дополнительные возможности

  Похожие темы  Автор  Ответов  Просмотров  Последнее сообщение 
Аватар пользователя Плавающая панель на Форуме
Плавающая панель на Форуме

DeaDRoMeO

5

965

Аватар пользователя

15 фев 2012, 20:31

DeaDRoMeO

Аватар пользователя Кусочек кода который отображает линк на панель модератора
Подскажите пожалуйста кусок кода который который выводит ссылку на панель модератора

lex0013

2

486

Аватар пользователя

12 фев 2016, 18:28

lex0013

Аватар пользователя Top Stats phpbb3
Top Stats - модификация для phpbb3, организующая на главной странице форума 7 блоков с разнообразной статистикой

DeaDRoMeO

73

11533

Аватар пользователя

08 янв 2016, 11:22

DeaDRoMeO

Аватар пользователя Трояны и phpbb3
Поговорим вообщем о заражениях форума

DeaDRoMeO

42

2828

Аватар пользователя

03 сен 2013, 20:43

DeaDRoMeO

Аватар пользователя phpBB3 для чайников ;)
Вводная статья для начинающих админов phpbb3, в ней будут рассмотрены основные положения и настройки phpbb3

DeaDRoMeO

531

21299

Аватар пользователя

01 май 2017, 20:26

DeaDRoMeO

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

Поделиться темой с помощью

Ссылки на тему

Прямая ссылка:
BB-код для форумов, сайтов, блогов:
HTML ссылка:
 


Самая неформальная поддержка phpBB :P