URL пользовательского логотипа | Как получить URL логотипа, добавленного в тему WordPress

22 янв. 2020 г., 19:10:02
Просмотры: 19.8K
Голосов: 1

Я пытаюсь использовать отдельные компоненты функции the_custom_logo() для создания собственного отображения логотипа.

Пожалуйста, подскажите, как я могу получить отдельно URL и ссылку на изображение?

Многие спрашивают, как изменить URL, но это не тот вопрос, на который мне нужен ответ. Я хочу иметь возможность манипулировать кодом следующим образом (это базовый пример моих планов, чтобы вы могли понять два компонента, которые я хочу получить):

<div class="site-branding">
    <a href="<?php get_custom_logo_url(); ?>" class="box-link">
        <img src="<?php get_custom_logo_src(); ?>" class="site-logo" alt="Логотип">
    </a>
</div>

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

Использование этого фрагмента в моем заголовке приводит к отображению логотипа и ссылки, как и ожидается:

<?php the_custom_logo(); ?>

Спасибо всем участникам, Джейсон.

0
Все ответы на вопрос 1
2

Используйте wp_get_attachment_image_src для получения свойств и URL изображения:

$logo = get_theme_mod( 'custom_logo' );
$image = wp_get_attachment_image_src( $logo , 'full' );
$image_url = $image[0];
$image_width = $image[1];
$image_height = $image[2];

Редактирование: Добавление дополнительной информации на основе вашего комментария.

URL, на который он указывает, просто создается с помощью home_url:

esc_url( home_url( '/' ) );

Еще одна вещь, которую часто забывают при использовании этого метода — учитывать содержимое атрибута alt, если он задан в медиафайле:

$alt = get_post_meta( $logo, '_wp_attachment_image_alt', true );
if ( empty( $alt ) ) {
    // Используем название сайта, если атрибут alt не задан.
    $alt = get_bloginfo( 'name', 'display' );
}

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

Также стоит упомянуть, что если вы разрабатываете тему для публикации на WordPress.org/themes, то обязательно нужно использовать the_custom_logo или get_custom_logo вместо создания собственного решения.

По этой причине в get_custom_logo есть фильтр для HTML-вывода, который, возможно, лучше использовать и заменить только необходимые части. Функция get_custom_logo (используемая the_custom_logo) также обрабатывает дополнительные аспекты, такие как мультисайт и обеспечение наличия заглушки для предпросмотра в кастомайзере. Пример использования:

add_action( 'get_custom_logo', function( $html ) {
    $new_url = 'href="' . get_theme_mod( 'custom_logo_url', esc_url( home_url( '/' ) ) ) .'"';
    $new_link_class = 'class="box-link"';
    $html = str_replace( 'href="' . esc_url( home_url( '/' ) ) . '"', $new_url, $html );
    $html = str_replace( 'class="custom-logo-link"', $new_link_class, $html );
    return $html;
} );

Этот код читает значение theme_mod custom_logo_url, которое может быть получено из элемента управления кастомайзера, и изменяет класс с .custom-logo-link на .box-link в вашем примере.

22 янв. 2020 г. 19:37:00
Комментарии

Это отличный метод для работы с изображением. Есть ли способ получить ссылку, связанную с логотипом темы (не ссылку на сам логотип, а куда он ведет)? Мне нужны обе. Добавьте это в ваш ответ, чтобы я мог проголосовать за и принять ответ c:

Jason Is My Name Jason Is My Name
23 янв. 2020 г. 11:09:01

Это абсолютно точно, дружище, благодарю за обновление и расширение ответа с учетом alt текста. Пожалуйста, проголосуйте за мой вопрос, если вам понравилось отвечать!

Jason Is My Name Jason Is My Name
23 янв. 2020 г. 12:58:51