XenForo 2 Показать изображение для префикса темы

ADMIN

Новичок
Регистрация
18.07.2018
Сообщения
3 221
Баллы
180
Этот небольшой совет покажет вам, как вы можете отобразить изображение в качестве префикса потока, но также покажет заголовок с изображением, когда пользователь выбирает префикс потока ... надеюсь, это поможет.

ПРИМЕЧАНИЕ. Я использую изображения 18px x 18px для своих изображений префиксов

1. Создайте префикс потока
a. В вашем ACP (Панель управления администратора), перейдите на Форумы -> Префиксы тем и нажмите кнопку Добавить префикс
b. Заполните форму и вместо того, чтобы выбрать предустановленный стиль отображения, нажмите «Другое, используя имя пользовательского класса CSS»
c. Введите имя класса css, которое вы создадите ниже





д. Сделайте то же самое для каждого префикса, который вы хотите иметь.

2. Создайте стиль для своего префикса
a. В вашем ACP перейдите в Внешний вид -> Шаблоны и откройте шаблон extra.less
b. Добавьте следующий шаблон в шаблон:

Код:
.prefix_alert { background: url(styles/prefixes/alert.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
с. Измените следующее в приведенном выше коде в соответствии с вашей ситуацией:
prefix_alert - измените имя, вставленное в поле «Другое, используя имя пользовательского класса CSS» на предыдущем шаге 1. b.
styles / prefixes / alert.gif - изменить местоположение вашего изображения префикса
d. Сделайте то же самое для каждого из ваших префиксов ... например, у меня есть 6 префиксов, поэтому у меня есть:

Код:
 .prefix_question { background: url(styles/prefixes/question.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
.prefix_how_to { background: url(styles/prefixes/how_to.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
.prefix_information { background: url(styles/prefixes/information.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
.prefix_need_help { background: url(styles/prefixes/need_help.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
.prefix_important { background: url(styles/prefixes/important.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
.prefix_alert { background: url(styles/prefixes/alert.gif) no-repeat scroll left center; display: inline-block; line-height: 18px !important; padding: 0 0 0 20px; vertical-align: middle; margin-top: -4px !important; font-size: 0px;
}
Вот и все ... наслаждайтесь.

Вот как мои 6-ти префиксы потоков выглядят для пользователя:





 
Верх