Come impostare un'immagine di Fallback in primo piano in base alla categoria di post in WordPress

Come impostare un'immagine di Fallback in primo piano in base alla categoria di post in WordPress / Temi

Di recente, uno dei nostri utenti ci ha chiesto come impostare la miniatura del fallback per categorie specifiche in WordPress. Nel nostro precedente tutorial, abbiamo mostrato come impostare un'immagine di fallback predefinita per il tutorial di thumbnail di WordPress. In questo articolo, ti mostreremo come impostare l'immagine di presentazione di fallback predefinita per categorie specifiche in WordPress.

Nota: questo è un tutorial di livello intermedio che richiede di conoscere HTML, CSS e le nozioni di base sulla struttura dei temi di WordPress.

Scenario:

Supponiamo che tu abbia un blog in cui assegni una singola categoria a ciascun post (consulta la nostra guida su Categorie e Tag). È possibile mostrare un'immagine di fallback in base alla categoria a cui è assegnato un post.

È particolarmente utile quando ci si trova spesso di fronte a situazioni in cui non è disponibile un'immagine in primo piano per un post. L'immagine del tuo brand potrebbe non corrispondere al tema del post, ma se utilizzi un'immagine specifica per categoria, sembrerà comunque pertinente.

Impostazione delle immagini di categoria in WordPress senza plug-in

Precedentemente su WPBeginner, ti abbiamo mostrato di impostare le immagini delle categorie in WordPress. Tuttavia, per questo tutorial è necessario impostare manualmente le immagini delle categorie senza un plug-in. Dai uno sguardo al nostro tutorial su Cheat Sheet e alla guida per principianti per incollare snippet in WordPress.

La prima cosa che devi fare è creare immagini per le tue categorie. Utilizza la categoria slug come nome del file immagine e salvali tutti nello stesso formato, ad es. jpg o png.

Ora il problema è che il tuo tema WordPress potrebbe usare dimensioni di immagine diverse in modelli diversi. Ad esempio, potresti avere miniature dei post più piccole nelle pagine di archivio e immagini più grandi nei singoli post. Lasciamo che WordPress gestisca il ridimensionamento delle immagini. Per fare ciò è necessario caricare le immagini delle categorie sul tuo sito WordPress da Media »Aggiungi nuovo. Durante il caricamento, WordPress memorizzerà le immagini delle categorie e creerà le dimensioni definite dal tema e quelle sotto Impostazioni »Media schermo.

Dopo aver caricato le immagini delle categorie, è necessario spostarle in una directory diversa. Collegati al tuo sito web usando un client FTP come Filezilla e vai a / Wp-content / uploads / cartella. Le immagini delle categorie che hai caricato verranno archiviate nella cartella del mese. Esempio: / uploads / 2013/12 /

Crea una cartella sul desktop del tuo computer e chiamane le immagini di categoria. Ora scarica tutte le immagini di categoria e tutte le dimensioni che WordPress ha creato per loro in questa nuova cartella sul desktop. Al termine del download, è necessario caricare la cartella delle immagini di categoria nella directory / wp-content / uploads. In questo modo potrai avere tutte le dimensioni delle immagini della categoria in una cartella separata che è facile da chiamare nel tuo tema.

Visualizzazione di immagini di categorie in modelli WordPress

Prima di passare a impostare queste immagini come immagini di fallback predefinite, diamo un'occhiata a come le visualizzeresti nei tuoi temi. Ad esempio, puoi visualizzare queste immagini nella parte superiore delle pagine delle categorie.

   

Ecco come è apparso sulla pagina di archivio delle categorie del nostro sito demo.

Visualizzazione dell'immagine di categoria come immagine in primo piano con fallback predefinito

Ora mostreremo come visualizzare un'immagine di categoria come immagine di presentazione di fallback predefinita o miniatura di post quando un post non ha la sua immagine in primo piano.

Nota: Si prega di eseguire il backup dei file del tema prima di apportare modifiche.

All'interno del tuo ciclo, in cui il tuo tema mostra l'immagine in primo piano o la miniatura del post, sostituiscila con questo codice:

          

Questo codice cerca una miniatura del post. Se ne trova uno, visualizza la miniatura del post. Altrimenti, cerca la categoria a cui appartiene un post e quindi visualizza l'immagine della categoria. Abbiamo aggiunto -150 × 150 nel nome del file immagine perché questa è la dimensione della miniatura del post nel nostro tema dimostrativo. Il tema potrebbe utilizzare una dimensione diversa per le miniature dei post, quindi è necessario utilizzare quella dimensione.

Si prega di notare che il tema potrebbe già avere linea e le righe successive che visualizzano la miniatura del post. Puoi saltare queste righe se il tuo tema le ha già ricevute.

Questo è tutto, ci auguriamo che questo articolo ti abbia aiutato ad aggiungere l'immagine di presentazione di fallback in base alla categoria di post. Per feedback e domande, si prega di lasciare un commento qui sotto.