Seo Форум

Web разработка => Вебдизайн и Вебмастеринг => Заказ дизайна и графики => Тема начата: osagokaskonet от 16-04-2020, 20:42:13

Название: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 16-04-2020, 20:42:13
Всем привет,

Нужна помощь, установить векторный логотип на wordpress.

Кто в этом разбирается и поможет, буду признателен.

Небольшая денежка в подарок будет. :)

Пишите сюда или vlkv6@rambler.ru
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: alexakap от 16-04-2020, 21:40:00
В чем проблема? Загружайте лого через админку, присылайте url сайта, css если нужно, бесплатно напишу. С лого на вп обычно проблем не бывает, не понятно чё у вас там за проблемы
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 16-04-2020, 21:53:08
Цитата: alexakap от 16-04-2020, 21:40:00
В чем проблема? Загружайте лого через админку, присылайте url сайта, css если нужно, бесплатно напишу. С лого на вп обычно проблем не бывает, не понятно чё у вас там за проблемы

1. Проблема в том, что Логотип.png при установки теряет качество и четкость картинки,
2. Логотип.svg на сайт не грузится вообще.
3. Тема буржуйская, через админку не прокатывает.
4. В инете есть коды, плагины и другие варианты не работает у меня это всё.
5. Сайт https://osagokasko.net/
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: alexakap от 16-04-2020, 22:19:42
Ну, ок! Завтра скиньте в личку доступы, как будет время посмотрю
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 16-04-2020, 22:31:42
Цитата: alexakap от 16-04-2020, 22:19:42
Ну, ок! Завтра скиньте в личку доступы, как будет время посмотрю

Ок, договорились
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Гарик+ от 16-04-2020, 23:55:46
Цитата: osagokaskonet от 16-04-2020, 21:53:08Проблема в том, что Логотип.png при установки теряет качество и четкость картинки,

(https://osagokasko.net/wp-content/uploads/2020/04/logo-e1587059176474.png)
Вот этот? Качество самого лого так себе.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 17-04-2020, 00:04:49
Цитата: Гарик+ от 16-04-2020, 23:55:46
(https://osagokasko.net/wp-content/uploads/2020/04/logo-e1587059176474.png)
Вот этот? Качество самого лого так себе.
Это вариант уменьшения размера.

Исходник вот: https://osagokasko.net/wp-content/uploads/2020/04/logo-1.png (https://osagokasko.net/wp-content/uploads/2020/04/logo-1.png)

Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Val_Ery от 17-04-2020, 08:52:25
Цитата: osagokaskonet от 16-04-2020, 21:53:08
2. Логотип.svg на сайт не грузится вообще.
3. Тема буржуйская, через админку не прокатывает.
4. В инете есть коды, плагины и другие варианты не работает у меня это всё.

К сожалению, вашу тему посмотреть не могу, есть только версия lite, бесплатная. Они могут несколько отличаться...

Значит, что есть в boldr-lite.
- разработчики решили не использовать add_theme_support( 'custom-logo' ). Поэтому в вашей админке нет в меню Внешний вид - Настроить - Свойства сайта пункта логотип.
- для загрузки логотипа они используют специально созданную страницу настроек темы. При этом в качестве загрузчика используют trickbox (wp-includes/js/thickbox)
- дефолтные параметры для каждой используемой опции хранятся в settings.php. Применительно к логотипу для ключа default (логотип по умолчанию) прописано значение get_template_directory_uri() .'/img/logo.png' (путь к дефолтному логотипу)
- вывод логотипа прописан в шаблоне header.php
<img src="<?php echo esc_urlboldr_get_option('logo') ); ?>" alt="<?php bloginfo('name'?>">

Исходя из всего этого...
- я не удивляюсь, что у вас "не работают" все коды и плагины из интернета. Они работают. Только, скажем так, вашей теме на это фиолетово.

Вариантов решения несколько.
1. Создать дочернюю тему (чтобы не править исходник). Можно использовать плагин child theme generator. В functions.php добавить поддержку темой пользовательских логотипов.
add_theme_support( 'custom-logo', array(
  'flex-width'  => true,
) );

В таком варианте без установленных ширины и высоты встроенный медиа аплоадер (не trickbox) не будет требовать обязательной обрезки логотипа, что с svg несколько проблематично.
Для вывода логотипа на страницах сайта в шаблоне header.php (его нужно скопировать в дочернюю тему) вместо <img src="<?php echo esc_url( boldr_get_option('logo') ); ?>" alt="<?php bloginfo('name') ?>"> прописать
if ( function_exists( 'the_custom_logo' ) ) {
  the_custom_logo();
}

Как результат, вы сможете менять лого в дочерней теме через Внешний вид - Настроить - Свойства сайта. А для работы с svg - использовать любой код/плагин из интернета.

2. Вариант попроще
Заходите на страницу настроек темы, находите место, где подгружается логотип. И удаляете его. Теперь, если верить настройкам, у вас в качестве логотипа должен отображаться логотип по умолчанию. Открываете файл settings.php, находите массив со значениями настроек лототипа и меняете путь для ключа default на
get_template_directory_uri() .'/img/logo.svg
Логотип, соответственно, надо положить в папку img

3. Еще проще
Загружаете логотип в папку img, открываете шаблон header.php и меняете
<img src="<?php echo esc_urlboldr_get_option('logo') ); ?>" alt="<?php bloginfo('name'?>">
на что-то типа
<img src="<?php echo get_template_directory_uri(); ?>/img/logo.svg" alt="<?php bloginfo('name'?>">

Последнее... относительно качества логотипа. Картинка размывается не тогда, когда вы ее масштабируете, уменьшая размер, а в обратном случае: когда в блок с шириной 300px вставляется картинка размером 100px.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 17-04-2020, 09:29:56
Цитата: Val_Ery от 17-04-2020, 08:52:25

Последнее... относительно качества логотипа. Картинка размывается не тогда, когда вы ее масштабируете, уменьшая размер, а в обратном случае: когда в блок с шириной 300px вставляется картинка размером 100px.

Я заранее извиняюсь, может скажу глупость, так особо не разбираюсь в этом. Так может не прибегать к прописанию кода и прочих операций.
Можно картинку png которая есть, вставить в тему, просто поменять ширину блока как-то, чтобы не было потери качества?
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Val_Ery от 17-04-2020, 12:18:06
Цитата: osagokaskonet от 17-04-2020, 09:29:56
Можно картинку png которая есть, вставить в тему, просто поменять ширину блока как-то, чтобы не было потери качества?
Картинку-то вставить можно, только не вашу. Она у вас, если не ошибаюсь, примерно 5000 на 1000 px. То есть, 5-ти мегапиксельный логотип. Это очень много.
К тому же, относительно png. ПНГ'шки отличаются от всяких жипегов тем, что имеют дополнительный альфа-канал. Их удобно использовать там, где требуется прозрачность. Но, как результат, вес будет больше.
Ещё момент - потери качества в отличии от вектора (svg) при масштабировании. Попробуйте просто масштабировать ваш логотип с 5000px до 300 и посмотрите на зазоры между буквами. Может получиться так, что буквы начнут сливаться, что тоже плохо.

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

Теперь о вашей теме. Я, к сожалению, сейчас посмотреть не могу - пишу с мобилы. Но в общих чертах опишу, как это работает.

В ВП в настройках медиа есть такой параметр, как размеры изображений. Типа, превьюшка, большой и т.п. Я, когда создаю темы, их отключаю и регистрируют свои собственные размеры. Регистрация размеров связана с тем, что я хочу размещать в той сетке, которую создаю, картинки нужных в каждом случае размерностей. Например, если у меня ширина тела всегда 1200 пикселей, а тело делится на три колонки, то соответственно выставлять на сайт изображения шире, чем 1200/3=400 - нет смысла напрягать браузер.

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

Повторюсь, сейчас мне не посмотреть, как у вас. Но мне что-то подсказывает, что движок тащит для вывода на страницах сайта тот экземпляр, который, по его мнению, лучше подходит к ширине блока. Типа, блок 350 пикселей, ну... поставлю превьюшку 150px. А браузер, в итоге, картинку растягивает. Отсюда размытие.
Если сейчас не напрягает вопрос, вечером посмотрю. ОК?
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 17-04-2020, 12:21:03
Val_Ery, пока терпит, спасибо.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Val_Ery от 18-04-2020, 15:58:39
osagokaskonet, написал в личку :)
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Гарик+ от 18-04-2020, 18:33:05
Может вам существующий большой уменьшить? Бесплатно.  :)
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: zanuda от 19-04-2020, 08:20:52
Пишу в очень укороченном варианте потому как спать ну очень хочется.

0. У вордпресса есть эдакий встроенный "оптимизатор". Когда картинка не совпадает с размером, требуемом в теме, тогда вордпресс изменяет исходный размер + оптимизирует с потерей качества. Посему в вашей ситуации:

1. Выясняете, какой размер нужен для лого. Берете ваш файл, пока он еще векторный, уменьшаете до нужного размера (5 мегапикселей лого - это круто, сайт наверно, нужно будет показывать на пачке экранов, встроенных в домашную стенку), зависываете в другой файл, который потом будет закачиваться на сайт. Опыт показывает, что для текста лучше png. После не забудте оптимизировать. Хочется без потери качества, берите lossless compression.

2. Идете на сервер и смотрите, где ВП создал кучу превьюшек, и какого они размера. Они тоже будут "плохого" качества (см 0.)

3. Для каждой превьюшки создаете собственный аналог по принципу 1. (с полным сохранением размеров и имени. И закачиваете на сервер в тоже самое место, где они уже есть, с опцией перезаписки файла.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: Val_Ery от 19-04-2020, 09:17:28
Гарик+, zanuda,
на сайте сейчас эсвегешка.
Она просто не выводится на десктопах, потому, что для блока #logo установлено css правило float: left;

На мобилках лого отображается. Там нормальное text-align: center;

То есть, осталось отображение настроить и с шириной блоков разобраться, чтобы лого и контактная информация не пересекались.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: zanuda от 19-04-2020, 16:09:21
А, да, я, естесственно, мыслю в категориях десктопа (предыдущее описание). Кстати, в продвинутых темах в настройках часто бывает место для загрузки лого нормально-дескотного и для мобил с более высоким разрешением.
Название: Re: Нужна помощь установить векторный логотип на wordpress
Отправлено: osagokaskonet от 20-04-2020, 12:28:30
Огромное спасибо всем кто откликнулся. Вопрос закрыт :)