Чтобы расширить ширину контента на XenForo 2.3.7, нужно изменить максимальную ширину контейнера. Вот основные шаги:
1. Самый простой способ - через настройки стилей:
В админке: Внешний вид → Стили → [Ваш стиль] → Свойства стиля → Общие (General)
Найдите и измените эти параметры:
· pageWidth.max - увеличьте значение (по умолчанию 1200px, можно поставить 1400px, 1600px и т.д.)
· responsiveWide - отключите если хотите всегда широкий вид
2. Если нужен полноэкранный режим (100% ширины):
Добавьте в extra.less вашего стиля:
3. Для более точной настройки можно изменить конкретные шаблоны:
Основной шаблон: PAGE_CONTAINER
Найдите блок:
Или измените контейнер:
4. Более современный способ (рекомендуется):
В extra.less добавьте:
Рекомендации:
1. Сначала попробуйте через настройки стилей - это проще и безопаснее
2. Создайте дочерний стиль перед внесением изменений
3. Для разных разрешений экрана настраивайте через медиа-запросы
4. Не забудьте проверить адаптивность на мобильных устройствах
Если хотите конкретный процент ширины (например, 95%), используйте в extra.less:
Какой именно вариант вам нужен: полноэкранный, определенная ширина в пикселях, или процент от экрана?
1. Самый простой способ - через настройки стилей:
В админке: Внешний вид → Стили → [Ваш стиль] → Свойства стиля → Общие (General)
Найдите и измените эти параметры:
· pageWidth.max - увеличьте значение (по умолчанию 1200px, можно поставить 1400px, 1600px и т.д.)
· responsiveWide - отключите если хотите всегда широкий вид
2. Если нужен полноэкранный режим (100% ширины):
Добавьте в extra.less вашего стиля:
Код:
.p-pageWrapper {
max-width: 100% !important;
width: 100% !important;
}
.container {
max-width: 100% !important;
width: 95% !important;
}
3. Для более точной настройки можно изменить конкретные шаблоны:
Основной шаблон: PAGE_CONTAINER
Найдите блок:
Код:
<xf:page option="pageWidth">
Или измените контейнер:
Код:
<div class="p-pageWrapper">
4. Более современный способ (рекомендуется):
В extra.less добавьте:
Код:
// Для десктопов
@media (min-width: @xf-responsiveMedium)
{
.p-pageWrapper
{
max-width: 95%;
margin: 0 auto;
}
}
// Для очень широких экранов
@media (min-width: 1600px)
{
.p-pageWrapper
{
max-width: 1550px;
}
}
Рекомендации:
1. Сначала попробуйте через настройки стилей - это проще и безопаснее
2. Создайте дочерний стиль перед внесением изменений
3. Для разных разрешений экрана настраивайте через медиа-запросы
4. Не забудьте проверить адаптивность на мобильных устройствах
Если хотите конкретный процент ширины (например, 95%), используйте в extra.less:
Код:
.p-pageWrapper {
max-width: 95% !important;
}
Какой именно вариант вам нужен: полноэкранный, определенная ширина в пикселях, или процент от экрана?