10 modi per ottenere un URL di immagine in primo piano in WordPress – Guida completa

10 modi per ottenere un URL di immagine in primo piano in WordPress - Guida completa -

Le immagini in primo piano, note anche come miniature dei post, sono un aspetto essenziale del design del sito Web e dell'esperienza utente su WordPress. Possono aiutare a catturare l’attenzione di un visitatore e rendere il tuo sito visivamente più accattivante. Ecco 10 modi per ottenere l'URL di un'immagine in primo piano in WordPress:

1. Editor di post WordPress

Quando modifichi un post o una pagina, puoi caricare un'immagine in evidenza direttamente dall'editor di WordPress. Dopo il caricamento, fai clic sull'immagine e troverai l'URL nel riquadro dei dettagli.

Duh!

2. Utilizzo dei campi personalizzati:

WordPress ha una funzionalità integrata chiamata campi personalizzati, che può essere utilizzata per ottenere l'URL di un'immagine in primo piano. Dopo aver aggiunto un'immagine in primo piano, WordPress genera automaticamente il campo personalizzato _thumbnail_id. È quindi possibile utilizzare questo ID per recuperare l'URL.

Per recuperare l'URL di un'immagine in primo piano utilizzando i campi personalizzati in WordPress, dovrai interagire con la funzionalità dei campi personalizzati di WordPress. I campi personalizzati sono una forma di metadati che ti consentono di memorizzare informazioni arbitrarie con ogni post di WordPress.

Per raggiungere questo obiettivo, seguire i passaggi seguenti:

Passaggio 1: abilita i campi personalizzati L'opzione Campi personalizzati non è sempre visibile per impostazione predefinita nell'editor dei post di WordPress. Devi prima abilitarlo:

  1. Nella dashboard di WordPress, vai su "Post" e apri qualsiasi post esistente o creane uno nuovo.
  2. Nell'angolo in alto a destra della pagina, fai clic sul menu a tre punti (menu delle opzioni) e quindi su "Preferenze".
  3. Nella finestra pop-up Preferenze, fai clic su "Pannelli" nella barra laterale.
  4. Toggle l'opzione "Campi personalizzati" per abilitarlo. Ora dovresti essere in grado di vedere il pannello Campi personalizzati sotto l'area del contenuto del tuo post.

Passaggio 2: aggiungi o trova l'immagine in primo piano Successivamente, dovrai aggiungere un'immagine in primo piano al post:

  1. Nella barra laterale di destra, sotto le impostazioni "Post", trova la sezione "Immagine in primo piano".
  2. Fai clic su "Imposta immagine in primo piano" e scegli un'immagine dalla Libreria multimediale o caricane una nuova.

Passaggio 3: ottieni l'ID campo personalizzato Dopo aver impostato l'immagine in primo piano, WordPress genera automaticamente una meta chiave denominata _thumbnail_id nel pannello Campi personalizzati. A questa chiave sarà associato un valore, che è l'ID dell'immagine che hai appena impostato come immagine in primo piano.

Passaggio 4: recupera l'URL dell'immagine in primo piano Ora puoi recuperare l'URL dell'immagine in primo piano utilizzando il file _thumbnail_id. Ecco uno snippet di codice PHP che fa questo:

$thumbnail_id = get_post_meta( get_the_ID(), '_thumbnail_id', true ); 
$image_url = wp_get_attachment_url( $thumbnail_id );
echo $image_url;

Questo codice recupera innanzitutto l'ID della miniatura utilizzando il file get_post_meta() funzione, quindi utilizza questo ID con il file wp_get_attachment_url() funzione per recuperare l'URL dell'immagine. get_the_ID() è una funzione di WordPress che recupera l'ID del post corrente in The Loop.

Puoi utilizzare questo codice nei file modello WordPress in cui desideri visualizzare l'URL dell'immagine in primo piano. Ricorda, la modifica dei file modello WordPress richiede la conoscenza di PHP e la comprensione di come funzionano i temi WordPress. Effettua sempre un backup del tuo sito prima di apportare tali modifiche.

3. Utilizzo della Libreria multimediale

Puoi caricare direttamente le immagini nella Libreria multimediale in WordPress. Dopo il caricamento, fai clic sull'immagine e copia l'URL del file che si trova sul lato destro dello schermo.

4. Codice PHP

Se hai dimestichezza con la programmazione, puoi utilizzare la funzione integrata di WordPress, wp_get_attachment_url(). Passa semplicemente l'ID dell'immagine a questa funzione per ottenere l'URL.

L'utilizzo del codice PHP per recuperare l'URL di un'immagine in primo piano implica l'interazione con le funzioni integrate di WordPress. Ecco i passaggi per farlo:

Passaggio 1: trova il posto nei file del tema

Devi trovare la posizione appropriata nei file del tema in cui desideri che venga visualizzato l'URL dell'immagine in primo piano. Potrebbe trovarsi all'interno di The Loop nel tuo tema index.php, single.php, page.phpo qualsiasi altro file modello appropriato per le tue esigenze.

Passaggio 2: inserisci il codice PHP

Nella posizione apposita all'interno di The Loop, inserisci il seguente codice PHP:

if ( has_post_thumbnail() ) { // check if the post has a featured image
    $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full'); 
    echo $featured_img_url;
}

Questo codice controlla se il post ha un'immagine in primo piano. In tal caso, utilizza il file get_the_post_thumbnail_url() funzione per recuperare l'URL dell'immagine in primo piano. get_the_ID() viene utilizzato per recuperare l'ID del post corrente e 'full' viene utilizzato per specificare che vogliamo l'URL dell'immagine a dimensione intera. Se desideri una dimensione diversa, puoi sostituirla 'full' con 'thumbnail', 'medium', 'medium_large', o 'large'.

Il echo l'istruzione restituirà (stampa) l'URL nella posizione in cui è inserito il codice.

Nota importante: Prima di modificare i file del tema, è consigliabile creare un tema figlio. Un tema figlio eredita l'aspetto e la funzionalità di un altro tema, chiamato tema principale. Se modifichi direttamente un tema e questo viene aggiornato dallo sviluppatore del tema, le modifiche andranno perse. Utilizzando un tema figlio, puoi assicurarti che le tue modifiche vengano preservate.

Inoltre, ricorda di eseguire il backup del tuo sito prima di apportare modifiche al codice. È buona norma avere un backup recente da ripristinare se qualcosa va storto. Inoltre, queste modifiche richiedono una conoscenza di base di PHP e Tema di WordPress struttura. Se non ti senti a tuo agio nell'apportare queste modifiche da solo, potresti prendere in considerazione l'assunzione di uno sviluppatore professionista.

5. Utilizzo di un plugin

Plugin come “FileBird – Cartelle della libreria multimediale di WordPress” o “Libreria multimediale reale” possono aiutarti a gestire i tuoi file multimediali in modo efficiente e fornire un facile accesso agli URL dei file.

Ecco alcuni plugin di WordPress che possono aiutarti a gestire i tuoi file multimediali in modo efficiente e fornire un facile accesso agli URL dei file:

Plugin NomeDescrizioneLink
FileBird – Cartelle della libreria multimediale di WordPressFileBird è un popolare plugin per la gestione della libreria multimediale. Ti consente di organizzare i tuoi file multimediali in cartelle e sottocartelle. Puoi gestire, caricare e ordinare facilmente i file in tutte le cartelle. Fornisce inoltre una funzionalità per ottenere direttamente l'URL dei file caricati.FileBird
Libreria multimediale realeReal Media Library è un altro ottimo plugin che ti aiuta a gestire i tuoi file multimediali. Offre un'interfaccia drag-and-drop per organizzare i file in cartelle e raccolte. Si integra inoltre con i più diffusi page builder e plug-in di e-commerce, semplificando la selezione e l'inserimento di file multimediali.Libreria multimediale reale
Cartella multimediale WPL'Assistente catalogo multimediale fornisce numerosi miglioramenti per la gestione del catalogo multimediale. Fornisce un'interfaccia più solida per la gestione delle tassonomie dei media (categorie e tag) e offre codici brevi che possono essere utilizzati per visualizzare media e informazioni correlate sul tuo sito.Cartella multimediale WP
Libreria multimediale migliorataQuesto plugin è un robusto strumento di gestione multimediale che offre la possibilità di classificare e taggare i tuoi file multimediali. Consente inoltre di filtrare e cercare facilmente i tuoi contenuti multimediali, semplificando la ricerca dell'URL dei tuoi file.Libreria multimediale migliorata
Assistente della libreria multimedialeL'Assistente catalogo multimediale fornisce numerosi miglioramenti per la gestione del catalogo multimediale. Fornisce un'interfaccia più solida per la gestione delle tassonomie dei media (categorie e tag) e offre codici brevi che possono essere utilizzati per visualizzare media e informazioni correlate sul tuo sito.Assistente della libreria multimediale

Ricorda sempre di verificare la compatibilità del plugin con la tua versione attuale di WordPress e di assicurarti che il plugin sia ben supportato e aggiornato regolarmente. È anche una buona idea eseguire il backup del tuo sito prima di installare un nuovo plug-in.

6. L'API REST

L'API REST di WordPress include endpoint per il recupero dei contenuti multimediali. Puoi usarlo per ottenere l'URL di un'immagine in primo piano. Ricorda, avrai bisogno dell'ID dell'immagine per recuperare il suo URL.

L'API REST di WordPress è un potente strumento che consente agli sviluppatori di interagire con i siti in remoto inviando e ricevendo oggetti JSON (JavaScript Object Notation). Ecco i passaggi su come utilizzare l'API REST di WordPress per ottenere l'URL di un'immagine in primo piano:

Passaggio 1: abilita l'API REST

L'API REST è abilitata per impostazione predefinita su tutti i siti WordPress a partire dalla versione 4.7. Se il tuo sito ha una versione precedente, considera l'aggiornamento di WordPress oppure puoi abilitare manualmente l'API REST installando il file Plug-in API REST WP.

Passaggio 2: determinare l'ID del post

Hai bisogno dell'ID del post per accedere ai suoi dati tramite l'API REST. In genere puoi trovare questo ID nella dashboard di amministrazione di WordPress quando modifichi il post (viene visualizzato nell'URL).

Passaggio 3: utilizzare l'endpoint API REST

WordPress crea un URL specifico (endpoint) per ogni post che ti consente di interagire con esso tramite l'API REST. Il formato standard è https://yourwebsite.com/wp-json/wp/v2/posts/POST_ID, Dove yourwebsite.com è il dominio del tuo sito e POST_ID è l'ID del post.

Per ottenere l'URL dell'immagine in primo piano, aggiungi ?_embed all'URL. Ciò indica all'API REST di includere i dati dei post incorporati, che includono i dati delle immagini in primo piano. L'URL ora dovrebbe assomigliare a questo: https://yourwebsite.com/wp-json/wp/v2/posts/POST_ID?_embed.

Passaggio 4: accedi all'URL dell'immagine in primo piano

È possibile accedere a questo URL in un browser Web per visualizzare i dati JSON. L'URL dell'immagine in primo piano si trova sotto _embedded -> wp:featuredmedia -> 0 -> media_details -> sizes -> full -> source_url.

Se utilizzi un linguaggio di programmazione come JavaScript o Python, puoi utilizzare il file fetch() o una libreria HTTP come axios or requests per recuperare i dati.

Notare che:

Se il tuo sito WordPress ha una struttura di permalink diversa o se disponi di impostazioni personalizzate, la struttura dell'URL dell'endpoint API REST potrebbe essere diversa.

Inoltre, il processo qui descritto riguarda i post pubblici. Se il post è privato, avrai bisogno dell'autenticazione per accedere ai suoi dati.

Infine, dovresti sentirti a tuo agio nel lavorare con i dati JSON e avere una conoscenza di base delle richieste HTTP prima di utilizzare l'API REST. Se non hai familiarità con questi concetti, ci sono numerose risorse disponibili online per aiutarti ad apprendere.

7. Pubblica miniature nei feed RSS

Per impostazione predefinita, WordPress non include le miniature dei post nei feed RSS. Tuttavia, puoi utilizzare plug-in come "Immagini in primo piano in RSS e email Mailchimp" per aggiungere immagini in primo piano ai tuoi feed RSS.

L'aggiunta di miniature di post ai feed RSS di WordPress implica l'uso del sistema di hook e filtri integrato di WordPress. Ecco come puoi farlo:

Passaggio 1: apri il file Functions.php del tuo tema

Il functions.php file è dove puoi aggiungere le tue funzioni per modificare la funzionalità del tuo sito WordPress. Puoi accedervi andando sulla dashboard di WordPress, quindi su "Aspetto" > "Editor del tema" e infine selezionando l'opzione functions.php file sul lato destro dello schermo.

Nota: Esegui sempre il backup del tuo sito prima di apportare modifiche ai file del tema. Inoltre, si consiglia vivamente di utilizzare un tema figlio per evitare che le modifiche vengano sovrascritte quando il tema principale viene aggiornato.

Passaggio 2: aggiungi una funzione personalizzata per aggiungere miniature ai feed RSS

nella vostra functions.php file, aggiungerai una funzione che aggiunge la miniatura del post al contenuto del feed RSS. Aggiungi questo codice alla fine del file functions.php file:

function insertThumbnailRSS($content) {
    global $post;
    if(has_post_thumbnail($post->ID)) {
        $content = '' . get_the_post_thumbnail($post->ID) . '' . $content;
    }
    return $content;
}
add_filter('the_excerpt_rss', 'insertThumbnailRSS');
add_filter('the_content_feed', 'insertThumbnailRSS');

Ecco cosa fa il codice:

  • Il insertThumbnailRSS() la funzione controlla se il post ha una miniatura. In tal caso, aggiunge la miniatura all'inizio del contenuto.
  • Il add_filter() funzioni allegate insertThumbnailRSS() Vai all’email the_excerpt_rss ed the_content_feed filtri, che vengono utilizzati per modificare il contenuto del feed RSS.

Passaggio 3: salva le modifiche

Fai clic su "Aggiorna file" per salvare le modifiche.

Ora, i tuoi feed RSS dovrebbero includere la miniatura del post all'inizio di ogni contenuto del post. Puoi verificarlo visualizzando l'origine della pagina dell'URL del tuo feed (solitamente yourwebsite.com/feed/).

Nota importante: Modifica del functions.php il file deve essere eseguito con cura. Gli errori di sintassi possono rendere il tuo sito web inaccessibile. Se ciò accade, dovrai utilizzare un client FTP per annullare le modifiche. Se non ti senti a tuo agio nell'apportare queste modifiche da solo, valuta la possibilità di assumere uno sviluppatore professionista.

8. Utilizzo di uno shortcode

Puoi creare uno shortcode personalizzato nel tuo file Functions.php che recupera e visualizza l'URL dell'immagine in primo piano.

Gli shortcode di WordPress sono snippet di codice specifici che ti consentono di eseguire funzioni complesse all'interno dei tuoi post senza dover scrivere il codice da zero ogni volta. Ecco come puoi creare uno shortcode che restituisca l'URL dell'immagine in primo piano di un post.

Passaggio 1: apri il file Functions.php del tuo tema

Il functions.php file è dove puoi aggiungere le tue funzioni per migliorare la funzionalità del tuo sito WordPress. Puoi accedervi andando sulla dashboard di WordPress, quindi su "Aspetto" > "Editor del tema" e infine selezionando l'opzione functions.php file sul lato destro dello schermo.

Nota: Esegui sempre il backup del tuo sito prima di apportare modifiche ai file del tema. Inoltre, si consiglia vivamente di utilizzare un tema figlio per evitare che le modifiche vengano sovrascritte quando il tema principale viene aggiornato.

Passaggio 2: aggiungi una funzione personalizzata per creare lo shortcode

nella vostra functions.php file, aggiungerai una funzione che crea lo shortcode. Aggiungi questo codice alla fine del file functions.php file:

function featured_img_url_shortcode() {
    global $post;
    if(has_post_thumbnail($post->ID)) {
        return get_the_post_thumbnail_url($post->ID);
    } else {
        return '';
    }
}
add_shortcode('featured_img_url', 'featured_img_url_shortcode');

Questo codice crea un nuovo shortcode [featured_img_url]. featured_img_url_shortcode() la funzione controlla se il post corrente ha un'immagine in primo piano e restituisce il suo URL. IL add_shortcode() rende questa funzione disponibile come shortcode.

Passaggio 3: salva le modifiche

Fai clic su "Aggiorna file" per salvare le modifiche.

Passaggio 4: utilizza lo shortcode nei tuoi post

Ora puoi usare il [featured_img_url] shortcode in qualsiasi post o pagina per visualizzare l'URL dell'immagine in primo piano. Basta incollare lo shortcode nell'editor dei post nel punto in cui desideri che appaia l'URL.

Nota importante: Modifica del functions.php il file deve essere eseguito con cura. Gli errori di sintassi possono rendere il tuo sito web inaccessibile. Se ciò accade, dovrai utilizzare un client FTP per annullare le modifiche. Se non ti senti a tuo agio nell'apportare queste modifiche da solo, valuta la possibilità di assumere uno sviluppatore professionista.

9. Dal database

Se hai accesso al database del tuo sito web, puoi ottenere direttamente l'URL dalla tabella "wp_postmeta".

Accedere all'URL di un'immagine in evidenza direttamente dal database WordPress comporta l'interazione con due tabelle: wp_postmeta ed wp_posts. Il primo contiene metadati sui post, mentre il secondo memorizza i post stessi.

Ecco i passaggi per recuperare l'URL di un'immagine in primo piano dal database WordPress:

Passaggio 1: accedi al tuo database WordPress

Accedi al tuo database WordPress utilizzando uno strumento di gestione del database come phpMyAdmin, comunemente fornito dagli host web nel loro pannello di controllo. Assicurati di disporre delle autorizzazioni necessarie per accedere ed eseguire query sul database.

Passaggio 2: comprendere la struttura del database

In WordPress, la relazione tra un post e la sua immagine in primo piano è archiviata nel file wp_postmeta tavolo. Il meta_key "_thumbnail_id" nel file wp_postmeta la tabella contiene l'ID post dell'immagine in primo piano per ciascun post. IL wp_posts La tabella contiene tutti i dati per post, pagine, revisioni e file multimediali. La colonna GUID in wp_posts contiene l'URL per i file multimediali.

Passaggio 3: interrogare il database

È necessario eseguire una query SQL per partecipare al file wp_postmeta ed wp_posts tabelle per ottenere l'URL dell'immagine in primo piano. Supponiamo che tu voglia ottenere l'URL per il post con ID = 1, puoi utilizzare la seguente query SQL:

SELECT p.guid
FROM wp_postmeta AS pm
INNER JOIN wp_posts AS p ON pm.meta_value = p.ID
WHERE pm.post_id = 1 AND pm.meta_key = '_thumbnail_id';

Sostituisci "1" con l'ID del post di cui desideri recuperare l'URL dell'immagine in primo piano.

Questa query SQL restituisce l'URL dell'immagine in evidenza per il post con l'ID specificato.

Nota: Si consiglia di eseguire il backup del database prima di eseguire qualsiasi query, soprattutto se non si conosce SQL o phpMyAdmin. Sebbene la query fornita qui riguardi la lettura dei dati e non modifichi il database, è comunque buona norma eseguire regolarmente i backup.

Tieni inoltre presente che le operazioni dirette sul database dovrebbero essere eseguite con cura e sono in genere l'ultima risorsa, soprattutto quando sono disponibili metodi più sicuri e semplici, come l'utilizzo delle funzioni e degli hook di WordPress.

10. Ispezionare l'elemento

Questa è una semplice funzionalità del browser che può essere utilizzata per ottenere l'URL di qualsiasi immagine sul tuo sito, comprese le immagini in primo piano. Basta fare clic con il pulsante destro del mouse sull'immagine e selezionare "Ispeziona elemento" per visualizzare l'URL dell'immagine nell'HTML.

La funzione "Ispeziona elemento" fa parte degli Strumenti per sviluppatori integrati nella maggior parte dei browser Web moderni, inclusi Google Chrome, Mozilla Firefox e Safari. Ti consente di visualizzare e interagire con il codice HTML e CSS sottostante di una pagina web.

Ecco i passaggi per ottenere l'URL di un'immagine in primo piano utilizzando "Ispeziona elemento":

Passaggio 1: vai al post

Apri il tuo browser web e vai al post di cui desideri recuperare l'URL dell'immagine in primo piano.

Passaggio 2: aprire lo strumento Ispeziona elemento

Fai clic con il pulsante destro del mouse sull'immagine in primo piano e seleziona "Ispeziona" o "Ispeziona elemento" dal menu contestuale. Si aprirà il pannello Strumenti per sviluppatori, con l'elemento HTML corrispondente all'immagine in evidenza evidenziato.

Passaggio 3: individuare l'URL nell'HTML

Nel pannello Strumenti per sviluppatori, vedrai l'HTML per l'immagine in primo piano. Di solito è un img tag, che ha un src attributo contenente l'URL dell'immagine.

Il codice potrebbe assomigliare a questo:

<img src="https://yourwebsite.com/wp-content/uploads/2023/07/featured-image.jpg" alt="Featured Image Description">

In questo caso, l'URL dell'immagine in primo piano è: https://yourwebsite.com/wp-content/uploads/2023/07/featured-image.jpg

Passaggio 4: copia l'URL

Fare clic con il tasto destro sull'URL e selezionare "Copia" dal menu contestuale. Ora puoi incollare l'URL ovunque ti serva.

Nota: Sebbene lo strumento “Ispeziona elemento” fornisca informazioni preziose sulla struttura di una pagina web, fornisce solo un’istantanea dello stato attuale della pagina. Qualsiasi modifica apportata utilizzando "Ispeziona elemento" è locale nel tuo browser e non influisce sul sito Web live. Inoltre, ricorda che dovresti disporre dei diritti e delle autorizzazioni necessari per utilizzare le immagini a cui stai accedendo.

Conclusione

Ottenere l'URL dell'immagine in primo piano in WordPress può sembrare difficile all'inizio, soprattutto con la moltitudine di modi in cui puoi realizzarlo. Tuttavia, ogni metodo presenta vantaggi e casi d'uso unici. Che tu sia uno sviluppatore esperto che desidera immergersi nell'API REST di WordPress o un proprietario di un sito che ha solo bisogno di un URL veloce per la condivisione sui social media, c'è una soluzione per te.

Abbiamo esplorato vari metodi, dalla semplicità dello strumento "Ispeziona elemento" agli approcci più tecnici che coinvolgono il codice PHP e le query dirette sul database. Mentre alcuni metodi richiedono una comprensione più approfondita del funzionamento interno di WordPress, altri possono essere implementati senza scrivere una sola riga di codice.

Ricorda, assicurati sempre di seguire le migliori pratiche quando modifichi il codice o il database del tuo sito WordPress, incluso l’esecuzione di backup regolari e il lavoro all’interno di un tema figlio. Ciò manterrà il tuo sito sicuro mentre esplori queste funzionalità.

Ci auguriamo che questa guida sia stata utile nel tuo tentativo di recuperare gli URL delle immagini in primo piano in WordPress. Man mano che acquisirai maggiore dimestichezza con questi metodi, scoprirai che sono solo la punta dell’iceberg in termini di ciò che puoi ottenere con WordPress. Quindi vai avanti e continua ad esplorare le possibilità!