Как изменить лого xenforo - Исправление ошибок и поиск оптимальных решений проблем

IlyaPep

Куда загружаете? Где прописываете?

Меценат
#3

Кэш, если тупо заменили дефолт логотип.

Не просто так же заливают рядом, и просто путь в настройках стиля меняют.

Залил пнг файл в папку где дефолтный логотип

Куда загружаете? Где прописываете?

prdove

Я решал максимально тупым способом, так как доступа к фтп не было, заходил на фотохостинг, туда заливал логотип копировал ссылку на само изображение (не страницу фотохостинга), и вместо пути вставлял ссылку. Все отображается корректно и без ошибок. Способ тупой, но можно использовать если не получится.

Меценат
#6

C 2.2 можно прямо с админки заливать:

Я решал максимально тупым способом, так как доступа к фтп не было, заходил на фотохостинг, туда заливал логотип копировал ссылку на само изображение (не страницу фотохостинга), и вместо пути вставлял ссылку. Все отображается корректно и без ошибок. Способ тупой, но можно использовать если не получится.

Только что попытался через имгур,не получилось к сожалению

prdove

Только что попытался через имгур,не получилось к сожалению

У вас ссылка была в формате «i.imgur/код»?

У вас ссылка была в формате «i.imgur/код»?

Да

Последнее редактирование: 11 Авг 2022

prdove

Код:

https://i.imgur.com/Je7fNwZ.png

попробуйте эту ссылку вставить

Код:
https://i.imgur.com/Je7fNwZ.png
попробуйте эту ссылку вставить

Логотип сработал но некорректно

Меценат
#15

Имгур иногда редирект возвращает, так что может и не сработать.
Вариант колхозный в лоб — создать скрытый форумный раздел, с которого вложения могут просматривать все, загрузить логотип вложением туда и просто ссылку /attachments/logo-png.123456/ и воткнуть в адрес к логотипу.

prdove

Имгур иногда редирект возвращает, так что может и не сработать.
Вариант колхозный в лоб — создать скрытый форумный раздел, с которого вложения могут просматривать все, загрузить логотип вложением туда и просто ссылку /attachments/logo-png.123456/ и воткнуть в адрес к логотипу.

Это слишком колхоз

Логотип сработал но некорректно

Попробуйте в любом фоторедакторе вырезать прозрачный фон, он просто коряво сделан

Последнее редактирование модератором: 11 Авг 2022

Skaiman

Попробуйте в любом фоторедакторе вырезать прозрачный фон, он просто коряво сделан

Я другой скачал попробовал сработало,но тут ещё вопрос возникает,как поменять это

aampg

Я другой скачал попробовал сработало,но тут ещё вопрос возникает,как поменять это

В тему стиля

Источник

you can find some thing her

https://mysite.com/admin.php?styles/default-style.1/style-properties/group&group=headerNav

replace mysite.com with your domaine[/QUOTE0]

I have found it, I noticed the image box, were would I place the new logo, and what path do I stick in there. Say I created a image folder called images then called the logo image this>> logo.png

would the path be this images/logo.png

and say my image was 200px — 200px what goes in the above boxes and thank you for your help

Nope nothing in the headerNav as far as I can see I would think it is in the css somewhere but I can’t find it.

M@rc

Well-known member

Nope nothing in the headerNav as far as I can see I would think it is in the css somewhere but I can’t find it.

What’s the link to your forum?

Your see the logo called insane it looks rubbish, I would like to change that.

Last edited: Feb 9, 2018

M@rc

Well-known member

To change the logo :

Admin Panel -> Appearance -> Style Properties -> Basic Options -> Logo URL

You can override the CSS by changing the values in extra.less :

Code:

.p-header-logo.p-header-logo--image img {
    max-width: 100% !important;
    max-height: 200px !important;
}

To change the logo :

Admin Panel -> Appearance -> Style Properties -> Basic Options -> Logo URL

You can override the CSS by changing the values in extra.less :
Code:
.p-header-logo.p-header-logo--image img {
    max-width: 100% !important;
    max-height: 200px !important;
}

Thanks you so much, I can create a far better logo now. (y)

Thank you both for your help, I have now got a far better logo now and I can change some of the theme colours around. I have now fixed the 2 worse things today, that have been annoying me, since I install xenforo.

Hello guys. I can’t find in any way the field Logo Url!
Where i can change it?
Have you solved?

Brogan

Use the ACP search:

Really, the instructions on this are awful in Xenforo’s documentation!

yes, Xenforo 2.1 is great.
But the documention is lacking.
I wonder if they leave it up to their members to work it out.
We get there eventually, but I don’t like asking other members for help all the time

yes, Xenforo 2.1 is great.
But the documention is lacking.
I wonder if they leave it up to their members to work it out.
We get there eventually, but I don’t like asking other members for help all the time

I very much agree. XF2 is a highly capable product and well designed. But the documentation is very poor. I can think of numerous examples of things we couldn’t find on the manual, but got help from this community to fix.

There is a logo add-on, I think it’s called logo essentials, which makes working with the logo very easy.

To change the logo :

Admin Panel -> Appearance -> Style Properties -> Basic Options -> Logo URL

You can override the CSS by changing the values in extra.less :
Code:
.p-header-logo.p-header-logo--image img {
    max-width: 100% !important;
    max-height: 200px !important;
}

I want to replace XenForo default logo for desktop site. I setup a new path for my custom logo which is 200×200 same as XenForo default logo size.
Ten in the Extra.less CC area I added this same code but still the logo shows big on my site. Please someone help me, I want to keep the same logo size same as Xenforo default logo size. I uploaded even 200 x 200 size logo but still shows bigger on the header

Anyone helps me out please, I am using the very latest version of Xenforo.

Thanks heaps !

I want to replace XenForo default logo for desktop site. I setup a new path for my custom logo which is 200×200 same as XenForo default logo size.
Ten in the Extra.less CC area I added this same code but still the logo shows big on my site. Please someone help me, I want to keep the same logo size same as Xenforo default logo size. I uploaded even 200 x 200 size logo but still shows bigger on the header

Anyone helps me out please, I am using the very latest version of Xenforo.

Thanks heaps !

Hello, did you change the link in your style properties ? If yes, this is a cache issue

Regards, SyTry

Hello, did you change the link in your style properties ? If yes, this is a cache issue

Regards, SyTry

Thanks a lot for reply., yes it worked when I reduce logo size

Last edited: Oct 3, 2020

Источник

Уважаемые пользователи. Предлагаю в этой теме делиться навыками, как модифицировать стиль или часть шаблона, аватар, шапку, подвал и т.д.

Вот один не хитрый способ немного приукрасить шапку форума на стандартном стиле xenForo:

Для начала нам потребуется изменить высоту логотипа.

В стандартном стиле она составляет 50 пикселей:

Для этого идём: Внешний вид> Стили> Default Style> Группы настроек стиля> «Шапка» (header) и навигация.

Вкладка ‘Настройки‘> пункт ‘Высота логотипа‘:
И меняем это значение (к примеру) на 355 пикселей:
Получили требуемый результат

. Далее прикрутим фоновое изображение к шапке.

Для этого идём: Внешний вид> Стили> Default Style> Группы настроек стиля> «Шапка» (header) и навигация.

Вкладка ‘Настройки‘> пункт ‘Фон‘:
В поле ‘Изображение‘ указываем путь до загруженной нами (за ранее) картинки фона styles/default/xenforo/bg.jpg.
В поле ‘Repeat‘ в выпадающем меню выбираем ‘No-Repeat‘.
В поле ‘Позиция‘ указываем значение ‘top‘.
Проверим изменения

. Движемся дальше — заменим логотип.

Для этого идём: Внешний вид> Стили> Default Style> Группы настроек стиля> «Шапка» (header) и навигация.

Вкладка ‘Настройки‘> пункт ‘Путь к основному логотипу‘:
В поле значения указываем путь до загруженного нами (за ранее) логотипа styles/default/xenforo/logow.png
Видим результат

. Осталось подкорректировать цветовую палитру.

Для этого идём: Внешний вид> Стили> Default Style> Группы настроек стиля> Цветовая палитра.

Далее правим цветовую палитру на свой вкус и цвет.

Для этого идём: Внешний вид> Стили> Default Style> Группы настроек стиля> Основное.

Вкладка ‘Настройки‘> пункт ‘Фон‘:
В поле ‘Цвет‘ выбираем требуемый оттенок цвета фона.

Если в стиле нет прозрачных элементов, то данных настроек вполне достаточно для достижения поставленной задачи.
Вот что получилось в итоге наших манипуляций:
У вас нет разрешения на просмотр ссылки, пожалуйста Вход или Регистрация

Вообще убрать заливку (шапку).
Решается таким образом:
1. Стиль (дефолтный) — Шапка» (header) и навигация — «Шапка» (header) — Фон
2. Заходим в палитру и ставим галочку: Очистить значение.
Вышло так:

Меняем вид статистика форума (дефолтный стиль)
1. открываем шаблон EXTRA.css и добавляем в него:

/*Статистика форумов*/
.nodeStats.pairsInline {
display: block;
line-height: 20px;
max-width: 200px;
position: absolute;
right: 275px;
top: 7px;
}

.nodeStats.pairsInline dl, .nodeStats.pairsInline dt, .nodeStats.pairsInline dd {
display: block;
min-width: 90px;
text-align: center;
}

.nodeStats.pairsInline dt {
color: #a5cae4;
text-transform: uppercase;
}

.nodeList .subForumsPopup
{
display: none;
}
/*Статистика форумов*/

2. идем в Список разделов/узлов — Настройки и снимаем галочку Включить всплывающие подсказки с описаниями разделов форума
3. идем в Список разделов/узлов — Настройки и ставим галочку напротив Показывать всплывающие окна для подразделов.
Третий пункт нужен в том случае, если Вам нужно убрать отображение подразделов. Если Вам подразделы нужны, уберите из кода

.nodeList .subForumsPopup
{
    display: none;
}

Последнее редактирование: 8 Ноябрь 2016

Источник

Картинки хорошо, но вот ресурсы с баннерами изображением без исходника PSD, мало имеют смысла, так как содержат только уже готовые названия групп, которые не всегда есть на другом форуме. Уже не первый раз делаю подобные баннеры на CSS/LESS.
Предварительно сделаны логотипы для серверов:

Arizona RP — arizona-logo.png
NextRP — next-logo.png
Evolve RP — evolve-logo.png
Diamond RP — diamond-logo.png
Radmir RP — radmir-logo.png
Paradox RP — paradox-logo.png
Revent RP — revent-logo.png
BlackRussia — blackrussia-logo.png
Матрешка RP — matreshka-logo.png
Monser DeathMatch — monser-logo.png

Скачиваем архив и содержимое папки upload, заливаем на форум.
В extra.less стиля или с помощью модификации шаблона, добавляем:

@logoImages: 'arizona-logo.png'; // Изображение логотипа (указывать в кавычках)
@logoSize: 14px;                 // Размер логотипа
@logoOpacity: 70%;               // Прозрачность логотипа (100% - непрозрачный, 0% - прозрачный)

.fontMontserrat(@fweight) {
    @font-face {
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: @fweight;
        src: local(''),
            url('/styles/role-play/fonts/montserrat-@{fweight}.woff2') format('woff2'),
            url('/styles/role-play/fonts/montserrat-@{fweight}.woff') format('woff');
    }
}
.fontMontserrat(400);
.fontMontserrat(500);
.fontMontserrat(600);
.fontMontserrat(700);

@strongTextShadow:  1px 0 1px  rgba(0,0,0,.5),
                    0 1px 1px  rgba(0,0,0,.5),
                    -1px 0 1px rgba(0,0,0,.5),
                    0 -1px 1px rgba(0,0,0,.5);

.gradientUserBanner(@start: transparent, @end: transparent, @position: right) {
    background-image: linear-gradient(to @position, @start 0%, @end 100%);
}

.svg-userBannerVariation(@color; @bg; @logo: @logoImages) {
    color: @color;
    background-color: @bg;
    border: none;
    .userBanner-before {
        &:before {
            content: '';
            display: block;
            width: 18px;
            height: 18px;
            background: url('/styles/role-play/images/@{logo}') no-repeat center / @logoSize,
                linear-gradient(to top, rgba(0,0,0,.8) 10%, rgba(0,0,0,.2) 100%);
            filter: opacity(@logoOpacity);
            padding: 2px;
            border-radius: 50%;   
        }
    }
}

.userBanner {
    font-style: normal;
    text-transform: uppercase;
    font-weight: 600;
    padding: 3px 5px 3px 3px;
    border: 1px solid transparent;
    border-radius: 20px;
    text-align: center;
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    position: relative;
    strong {
        font-size: 75%;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        padding-left: 3px;
        line-height: .95;
        text-shadow: @strongTextShadow;
    }
    .message-userBanner& {
        display: flex;
    }
}

@media (max-width: @xf-responsiveMedium) {
    .message:not(.message--forceColumns) .message-userTitle,
    .message:not(.message--forceColumns) .message-userBanner.userBanner {
        display: inline-flex;
    }
}

.userBanner.userBanner-- {
    &staff {
        .svg-userBannerVariation(#fff, #5c97bf);
        .gradientUserBanner();
    }
    &admin {
        .svg-userBannerVariation(#fff, #d80000);
        .gradientUserBanner();
    }
    &moder {
        .svg-userBannerVariation(#fff, #019875);
        .gradientUserBanner();
    }
    &newmember {
        .svg-userBannerVariation(#fff, #6c7a89);
        .gradientUserBanner();
    }
    &verified {
        .svg-userBannerVariation(#fff, #446cb3,);
        .gradientUserBanner();
    }
    &premium {
        .svg-userBannerVariation(#fff, #f89406);
        .gradientUserBanner();
    }
    &banned {
        .svg-userBannerVariation(#fff, #9a12b3);
        .gradientUserBanner();
    }
}

В коде уже предусмотрены несколько баннеров для групп, для команды форума, админа, модера, зарегистрированного, проверенного, премиум и заблокированного. В настройках группы указываем свой класс CSS, к примеру для админа:

userBanner userBanner--admin

Так для каждой группы и получим:

Цвета баннеров указаны в коде:

    &admin {
        .svg-userBannerVariation(#fff, #d80000);
        .gradientUserBanner();
    }

Где #fff — цвет текста, #d80000 — цвет фона.
Для баннеров можно добавить градиент фона, для этого указать два цвета в свойстве .gradientUserBanner();, например:

    &admin {
        .svg-userBannerVariation(#fff, #d80000);
        .gradientUserBanner(#ED213A, #93291E);
    }

Так же можно изменить направление цветов градиента:

    &admin {
        .svg-userBannerVariation(#fff, #d80000);
        .gradientUserBanner(#ED213A, #93291E, top);
    }

Как писал выше, можно изменить логотип сервера:

@logoImages: 'diamond-logo.png'; // Изображение логотипа (указывать в кавычках)

Изменить размер логотипа:

@logoSize: 16px;                 // Размер логотипа

Прозрачность логотипа:

@logoOpacity: 70%;               // Прозрачность логотипа (100% - непрозрачный, 0% - прозрачный)

Источник

M@rc

Well-known member

M@rc

Well-known member

Читайте также: