Найти на сайте
  2. Форумы
  3. ОБСУЖДЕНИЯ
  4. Компоненты
  5. Универсальный каталог
  6. Иконки в объявлениях вместо папок

Иконки в объявлениях вместо папок

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО
#16 3 декабря 2014 в 20:32
Буду очень признателен, думаю не только я один. А то уже и иконки есть-)
0
#17 4 декабря 2014 в 00:18
Если лезть глубоко в дебри кода неохота и названия категорий заранее известно (точнее в моем примере атрибут href) предлагаю следующий "костыль":
файл ../templates/default/css/theme-widgets.css ориентировочно в районе 463 строки.
в .widget_content_tree li{...} заменяем background: url("../images/icons/folder.png") no-repeat left 1px; на background: none; и добавляем position: relative;

далее дописываем 
  1. .widget_content_tree li > a:before {
  2.     content:"";
  3.     display: inline-block;
  4.     position: absolute;
  5.     width: 18px;
  6.     height: 18px;
  7.     top: 1px;
  8.     left: 0;
  9.     background: url("../images/icons/folder.png") no-repeat left 1px;
  10. }
и затем для каждой нужной категории указываем строку .widget_content_tree li > a[href^="/articles/astronomija"]:before {background: url("../images/icons/add.png") no-repeat left 1px;},
где [href^="/articles/astronomija"] — ссылка не страницу куда ведет категория для которой задается иконка
Тут можно проявить фантазию и к примеру засунуть в каждую ссылку какой нибудь идентификатор, и уже по нему делать выборку. В общем простор безграничен))

Таким образом должно получиться примерно следующее:
  1. ...
  2. .widget_content_tree li{
  3.     margin-left: 0px;
  4.     list-style: none;
  5.     padding-left:20px;
  6.     background: none;
  7.     position: relative;
  8. }
  9.  
  10. .widget_content_tree li > a:before {
  11.     content:"";
  12.     display: inline-block;
  13.     position: absolute;
  14.     width: 18px;
  15.     height: 18px;
  16.     top: 1px;
  17.     left: 0;
  18.     background: url("../images/icons/folder.png") no-repeat left 1px;
  19. }
  20.  
  21. .widget_content_tree li > a[href^="/articles/astronomija"]:before {background: url("../images/icons/add.png") no-repeat left 1px;}
  22. .widget_content_tree li > a[href^="/articles/geologija"]:before {background: url("../images/icons/cancel.png") no-repeat left 1px;}
  23. .widget_content_tree li > a[href^="/articles/literatura"]:before {background: url("../images/icons/edit.png") no-repeat left 1px;}
  24. ...
Путь к иконке указываете свой, конечно же))
0
#18 4 декабря 2014 в 10:10
Val

А Вы уверены, что код здесь править надо? Может здесь?
  1. /* ========================================================================== */
  2.  
  3. .content_categories + .filter-panel {
  4.     margin-top: -21px;
  5. }
  6. .content_categories {
  7.     padding:10px 15px;
  8. }
  9.  
  10. .content_categories ul,
  11. .content_categories li { margin:0; padding:0; }
  12.  
  13. .content_categories li {
  14.     display: inline-block;
  15.     height: 32px;
  16.     line-height: 32px;
  17.     font-size: 18px;
  18.     padding-left: 20px;
  19.     background: url("../images/icons/folder.png") no-repeat left center;
  20. 	margin-right: 10px;
  21. }
  22.  
  23. .content_categories li a { color:#68809B; }
  24. .content_categories li a:hover { color:#d35400; }
  25.  
  26. /* ========================================================================== */
  27.  
0
#19 4 декабря 2014 в 11:33
Gudan, я показал для виджета с перечнем категорий, для поля над фильтром сверху контента — да, нужно менять/дополнять в .content_categories
В целом смысл был продемонстрировать принципиальную возможность joke
0
#20 4 декабря 2014 в 20:38
Val, костыль конечно, но за неимением лучшего и это можно использовать.
0
#21 4 декабря 2014 в 21:25
Делал по аналогии, но где-то накосячил наверное, так как папки исчезли, а иконки не появились. Может кто-то подаст руку помощи?
Куралесил в файле \templates\tseso\css\theme-content.css scratch
  1. .content_categories ul,
  2. .content_categories li { margin:0; padding:0; }
  3. /************************/
  4. .content_categories li {
  5.     display: inline-block;
  6.     height: 32px;
  7.     line-height: 32px;
  8.     font-size: 18px;
  9.     padding-left: 20px;
  10.     background: none;
  11. 	position: relative;
  12. }
  13.  
  14. .content_categories li a { color:#68809B; }
  15. .content_categories li a:hover { color:#d35400; }
  16.  
  17. .content_categories li > a[href^="/board/nedvizhimost"]:before {background: url("../images/icons/category/gruz_per.png") no-repeat left 1px;}
0
#22 5 декабря 2014 в 09:08 
  1. .content_categories li {
  2.     display: inline-block;
  3.     height: 32px;
  4.     line-height: 32px;
  5.     font-size: 18px;
  6.     padding-left: 27px;
  7.     margin-right: 10px;
  8.     position: relative;
  9. }
  10.  
  11. .content_categories li a { color:#68809B; }
  12. .content_categories li a:hover { color:#d35400; }
  13.  
  14. .content_categories li a:before {
  15. 	content:""; 
  16. 	display: inline-block; 
  17. 	position: absolute; 
  18. 	width: 24px; 
  19. 	height: 24px; 
  20. 	background: url("../images/icons32/folder.png") no-repeat left center;
  21. 	background-size: cover;
  22. 	left: 0;
  23. 	top: 4px;
  24. }
  25.  
  26. .content_categories li > a[href$="astronomija"]:before {background-image: url("../images/icons32/brick.png");}
  27. .content_categories li > a[href$="geologija"]:before {background-image: url("../images/icons32/page.png");}
  28. .content_categories li > a[href$="literatura"]:before {background-image: url("../images/icons32/user.png");}
joke
0
#23 5 декабря 2014 в 09:33
Ой спасибочки, мил человек! Дай бог тебе здоровья. Сегодня попробую.
0
#24 5 декабря 2014 в 09:50
Зачет 100%. Хоть и костыль, но работает dance
0
Скиньте пример файлик-импорта
Категории и подкатегории в объ

Похожие темы

Ник пользователя вместо id

Релизы 2.X Создана 4 года назад 10 сообщений

[ЗАКРЫТО] Страница вместо главной

Компоненты Создана 3 года назад 6 сообщений

иконки вместо названия поля

Шаблоны, графика, стили Создана 4 года назад 9 сообщений

Значок в меню вместо названия

Шаблоны, графика, стили Создана 3 года назад 7 сообщений

Не отображаются иконки.

Компоненты Создана 4 года назад 40 сообщений

Modern иконки шаблонов списка типов контента

Шаблоны, графика, стили Создана 3 года назад 7 сообщений

InstantCMS Team

Связь с нами
Email dev@instantcms.ru

Делаем полезные Интернет проекты с 2008 года 💫

О проекте

Поддержка

Дополнения

Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.