http1 Опубликовано 29 ноября, 2015 Поделиться Опубликовано 29 ноября, 2015 Просмотр файла Category Tabs by IPS Themes Category Tabs for IPS Community Suite 4 is a simple plugin that will convert all or specific forum categories into a tab system. Clicking a new tab will hide the currently shown category and then instantly load the new one. Category Tabs is fully responsive and comes shipped with five different tab styles. Features Five unique themes to choose from Add an "All" tab which will show all categories Choose which groups have access to Category Tabs. Assign specific categories to tabs. Align the tabs left, right or center. Integrated with IPS4 Localization Coming Soon Additional themes Unique icons per tab Добавил http1 Добавлено 29.11.2015 Категория Интерфейс Язык Язык: EN Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
poreeff Опубликовано 2 марта, 2017 Поделиться Опубликовано 2 марта, 2017 Очень сильно смущает вкладка Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Sipsb Опубликовано 2 марта, 2017 Поделиться Опубликовано 2 марта, 2017 Вы на год смотрели? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
poreeff Опубликовано 2 марта, 2017 Поделиться Опубликовано 2 марта, 2017 2 часа назад, Sipsb сказал: Вы на год смотрели? А год здесь при чем, тема в IPS за это время особо не менялась, а модулю большего и не надо. В общем, переделал его немного, чтоб можно было использовать "спокойнее" (без этой вкладки с ключом) и вроде как "чистый" вариант получается... Автор зашифровал JS и CSS в своем модуле, непонятно только для чего, если только совсем от школьников... Ибо тот же DevToosl в Хроме все прекрасно дешифрует и показывает. Итак, переходим в редактирование темы: forums/front/index/index и после строки (в самом начале): {template="pageHeader" group="global" app="core" params="\IPS\Member::loggedIn()->language()->addToStack('forums')"} Вставляем код: <div id="catTabs" class="ipsthemesCategoryTabs ipsTabs ipsClearfix theme1 pos1" data-nodes="3,15,20,25,30,1" data-alltab="{"enabled":"1","lang":"Все разделы"}" data-controller="plugins.ipsthemesCategoryTabs"><ol role="tablist"><li><a href="#" class="tab-all ipsTabs_item ipsTabs_activeItem"></a></li></ol></div> Основные параметры:data-nodes= здесь перечислены ID категорий - которые хотим показать во вкладкахdata-alltab= выводит самым первым вкладку на все разделы, если не нужна - можно вообще этот параметр удалить Ну и скрипт со стилем, думаю тут уже понятно где подключать.. Спойлер <script> (function($, _, undefined) { "use strict"; ips.controller.register('plugins.ipsthemesCategoryTabs', { initialize: function() { var self = this; self.container = self.scope, self.nodeIDs = self.container.data('nodes'), self.all_tab = self.container.data('alltab'), self.nodeArray = self.nodeIDs.indexOf(',') === -1 ? false : self.nodeIDs.split(','); self.cats = []; if (!self.nodeArray) { self.container.remove(); return; } for (var i = 0; i < self.nodeArray.length; i++) { self.cats.push('.cForumList > li[data-categoryid="' + self.nodeArray[i] + '"]'); } self.cats = $(self.cats.join(',')); self.buildTabs().then(self.setupEvents()).then(function() { self.container.find("li:first-child a").trigger("click"); }); }, buildTabs: function() { var d = $.Deferred(), self = this; self.cats.not(':first').hide(); self.cats.each(function() { var t = $(this), anch = t.find('.cForumTitle a:last-child').eq(0).clone().addClass('ipsTabs_item'), unread = t.find(".ipsDataItem_unread").length != 0 ? "unread" : ""; anch[0].rel = t.attr('data-categoryid').split(' ').pop(); $('<li/>').append(anch).addClass(unread).appendTo(self.container.children('ol')); }); if (self.all_tab.enabled == "1") { self.buildAllTab(); } d.resolve(); return d.promise(); }, buildAllTab: function() { var link = $("<a/>", { href: "#", text: this.all_tab.lang, class: "tab-all ipsTabs_item" }); this.container.children('ol').prepend($("<li/>").append(link)); }, setupEvents: function(options) { var d = $.Deferred(), self = this; self.link = self.container.find('a'); self.link.on('click', function(e) { e.preventDefault(); var t = $(this); if (t.hasClass("tab-all")) { self.hideTab().then(function() { t.addClass('ipsTabs_activeItem'); self.cats.show(); }); return } self.hideTab().then(self.showTab(t)); }); d.resolve(); return d.promise(); }, hideTab: function() { var d = $.Deferred(); this.link.removeClass('ipsTabs_activeItem'); this.cats.hide(); d.resolve(); return d.promise(); }, showTab: function(t) { var catId = t.attr('rel'); t.addClass('ipsTabs_activeItem'); this.container.parent().find('li.cForumRow[data-categoryid="' + catId + '"]').show(); } }); }(jQuery, _)); </script> <style> #catTabs { margin-bottom: 15px; } #catTabs ol { list-style-type: none; margin: 0; padding: 0; } @media screen and (max-width:767px) { #catTabs ol { margin-top: 10px; width: 100%; } } #catTabs ol > li { float: left; } @media screen and (max-width:767px) { #catTabs ol > li { margin-bottom: 4px !important; width: 100%; } #catTabs ol > li .ipsTabs_item { width: 100%; } } #catTabs ol > li .ipsTabs_item:not(.ipsTabs_activeItem) { display: block !important; } #catTabs.pos1 > ol { float: left; } </style> Стиль под тему Default, переделываем по свою. Итог: Все работает без всякого модуля, указываем ID разделов - которые нужны во вкладках, забиваем на это болт и живем спокойно. Протестировано на 4.1.18.2 Боже, какой же я хернёй иногда по ночам занимаюсь... andros0789 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Briandressx Опубликовано 30 декабря, 2018 Поделиться Опубликовано 30 декабря, 2018 muchisimas gracias thanks you Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
yRestrict Опубликовано 12 января, 2019 Поделиться Опубликовано 12 января, 2019 В 02/03/2017 в 01:00, poreeff сказал: А год здесь при чем, тема в IPS за это время особо не менялась, а модулю большего и не надо. В общем, переделал его немного, чтоб можно было использовать "спокойнее" (без этой вкладки с ключом) и вроде как "чистый" вариант получается... Автор зашифровал JS и CSS в своем модуле, непонятно только для чего, если только совсем от школьников... Ибо тот же DevToosl в Хроме все прекрасно дешифрует и показывает. Итак, переходим в редактирование темы: forums/front/index/index и после строки (в самом начале): Cole o código: Parâmetros principais: data-nodes = lista IDs de categoria aqui - que queremos mostrar nas guias data-alltab = exibe a primeira guia em todas as seções, se não for necessário - você pode excluir esse parâmetro. Bem, o script com o estilo, já está claro onde conectar .. Mostrar conteúdo <script> (function($, _, undefined) { "use strict"; ips.controller.register('plugins.ipsthemesCategoryTabs', { initialize: function() { var self = this; self.container = self.scope, self.nodeIDs = self.container.data('nodes'), self.all_tab = self.container.data('alltab'), self.nodeArray = self.nodeIDs.indexOf(',') === -1 ? false : self.nodeIDs.split(','); self.cats = []; if (!self.nodeArray) { self.container.remove(); return; } for (var i = 0; i < self.nodeArray.length; i++) { self.cats.push('.cForumList > li[data-categoryid="' + self.nodeArray[i] + '"]'); } self.cats = $(self.cats.join(',')); self.buildTabs().then(self.setupEvents()).then(function() { self.container.find("li:first-child a").trigger("click"); }); }, buildTabs: function() { var d = $.Deferred(), self = this; self.cats.not(':first').hide(); self.cats.each(function() { var t = $(this), anch = t.find('.cForumTitle a:last-child').eq(0).clone().addClass('ipsTabs_item'), unread = t.find(".ipsDataItem_unread").length != 0 ? "unread" : ""; anch[0].rel = t.attr('data-categoryid').split(' ').pop(); $('<li/>').append(anch).addClass(unread).appendTo(self.container.children('ol')); }); if (self.all_tab.enabled == "1") { self.buildAllTab(); } d.resolve(); return d.promise(); }, buildAllTab: function() { var link = $("<a/>", { href: "#", text: this.all_tab.lang, class: "tab-all ipsTabs_item" }); this.container.children('ol').prepend($("<li/>").append(link)); }, setupEvents: function(options) { var d = $.Deferred(), self = this; self.link = self.container.find('a'); self.link.on('click', function(e) { e.preventDefault(); var t = $(this); if (t.hasClass("tab-all")) { self.hideTab().then(function() { t.addClass('ipsTabs_activeItem'); self.cats.show(); }); return } self.hideTab().then(self.showTab(t)); }); d.resolve(); return d.promise(); }, hideTab: function() { var d = $.Deferred(); this.link.removeClass('ipsTabs_activeItem'); this.cats.hide(); d.resolve(); return d.promise(); }, showTab: function(t) { var catId = t.attr('rel'); t.addClass('ipsTabs_activeItem'); this.container.parent().find('li.cForumRow[data-categoryid="' + catId + '"]').show(); } }); }(jQuery, _)); </script> <style> #catTabs { margin-bottom: 15px; } #catTabs ol { list-style-type: none; margin: 0; padding: 0; } @media screen and (max-width:767px) { #catTabs ol { margin-top: 10px; width: 100%; } } #catTabs ol > li { float: left; } @media screen and (max-width:767px) { #catTabs ol > li { margin-bottom: 4px !important; width: 100%; } #catTabs ol > li .ipsTabs_item { width: 100%; } } #catTabs ol > li .ipsTabs_item:not(.ipsTabs_activeItem) { display: block !important; } #catTabs.pos1 > ol { float: left; } </style> Estilo sob o tema do padrão, podemos refazer de acordo com o nosso. Conclusão: Tudo funciona sem nenhum módulo, especificamos o ID das seções - as quais são necessárias nas guias, nós as soltamos e vivemos em paz. Testado em 4.1.18.2 Deus, que tipo de besteira eu às vezes faço à noite ... You can do a tutorial on how to do this Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
cards-vip Опубликовано 31 августа, 2019 Поделиться Опубликовано 31 августа, 2019 В 02.03.2017 в 09:00, poreeff сказал: data-alltab= выводит самым первым вкладку на все разделы, если не нужна - можно вообще этот параметр удалить после удаления, скрипт перестает работать и вместо вкладок появляются ссылки на категории Только что, cards-vip сказал: после удаления, скрипт перестает работать и вместо вкладок появляются ссылки на категории Помогите решить проблемку пожалуйста Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
RattieRats Опубликовано 19 октября, 2019 Поделиться Опубликовано 19 октября, 2019 Glad to of found this i used it alot on mybb so nice to see it for ipb Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Dimarik111 Опубликовано 1 января, 2023 Поделиться Опубликовано 1 января, 2023 Обновлен работает под последнюю версию IPS (JD)category tabs.xml Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.