Как найти логотип wordpress

Вы можете войти на любой веб-сайт WordPress, добавив суффикс / wp-admin / или /wp-login.php к URL-адресу веб-сайта. Страница входа в WordPress — одна из важных страниц, которые необходимо открыть для входа на веб-сайт. По умолчанию на странице входа будет отображаться логотип WordPress. В этой статье мы объясним, как изменить логотип WordPress по умолчанию на странице входа.

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

Логотип также имеет гиперссылку на сайт WordPress.org. Это означает, что вы предлагаете ссылку dofollow со своего сайта на сайт WordPress.org без вашего ведома. Кроме того, если вы разрешаете подписку, продаете продукты или используете форумы, все пользователи будут видеть логотип WordPress при входе на ваш сайт. Это не профессиональное решение, особенно если вы настраиваете сайт для своего клиента.

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

Как изменить логотип WordPress на странице входа?

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

Найти расположение логотипа

Чтобы удалить или заменить логотип по умолчанию, сначала вы должны найти расположение URL-адреса изображения. Откройте страницу входа и щелкните правой кнопкой мыши логотип по умолчанию. Выберите элемент проверки, чтобы открыть раздел консоли разработчика в браузере.

Если вы используете ПК с Windows, нажмите F12, чтобы открыть консоль разработчика. Это будет работать во всех браузерах, таких как Chrome, Firefox и Edge.

Слева в разделе «Элементы» вы можете найти логотип, связанный с сайтом WordPress.org с привязкой «Powered by WordPress». На правой боковой панели в разделе «Стили» вы можете найти логотип изображения, встроенный в CSS с заголовком h1 .login h1 a. Наведите указатель мыши на ссылки, чтобы найти расположение файлов CSS и изображений:

• /wp-admin/css/login.min.css
• /wp-admin/images/w-logo-blue.png?ver=20131202
• /wp-admin/images/wordpress-logo.svg?ver=20131107

Теперь вы знаете класс CSS, расположение файла CSS и детали изображения. Как видите, доступны как синие, так и черные изображения, и первое синее изображение используется по умолчанию на странице входа.

1. Отключение логотипа входа в систему

Это простая задача, если вы просто хотите удалить логотип и ссылку. Вы можете сделать это, добавив «display: none» к классу CSS изображения, как показано ниже.

.login h1  {
   display: none;
}

Теперь изображение логотипа по умолчанию исчезнет, ​​и не будет гиперссылки на WordPress.org.

Если вы обнаружите, что форма входа выровнена по верхнему краю, вы можете настроить поля с помощью приведенного ниже CSS.

.login form {
   margin-top: 50px;
}

Значение верхнего края поля по умолчанию — 20 пикселей, которое вы можете изменить в соответствии с вашими потребностями для перемещения формы вверх или вниз. Вы можете использовать любые другие украшения, такие как изменение фона, отступов, ширины и высоты формы входа.

Добавление CSS в WordPress

Чтобы добавить приведенный выше CSS, войдите в свою административную панель WordPress. Перейдите в раздел «Внешний вид> Настройка> Дополнительные CSS». Вставьте CSS и опубликуйте свой сайт, чтобы удалить логотип на странице входа.

2. Добавление собственного логотипа на страницу входа

Простого удаления логотипа может быть недостаточно, если вы предлагаете профессиональную подписку или форум. В этом случае вы можете заменить изображение или URL по умолчанию на собственное изображение. Это поможет вам повысить ценность бренда, поскольку каждый пользователь, входящий на ваш сайт, будет видеть ваш логотип (для этого вам не нужно использовать вышеуказанный вариант 1).

• Сначала подготовьте свой логотип подходящей ширины и высоты. Вам необходимо подготовить изображения в формате PNG и SVG. Как правило, вы должны использовать тот же логотип, что и в заголовке сайта, чтобы он был единообразным.
• Сохраните название вашего логотипа как w-logo-blue.png и wordpress-logo.svg, которые являются названиями, которые WordPress использует для логотипов входа.
• Войдите в FTP-клиент, например FileZilla, и перейдите в раздел / wp-admin / images /.
• Вы найдете множество изображений логотипов WordPress и файлы w-logo-blue.png и wordpress-logo.svg.

• Теперь загрузите свои логотипы, чтобы заменить логотипы по умолчанию.

Откройте страницу входа на свой сайт в браузере, и вы должны увидеть логотип своего сайта вместо логотипа WordPress.

3. Замена логотипа WordPress через CSS

Вышеупомянутый метод имеет проблему, заключающуюся в том, что логотип по-прежнему будет связан с сайтом WordPress.org. Кроме того, вам понадобится файл SVG, поскольку WordPress использует логотипы PNG / SVG непосредственно в CSS. Следовательно, рекомендуется изменить CSS вместо указанного выше метода. Таким образом, вы можете иметь один логотип PNG и заменять URL-адреса PNG и SVG в CSS.

• Перейдите в панель администратора WordPress и загрузите изображение своего логотипа в разделе «Медиа> Библиотека> Добавить». Получите полный URL-адрес файла изображения. В качестве альтернативы вы также можете напрямую использовать любой URL-адрес изображения из ваших собственных поддоменов или сторонних веб-сайтов, поскольку вам нужен только URL-адрес для замены в CSS.
• Войдите в FileZilla или любой FTP-клиент и перейдите в каталог / wp-admin / css /.
• Откройте файл login.css в текстовом редакторе.
• Найдите .login h1 класс, который вы найдете на странице входа в систему с помощью консоли разработчика.
• Он должен иметь определение стиля, как показано ниже:

• Замените URL-адреса фонового изображения URL-адресом вашего логотипа. Это должно выглядеть так:

• Если у вас нет изображения SVG, замените его тем же URL-адресом PNG, который мы показали выше, или прокомментируйте эту строку, чтобы использовать только файл PNG.
• Сохраните и повторно загрузите измененный файл.
• Теперь откройте файл login.min.css и замените URL-адреса изображений.

Это заменит изображение логотипа на ваше собственное изображение на странице входа.

Замена гиперссылки и текста ссылки

Гиперссылка WordPress.org и текст ссылки «Powered by WordPress» напрямую используются в файле login.php. Следуйте приведенным ниже инструкциям, чтобы заменить их:

• Войдите на FTP и откройте файл login.php в корневом каталоге вашего сайта (обратите внимание, что файл login.php находится вне папки / wp-admin /).
• Найдите ссылку и текст ссылки Powered by WordPress с URL-адресом вашего сайта и строкой тега сайта соответственно.

• Сохраните файл и загрузите обратно на сервер.

Теперь все сделано, и вы увидите собственный логотип, связанный с вашим сайтом.

4. Использование коммерческих тем

На рынке доступно множество профессиональных тем, которые позволяют использовать собственный логотип вместо логотипа WordPress на странице входа. Например, ранее мы использовали тему Highend, которая позволяет загружать собственный логотип через параметры темы.

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

5. Использование плагина для замены логотипа WordPress

В WordPress есть плагин для всего. Следуйте приведенным ниже инструкциям, если вы хотите использовать плагин для замены логотипа входа и URL-адреса.

• Войдите в свою админ-панель и перейдите в раздел «Плагины> Добавить».
• Найдите «логотип входа» и установите плагин «Логотип входа».

• Создайте логотип PNG шириной 312 пикселей и назовите его login-logo.png.

Вот и все. Плагин автоматически заменит изображение логотипа на странице входа. Однако у него та же проблема — не заменять гиперссылку на сайт WordPress.org.

Другой вариант — установить GS Custom Login, который дает вам возможность заменить логотип, а также связанный URL. После установки и активации плагина перейдите в меню «GS Plugins> GS Login Customize». Вы попадете в раздел настройщика WordPress по умолчанию.

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

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

Это работает для всех, кто не хочет трогать файлы серверной части. Это также рекомендуемый способ, поскольку изменения не исчезнут при обновлении темы или WordPress. Кроме того, GS Custom Login также имеет премиум-версию, которая будет стоить вам 30 долларов в год. Он включает в себя дополнительные параметры, такие как добавление reCATCHA, отключение ссылок нижнего колонтитула формы и вставка социальных иконок.

6. Путь WordPress Codex

Кодекс WordPress есть страница, объясняющая настройку логотипа в некоторой степени аналогичным образом, как мы объясняли выше с модификацией CSS.

• Создайте каталог изображений в каталоге вашей темы.
• Загрузите свой логотип в каталог / themes / my-theme / images /.
• Войдите на FTP и добавьте приведенный ниже код в functions.php. Замените yourlogo.png правильным именем файла.

function login_logo() { ?>
    <style type="text/css">
        #login h1 a, .login h1 a {
            background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/images/yourlogo.png);
}
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'login_logo' );

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

function login_logo_url() {
    return home_url();
}
add_filter( 'login_headerurl', 'login_logo_url' );
function login_logo_url_title() {
    return 'Custom Link Text';
}
add_filter( 'login_headertitle', 'login_logo_url_title' );

Мы не тестировали это, так как это зависит от вашей темы. При изменении или обновлении темы все изменения в файле functions.php исчезнут, или вы можете использовать дочернюю тему, чтобы сохранить изменения. Однако изменение файла CSS / PHP, как мы объясняли выше, не вызовет проблем с обновлением темы. Будьте внимательны только тогда, когда обновляете ядро ​​WordPress.