Стиль списка для типов контента

+7
1.74K

По мотивам этой темы.

На днях представлю большое количество разнообразных списков для типов контента — ну а пока выкладываю на общий суд один из стилей, который можно скачать в прикрепленном файле к этому посту. Дэмо смотреть тут

Изображение

Начиная с версии 2.15.1 InstantCms поддерживает пользовательские настройки для списков (если они предусмотрены в шаблоне). В данном шаблоне предусмотрены следующие настройки:

  1. {"cols": "2"} - количество колонок списка
  2. {"datepost": "true"} - Показывать дату в верхнем правом углу. Принимает значение true или false
  3. {"dbg": "#E30000"} - Фон лейбла с датой публикации
  4. {"random": "true"} - Включить рандомные цвета для тегов. Принимает значение true или false
  5. {"preset": "big"} - Пресет поля с изображением

Список будет работать и на версиях ниже 2.15.1

Предусмотрены настройки для приватных записей списка контента, а также для записей, имеющих в записи отмеченный чекбокс is_vip.

Данный стиль представлен больше для ознакомления и подойдет для версий 2.14 а также для шаблонов, у которых подключен bootstrap.

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

Демо смотреть тут.

Как установить:

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

  1. {"random":"true", "dbg": "#125DB9", "preset": "big", "cols": "2", "datepost": "true"}
Прикреплённый файл:
Скачать 6 Кбскачан 66 раз
+1
Алексей Т Алексей Т 3 года назад #

То что надо и долго ждем

+1
Nikolay Nikolay 3 года назад #

Хороший виджет!!! Есть вопрос как вместо (дней назад) втулить название категории?

+2
Make Make 3 года назад #

Это не виджет. Название категории — никак. Запись может принадлежать не одной категории. В полноценном релизе будет возможность назначать поля для различных элементов в списке. 

+2
Nikolay Nikolay 3 года назад #

Вот бы тогда ещё виджет типо такого.

+2
Make Make 3 года назад #
+7
Fuze Fuze 3 года назад #

Позанудствую) исключительно, чтобы всем стало лучше

  • Почему есть инлайн стили, если подключается grids.css?
  • Почему grids.css подключается так, а не через addTplCSS, где не надо указывать шаблон и работает наследование?
  • $list_opt['random'] == true. Если опции $list_opt['random'] нет, будет нотис. И что за странное сравнение, если надо точно true, то почему не три равно? почему не вот так: if(!empty($list_opt['random'])){… }
  • А если будут другие поля для показа в списке, что делаем?) Правильно, слушаем в комментах, что не работает))
  • Наконец, почему не SCSS и не все те переменные бутстрапа типа отступов, цветов и т.п.

И да. Я поддерживаю тех, кто говорил, что количество — не качество. Моё предложение — сделать для начала один новый стиль списка. По уму. Со своей стороны, я могу помочь ответами на вопросы, если таковые будут: тут в комментах или в темах на форуме. Да, это сложно, не быстро. Зато, говорят, респектуют за качество)

Всегда включайте показ всех ошибок и предупреждений PHP при разработке.

Да, и ещё можно юзать общепринятые методологии, например БЭМ. Я пытался, но времени на всё не хватило, каюсь, поленился)

+2
Make Make 3 года назад #

Спасибо, все учту. Это пока не тянет на супер качество, собственно поэтому и выложил, чтобы собрать feedback

+2
Fuze Fuze 3 года назад #

собственно поэтому и выложил, чтобы собрать feedback

Всё что знал, рассказал 🙂

0
Make Make 3 года назад #

Вот с полями, которые пользователь отмечает для показа в списке, совсем не знаю, как лучше. Перебирать массив fields — это правильно. Но как быть, если поле нужно показать в определенной позиции, например сразу после заголовка посредством bootstrap элемента badges. Привязываться к селектору поля? Например класс поля может содержать top-right, тогда в списке можно прописать, что если у поля есть какой-то из нужных классов, то показать его -> вооон там. В общем, вопросов на самом деле много, буду занудствовать на форуме

+1
Fuze Fuze 3 года назад #

Но как быть, если поле нужно показать в определенной позиции, например сразу после заголовка посредством bootstrap элемента badges.

Порядок вывода настраивается в админке же. По факту из нестандартного, это поле изображения для бэкграунда, его кстати тоже можно взять $item['fields'] и за ансетить потом, чтобы при переборе не вывелось. Остальные элементы — привязывать к родительскому элементу списка (можно же назвать как угодно, уникально) и от него уже строить правила CSS, например:

  1. <div class="content-item content-item__mysuperstyle">
  2. <div class="field ft_caption">Заголовок</div>
  3. </div>
  1. .content-item__mysuperstyle .ft_caption {
  2. // пишем свои стили
  3. }
  4.  

посредством bootstrap элемента badges

Так нам ведь необязательно присваивать классы, хотя возможность присваивать классы контейнерам полей есть с прошлой версии. В стилях написали стиль как badges для нужного вам элемента и вуаля. Тем более, используя SCSS это вообще на раз два.

0
Make Make 3 года назад #

Ну вот, ещё + в базу знаний. Спасибо) 

+3
Fuze Fuze 3 года назад #

Да, кстати, с иконками переключения стилей списков я попробую что-то решить в опциях, а то ради одной строчки править целый файл как то не очень.

+1
Алексей Т Алексей Т 3 года назад #

Спасибо! Така как список ТК это почти пол дизайна самого сайта и очень не хватает разных стилей под типовые решения. Каталог, витрина магазина, домино сетка и так далее. Что то типа конструктора :)

0
Make Make 3 года назад #

Алексей, ты всё грезишь конструкторами))) Поверь, когда начнешь редактировать руками, ты влюбиштся в это, и никаких конструкторов не нужно) 

+1
Fuze Fuze 3 года назад #

Что то типа конструктора :)

Это я не умею)

+2
Panda58dev Panda58dev 3 года назад #

Почему никто не любит кнопку «подробнее», что за дань metro-интерфейсу?))
(все стили не смотрел)

0
Make Make 3 года назад #

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

  1. <a class = "btn btn-primary" href = "<?php echo href_to($ctype['name'], $item['slug'].'.html'); ?>">Подробнее</a>

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

+3
RSN RSN 3 года назад #

Наконец нашелся человек занявшийся этим вопросом))

Три года я пытался обратить внимание разработчиков (писал и в комментариях и на форумах), что в каталоге почти не осталось нормальных рабочих слайдеров, актуальных, современных, стилей списков, виджетов для вывода списков контента...

С последними двумя (виджетами и списками) немного начало что то появляться) хотя конечно этого мало. 

Make, так держать!!!))… (желательно не забрасывать)))

+1
Make Make 3 года назад #

Ну пока не рожу что-то более-менее рабочее, за другое не сажусь.OneBlock только обновлю щас 😬

+1
Алексей Т Алексей Т 3 года назад #

Ребята смотрите, а почему бы не вынести настройки как в виджете список контента и поля которые надо выводить из настроек. Хорошее дело. Еще раз повторюсь, список контента это пол дела вида шаблона. Иногда я даже ставил магазин от Провиза что бы у меня список контента выглядел как по типу магаза))) 😬

+1
Fuze Fuze 3 года назад #

А это что?

Изображение

+1
Алексей Т Алексей Т 3 года назад #

Ну так то вы правы- тогда верстальщики Вам открыт путь для создания списков для ТК. Я вот тут начал накидывать свои мысли 

+2
Fuze Fuze 3 года назад #

Первый и третий список делается штатно. Первый делается одной опцией — обтекание поля изображение. Третий — это стиль плитка.

Для второго надо лишь подкинуть пару стилей, даже файлы tpl править не надо.

+1
Make Make 3 года назад #

Не, это практические тоже самое, что уже есть. Когда-то я вдохновился стилями от студии ThemeWay — они делали мега крутые вещи, но по каким-то причинам уже давно профили на маркетплейсах удалены. Если найду на старом ноуте, покажу — там из простого списка люди делали такой вид, как будто журнал листаешь. Очень круто. Поэтому и хочется сделать что-то удивительно яркое, цепляющее и нестандартное. Да, списки, плитки, таблицы — это уже классика, но на всех почти cms стандартно шаблонный стиль для контента — нет изюминки, фичи, которая бы цепанула раз и навсегда. Короче постараюсь сделать чтобы было круто, современно и креативно. И чтобы Fuze не краснел за код 😁

+2
Fuze Fuze 3 года назад #

И чтобы Fuze не краснел за код

Пффф, подержите моё пиво. Что мне краснеть за чужой код, я за свой то не краснею 😂

0
Алексей Т Алексей Т 3 года назад #

+1
Make Make 3 года назад #

Вот это уже что-то интересное. Только еще раз повторюсь — вывести категорию в списке не получится — даже заморачиваться не буду

0
Make Make 3 года назад #

Как-то на форуме поднимали эту тему, но так и не пришли к более менее рабочему решению

0
Loadырь Loadырь 3 года назад #

Есть же поле «Категории контента» в списке полей в 2.15.1 github.com/instantsoft/icms2/blob/master/system/fields/category.php

0
Make Make 3 года назад #

Да, точно, я его еще даже ни раз не попытался использовать) Спасибо, посмотрю

+1
Алексей Т Алексей Т 3 года назад #

Оно появилось в крайнем обновлении. И вообще Инстант стал намного лучше с этими обновлениями. Быстрее и современней.

+2
Fuze Fuze 3 года назад #

я его еще даже ни раз не попытался использовать) Спасибо, посмотрю

Начните с демо. Или в чистой установке оно добавлено для типа контента «Новости».

0
Casser Casser 3 года назад #

Вот этот интересней вариант, более современный

Алексей Т Алексей Т 3 года назад #
Комментарий удален
0
Эндрю Ua Эндрю Ua 3 года назад #

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

0
DeeMon DeeMon 2 года назад #

Может показ тегов в списке отключить? Зачем они там?

0
rshabalin rshabalin 3 года назад #

А как сделать тоже самое только с виджетом списка контента? 

0
Abobo Abobo 2 года назад #

А большое количество разнообразных списков для типов контента еще не готово? Может складчину организовать, денежкой скинуться ?

Еще от автора

Бесплатный компонент - управление страницами 404
Простой компонент, который позволяет переопределить настройки дефолтной страницы 404, а также установить новую на выбор из двух представленных шаблоно
User-Panel v.1.0.4
Большое обновление виджета, множество улучшений, а также дополнительный запланированный функционал.
User-панель. Функциональное меню для вашего сайта
Виджет, который позволит вывести на вашем сайте функциональную панель с различными настройками.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.