• Добро пожаловать на сайт - wlux.net!

    FAQ по форуму

    1. Все сообщения до группы местный проходят модерацию от 1 минуты до 24 часа

    2. Сообщения учитываються в следующих разделах: Читать

    3.Что-бы скачать вложение нужно 2 сообщения.

    4.Личные переписки работают только с Администрацией форума

    5. Запрещено: Просить скрытый текст , спам, реклама, скам, ддос, кардинг и другая чернуха, нарушать любые законы РФ/СНГ = бан аккаунта

    6. Внимание! Мы не удаляем аккаунты с форума! Будьте внимательны ДО регистрации! Как удалить аккаунт на форуме?!

    5.Не понимаю, как и что тут работает у вас?!Как создавать темы, писать сообщения, как получать реакции. Почему не засчитывает сообщения. Все ответы здесь

This is a mobile optimized page that loads fast, if you want to load the real page, click this text.

Скрипт Гайд Делаем красивые префиксы тем с иконками для xenforo

Оффлайн

wlux.net

Где волчьи уши, там волчьи зубы.
Команда форума
LV
7
 
20.06.2022
23 849
218
36
Награды
10
Пол
Муж.

Репутация:

  • Автор темы
  • Администратор
  • Модератор
  • Команда форума
  • #1


Первым делом, идем в Админ-Панель и ищем extra.less


теперь же, читаем ВНИМАТЕЛЬНО!!!!

Код для стиля Аризоны
CSS:
@svgPrefixBorderRadius: @xf-borderRadiusSmall; // Радиус префиксов
@svgPrefixFontFamily: bold; // Семейство шрифта префикса
@svgPrefixColorGradient: rgba(0,0,0,.4); // Цвет градиента прификса
@svgPrefixTextShadow: rgba(0,0,0,.5); // Цвет тени префикса

.svgLabelPrefix(@prefix-name, @prefix-color, @prefix-icon: "none") {
.svgPrefix, .label.svgPrefix {
font-family: @svgPrefixFontFamily;
font-size: 70%;
font-weight: 500;
display: inline-flex;
text-align: center;
align-items: center;
text-transform: uppercase;
line-height: ((@xf-lineHeightDefault) * .9);
padding: .25em .5em;
border: none;
border-radius: @svgPrefixBorderRadius;
position: relative;
white-space: nowrap;
.fsp & {
margin-right: 5px;
}
.menuPrefix& {
display: inline-block;
font-size: 1.3em;
width: 100%;
padding: .333em;
a& {
text-decoration: none;
}
}
.p-title-value & {
.p-title & {
font-size: 70%;
}
}
&:before {
position: absolute;
top: .25em;
bottom: 0;
left: .333em;
}
&.@{prefix-name} {
background: linear-gradient(135deg, @svgPrefixColorGradient 0%, @svgPrefixColorGradient 40%, transparent 40%, transparent 100%), @prefix-color;
color: rgb(250,250,250);
text-shadow: 1px 0 1px @svgPrefixTextShadow, 0 1px 1px @svgPrefixTextShadow, -1px 0 1px @svgPrefixTextShadow, 0 -1px 1px @svgPrefixTextShadow;
&when (iskeyword(@prefix-icon)) {
padding: .25em .5em .25em 1.75em;
&:before {
.m-faBase();
content: "\@{prefix-icon}";
}
}
}
}
}

Код для других стилей:
CSS:
@svgPrefixBorderRadius: @xf-borderRadiusSmall; // Радиус префиксов
@svgPrefixFontFamily: inherit; // Семейство шрифта префикса
@svgPrefixColorGradient: rgba(0,0,0,.4); // Цвет градиента прификса
@svgPrefixTextShadow: rgba(0,0,0,.5); // Цвет тени префикса

.svgLabelPrefix(@prefix-name, @prefix-color, @prefix-icon: "none") {
.svgPrefix, .label.svgPrefix {
font-family: @svgPrefixFontFamily;
font-size: 70%;
font-weight: 500;
display: inline-flex;
text-align: center;
align-items: center;
text-transform: uppercase;
line-height: ((@xf-lineHeightDefault) * .9);
padding: .25em .5em;
border: none;
border-radius: @svgPrefixBorderRadius;
position: relative;
white-space: nowrap;
.fsp & {
margin-right: 5px;
}
.menuPrefix& {
display: inline-block;
font-size: 1.3em;
width: 100%;
padding: .333em;
a& {
text-decoration: none;
}
}
.p-title-value & {
.p-title & {
font-size: 70%;
}
}
&:before {
position: absolute;
top: .25em;
bottom: 0;
left: .333em;
}
&.@{prefix-name} {
background: linear-gradient(135deg, @svgPrefixColorGradient 0%, @svgPrefixColorGradient 40%, transparent 40%, transparent 100%), @prefix-color;
color: rgb(250,250,250);
text-shadow: 1px 0 1px @svgPrefixTextShadow, 0 1px 1px @svgPrefixTextShadow, -1px 0 1px @svgPrefixTextShadow, 0 -1px 1px @svgPrefixTextShadow;
&when (iskeyword(@prefix-icon)) {
padding: .25em .5em .25em 1.75em;
&:before {
.m-faBase();
content: "\@{prefix-icon}";
}
}
}
}
}

Вставили код?
Теперь же, давайте сделаем само сердце префикса,
Вставляем этот интересный код:

CSS:
.svgLabelPrefix(odobpon, rgb(4,255,0), f00c);

Давайте теперь разберемся , что где зачем,

.svgLabelPrefix(odobpon, rgb(4,255,0), f00c); - odobpon название префикса,
rgb (4,255,0) - цвет RGB палитры,
f00c - иконка префикса, искать их на FontAwesome,

ну, в самом конце, для ленивых будут уже готовый код, с Информацией, Правилами, Одобрено, Закрыто, Рассмотрено, Отказано, Важно
давайте теперь, сделаем уже сами префиксы, и настроим их?




Создаем префикс, и вставляем это: svgPrefix odobpon
в нашем случае, odobpon - название префикса, который мы сделали в extra.less,

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

Скрытое содержимое доступно для зарегистрированных пользователей!
 
Оффлайн

lola_rider

Местный
Участник
LV
2
 
29.07.2024
37
0
21
Награды
3
26
Пол
Муж.

Репутация:

ВОт такая узкая тема фиг где найдешь советы на нее !но на этом форуме возможно все ! автор респект
 
R Оффлайн

ramber

Участник
LV
0
 
20.08.2024
2
0
6
30

Репутация:

круто, спасибо, выглядит супер
 
F Оффлайн

FanFux

Участник
LV
0
 
07.10.2024
3
0
6
Награды
1
24

Репутация:

  • Заблокирован
  • #6
Обратите внимание, если вы хотите заключить сделку с этим пользователем, он заблокирован.
топ тема, а есть еще варианты?
Авто объединение сообщений:

мне бы еще некоторые виды, чтобы по больше баннер выглядел
 
Оффлайн

Stas_Fedorovich

Участник
LV
2
 
07.10.2024
5
0
12
Награды
2
24

Репутация:

Все работает исправно. Ставлю +
 
K Оффлайн

Knikvs

Участник
LV
0
 
30.11.2024
2
0
6
Награды
1
23

Репутация:

Исправил.
Заходим в настройки стиля >> icons >> самый первый раздел "icon font" нажимаем, выбираем - Font Awesome
 
Оффлайн

Luis Ferfer

Участник
LV
0
 
02.12.2024
3
0
7
Награды
1
25

Репутация:

Кайф! Спасибо большое тебе
 
A Оффлайн

Ahmetkaya31

Участник
LV
0
 
19.12.2024
1
0
6
25

Репутация:

Спасибо, что поделились, я ценю это.
 

Поиск по форуму

Данный сайт использует cookie. Вы должны принять их для продолжения использования. Узнать больше....