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

[Mirovinger]

Mirovinger добавил(а) новый ресурс:

Less для изображений в качестве кастомных иконок форумов (категорий), страниц, ссылок - Изображения в качестве кастомных иконок форумов (категорий), страниц, ссылок

Для изменения иконок Font Awesome у разделов на изображения, достаточно добавить в extra.less такой код.

.fox-nodeImgIcons(@node-id; @unreadImage: false; @readImage: false; @height: 40px; @width: 40px) {
    .node--id@{node-id} {
        .node-icon i {
            &:before {
                content: none;
            }

            .node--read& {
                & when (@readImage = false) {
                    -webkit-filter: grayscale(100%)...

Узнать больше об этом ресурсе...

 

[Vladimir Mirno]

Подскажите, пожалуйста, как добавить иконки-изображения во всплывающее меню "Подфорумы"?

 

[Mirovinger]

На данный момент, здесь такой возможности нет, возможно позже добавлю, а пока можно css кодом.

 

[.endme]

Более не актуально?
Версия 2.1.6
В экстра весь код, далее строчка :

.fox-nodeImgIcons(21; url("styles/basic/xenforo/forum_new.png"); url("styles/basic/xenforo/forum_old.png"); 42px; 42px);

Но значок просто исчез)

 

[Mirovinger]

Всё работает, если верно сделать, здесь не важна версия, классы не изменялись.

 

[tortiq]

Как убрать дефолтную иконку, которая накладывается сверху ?

 

[Skaiman]

Как убрать дефолтную иконку, которая накладывается сверху ?

Специфика стиля, возможно в настройках есть отключение иконок стиля. Вопрос в тему стиля.

 

[karbit]

Такой код у меня:

.fox-nodeImgIcons(@node-id; @unreadImage; @readImage: false; @height: 50px; @width: 50px) {
    .node--id@{node-id} {
        .node-icon i {
            &:before {
                content: none;
            }

            .node--read& {
                & when (@readImage = false) {
                    -webkit-filter: grayscale(100%);
                    filter: grayscale(100%);
                }
            }

            .node--forum&,
            .node--category& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }

                .node--read& when (isurl(@readImage)) {
                    background: @readImage no-repeat;
                }
            }

            .node--page& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }

            .node--link& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }
        }
    }
}

.fox-nodeImgIcons(2; url(".png"); url("styles/basic/xenforo/forum_old.png"); 50px; 50px);
.fox-nodeImgIcons(3; url("styles/basic/xenforo/forum_two_new.png"); url("styles/basic/xenforo/forum_two_old.png"));
.fox-nodeImgIcons(4; url("/50.png"));

Такая шляпа получается, что не так? 0_о

 

[Skaiman]

karbit, просто внимательно прочти мануал

 

[karbit]

karbit, просто внимательно прочти мануал

внимательно прочитал, я код взял поменял только размер, картинку закинул тоже 50 на 50. Все равно не вижу что не так

 

[Mirovinger]

Хм, а что за непонятное, передано во втором параметре?

 

[Ислам]

Здравствуйте.

.node--forum&,
            .node--category& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }

                .node--read& when (isurl(@readImage)) {
                    background: @readImage no-repeat;
                }
            }

            .node--page& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }

            .node--link& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }
        }
    }
}

.fox-nodeImgIcons(210; url("styles/basic/xenforo_ICON/Blokcheyn i kriptovalyuty.svg"); 42px; 42px);

Добавил вот этот код в шаблон extra.less и все съехалось

Подскажите что не так сделал?

 

[Skaiman]

ну это просто не весь код, который в мануале

 

[Mirovinger]

Как бы там ещё и не изображение, каковым оно должно быть и пробелы, которые иногда могут играть роль в пути.

 

[Rasul]

Ребят подскажите пожалуйста в чем может быть дело иконка размером 42x42 а отображается не по центру а в право уходит

 

[Mirovinger]

Сложно сказать, если не видеть в живую, хотя бы показали код как делаете.

 

[Rasul]

Сложно сказать, если не видеть в живую, хотя бы показали код как делаете.

.fox-nodeImgIcons(@node-id; @unreadImage; @readImage: false; @height: 40px; @width: 40px) {
    .node--id@{node-id} {
        .node-icon i {
            &:before {
                content: none;
            }

            .node--read& {
                & when (@readImage = false) {
                    -webkit-filter: grayscale(100%);
                    filter: grayscale(100%);
                }
            }

            .node--forum&,
            .node--category& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }

                .node--read& when (isurl(@readImage)) {
                    background: @readImage no-repeat;
                }
            }

            .node--page& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }

            .node--link& {
                & when (isurl(@unreadImage)) {
                    background: @unreadImage no-repeat;
                }
                & when (ispixel(@height)), (ispixel(@width)) {
                    height: @height;
                    width: @width;
                }
            }
        }
    }
}

.fox-nodeImgIcons(2; url("styles/basic/xenforo/forum_new.png"); url("styles/basic/xenforo/forum_old.png"); 42px; 42px);
.fox-nodeImgIcons(3; url("styles/basic/xenforo/forum_two_new.png"); url("styles/basic/xenforo/forum_two_old.png"));
.fox-nodeImgIcons(4; url("styles/basic/xenforo/forum_two_new.png"));

Всё по инструкции делаю, только свои ссылки вставляю да и изображение размерами 42 х 42

 

[Mirovinger]

Изображения можно прикрепить, можно в личку ссылку на форум, что бы вживую посмотреть.

 

[Ileyid]

Привет всем не могу поставить иконки работаю с этим с дня можете помочь ставлю в extra.less Код который есть качал много плагинов но не могу установить пишет Error: Class '\NodeIcon\Setup' not found in src/XF/AddOn/AddOn.php at line 442 Можете помочь я чайник <3

 

[dimka1510]

Ileyid, у тебя прав нет на чтение полного текста и скачивание ресурсов.

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

И причём здесь какой-то левый плагин СКАЧАННЫЙ НЕИЗВЕСТНО ОТКУДА, если это текстовая инструкция? Там где качал - там и помогут.

6.11. Запрещено публиковать исходный код (код ошибок и другая информация такого же типа) без BB-кода — CODE, а так же в виде изображений (то есть скриншотами, фотографиями или другого рода изображениями), под исключения попадают случаи, когда Вас попросили предоставить какую-то информацию скриншотом или проблема касается визуального оформления, где текстом не всегда возможно пояснить.

И все ошибки публикуются полностью с логами, а не огрызком из двух слов.