URL Logo Personalizzato | Aiutami a stampare l'URL del logo personalizzato inserito nel mio tema

22 gen 2020, 19:10:02
Visualizzazioni: 19.8K
Voti: 1

Sto cercando di utilizzare i componenti separati della funzione the_custom_logo() per creare la mia visualizzazione personalizzata del logo.

Qualcuno può spiegarmi come posso accedere separatamente all'URL e al riferimento dell'immagine?

Molte persone hanno chiesto come modificare l'URL, ma questa non è la domanda a cui cerco risposta. Desidero poter manipolare il codice in questo modo (questo è un esempio base dei miei piani, così da poter capire i due componenti che desidero estrarre):

<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="Logo">
    </a>
</div>

Sto utilizzando un tema vuoto, con il logo e il link già impostati nel back-end di WordPress.

Utilizzando questo snippet nel mio header, il logo e il link vengono visualizzati come previsto:

<?php the_custom_logo(); ?>

Grazie a tutti i contributori, Jason.

0
Tutte le risposte alla domanda 1
2

Utilizza wp_get_attachment_image_src per ottenere le proprietà e l'URL dell'immagine:

$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];

Modifica: Aggiungo ulteriori informazioni in base al tuo commento.

L'URL a cui punta è semplicemente creato con home_url:

esc_url( home_url( '/' ) );

Un'altra cosa spesso dimenticata quando si utilizza questo metodo è rispettare il contenuto dell'attributo alt se è impostato nel media:

$alt = get_post_meta( $logo, '_wp_attachment_image_alt', true );
if ( empty( $alt ) ) {
    // Usa il titolo del sito se non è fornito un alt
    $alt = get_bloginfo( 'name', 'display' );
}

Ti incoraggio a guardare il codice sorgente di get_custom_logo poiché utilizza gran parte di questo.

Vale anche la pena menzionare che se stai sviluppando questo tema per il rilascio su WordPress.org/themes - è un requisito utilizzare the_custom_logo o get_custom_logo invece di creare la tua soluzione.

Per questo motivo c'è un filtro per l'output HTML in get_custom_logo, che potrebbe essere meglio utilizzare e sostituire le parti di cui hai bisogno. La funzione get_custom_logo (utilizzata da the_custom_logo) gestisce anche aspetti aggiuntivi come il multisito e assicura che il segnaposto sia presente per l'anteprima del customizer. L'utilizzo sarebbe qualcosa del genere:

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;
} );

Questo leggerebbe un valore del theme_mod custom_logo_url che potrebbe provenire da un controllo del customizer, e cambia la classe da .custom-logo-link a .box-link nel tuo esempio.

22 gen 2020 19:37:00
Commenti

È un ottimo metodo per gestire l'immagine, c'è un modo per ottenere anche il link associato al logo del tema (non il link al logo stesso, ma dove punta)? Ho bisogno di entrambi. Aggiungilo alla tua risposta così posso votare e accettare c:

Jason Is My Name Jason Is My Name
23 gen 2020 11:09:01

È assolutamente perfetto amico, apprezzo l'aggiornamento e l'estensione al testo alternativo. Per favore vota la mia domanda se ti è piaciuto rispondere!

Jason Is My Name Jason Is My Name
23 gen 2020 12:58:51