TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

10 suggerimenti per personalizzare il tema Astra

19

Astra è uno dei temi più popolari disponibili nel repository di temi WordPress gratuito. Ci sono più di 1 milione di installazioni attive con quasi 5 stelle da 5K+ utenti. Puoi trovare facilmente questo tema nella categoria "Popolari" quando provi a installare un tema dal pannello di amministrazione. Se stai utilizzando il tema Astra gratuito con il componente aggiuntivo Pro, ecco alcuni suggerimenti per personalizzare il tema e portare il tuo sito al livello successivo.

10 suggerimenti per personalizzare il tema Astra

Astra offre la maggior parte delle personalizzazioni tramite la sezione "Aspetto> Personalizza" simile a qualsiasi altro tema WordPress standard. Tuttavia, potresti facilmente perderti con centinaia di opzioni disponibili. Inoltre, ci sono anche plug-in aggiuntivi e modifiche al layout possibili con il tema Astra. Qui elencheremo i 10 migliori suggerimenti per personalizzare il tema Astra.

10 suggerimenti per personalizzare il tema Astra

Tema gratuito Astra

1 Scarica pagine da diversi modelli di avvio

Saprai che Astra offre modelli di avvio come plug-in separato. Puoi usare questo plugin per installare uno dei modelli di partenza predefiniti invece di crearlo da zero. Tuttavia, se ti piacciono più modelli, è facile prendere solo pagine particolari da quella demo. Ad esempio, puoi prendere la pagina "Contatti" da una demo e la pagina "Chi siamo" da un’altra demo.

  • Dopo aver attivato il plug-in Astra Pro, vedrai una notifica di amministrazione sul plug-in e in altre sezioni per utilizzare i modelli di partenza. Fare clic sul pulsante "Inizia" per installare il plug-in Starter Template. In alternativa, puoi cercare e installare il plug-in dalla sezione del repository dei plug-in di WordPress.

10 suggerimenti per personalizzare il tema Astra

Installa Astra Starter Template Plugin

  • Quando visualizzi i modelli demo, puoi vedere due opzioni.

10 suggerimenti per personalizzare il tema Astra

Importa modello di pagina singola in Astra

  • Puoi importare il modello completo o importare i modelli di pagina selezionati. In questo modo, puoi importare solo le pagine che ti piacciono da diversi modelli demo.
  • Verrà visualizzato un messaggio che informa che eventuali plug-in aggiuntivi necessari per i modelli di pagina verranno installati quando si importa il modello.
  • Procedendo ulteriormente importerai il modello di pagina e vedrai un messaggio di successo come di seguito.

10 suggerimenti per personalizzare il tema Astra

Modello di pagina importato con successo

  • Allo stesso modo, scegli diversi modelli da diverse demo da importare sul tuo sito.

Nota: ti consigliamo di scegliere modelli per lo stesso generatore di pagine come Gutenberg o Elementor. Questo ti aiuterà a evitare di installare più plugin sul tuo sito. Tutti i modelli di pagina importati saranno in stato di bozza, devi modificare il contenuto e pubblicare le pagine.

2 Aggiungi Yoast SEO o Rank Math Breadcrumb

Nella maggior parte dei casi, utilizzerai il plug-in Yoast SEO con il tema Astra per scopi di ottimizzazione dei motori di ricerca. Uno dei problemi con Yoast è che devi modificare manualmente il file modello del tema (principalmente single.php o header.php) per inserire il percorso breadcrumb. Tuttavia, il tema Astra risolve questo problema offrendo questa opzione nel personalizzatore. Vai alla sezione "Aspetto> Personalizza" e seleziona la posizione per il tuo breadcrumb nella sezione "Breadcrumb". Fai clic sul menu a discesa "Breadcrumb Source" e scegli l’opzione "Yoast SEO Breadcrumbs".

10 suggerimenti per personalizzare il tema Astra

Inserisci Yoast o Rank Math Breadcrumb

Allo stesso modo, puoi anche scegliere l’opzione breadcrumb del plug-in Rank Math dal menu a discesa della sorgente se stai utilizzando quel plug-in. Questo è un modo semplice per utilizzare il breadcrumb esistente dal plugin senza modificare il file del tema.

Correlati: GeneratePress premium Vs Astra Pro: qual è il tema migliore per te?

3 Inserisci tag in basso

I prossimi suggerimenti sul tema Astra sono per coloro che desiderano modificare la posizione della visualizzazione dei tag sui singoli post del blog. Per impostazione predefinita, il tema Astra ti consente di inserire i meta dettagli dei post sotto il titolo. Puoi abilitare o disabilitare i meta dettagli come categorie, tag, data di pubblicazione, autore e commenti.

10 suggerimenti per personalizzare il tema Astra

Visualizzazione dei tag in Astra

Molti blogger di WordPress utilizzano più tag per raggruppare i post. In questo caso, la visualizzazione di tutti i tag sotto il titolo del post potrebbe occupare spazio e apparire congestionata. Puoi facilmente spostare i tag sotto il contenuto inserendo il codice sottostante nel tuo file functions.php. Assicurati di utilizzare il tema figlio di Astra e inserisci il codice nel file functions.php del tema figlio.

// removes the tags in meta below the title add_filter( 'astra_post_tags', 'remove_tags_callback' ); function remove_tags_callback(){ return ' '; } add_action('wp', 'tags_call_back'); function tags_call_back(){ if( is_single()) { add_action( 'astra_entry_bottom', 'add_tags_callback'); } } // display the tags with link at the respective action hook function add_tags_callback(){ $output = ''; $tags_list = get_the_tag_list( '', __( ', ', 'astra') ); if ($tags_list) { $output .= ''. $tags_list. ''; } if(! empty($tags_list)) { echo 'Tags: '. $output. ''; } }

4 Visualizza la data dell’ultimo aggiornamento

Il tema Astra offre un’opzione per mostrare o nascondere la data di pubblicazione sui post del blog e sulle pagine di archivio. Tuttavia, molti blogger preferiscono mostrare l’ultima data aggiornata invece della data di pubblicazione originale come metadati. Per prima cosa disabilita l’opzione della data di pubblicazione e inserisci il codice seguente nel tuo file functions.php per mostrare l’ultima data aggiornata.

function your_prefix_post_date( $output) { $output = ''; $format = apply_filters( 'astra_post_date_format', '' ); $modified_date = esc_html( get_the_modified_date( $format) ); $modified_on = sprintf( esc_html( '%s' ), $modified_date ); $output .= ''; $output .= ' '. $modified_on. ''; $output .= ''; return $output; } add_filter( 'astra_post_date', 'your_prefix_post_date' );

Per impostazione predefinita, WordPress ti consente di utilizzare una singola barra laterale in tutto il tuo sito. tuttavia, questo potrebbe non essere il caso d’uso per tutti i proprietari di siti. Potresti avere categorie completamente diverse e voler mostrare barre laterali diverse per ogni categoria. Vai alla sezione "Aspetto> Opzioni Astra" e scorri verso il basso fino alla sezione "Estendi Astra con plug-in gratuiti".

10 suggerimenti per personalizzare il tema Astra

Plugin per la gestione della barra laterale

Fare clic sul collegamento "Attiva" in "Gestione barra laterale". Questo installerà e attiverà il plug-in sul tuo sito e navigherai alla pagina "Impostazioni" del plug-in. Qui puoi creare una nuova barra laterale e sostituire la barra laterale predefinita. Fai clic sul menu a discesa "Visualizza su" e seleziona "Pagine / post / tassonomie specifiche, ecc." opzione. Quindi scegli "Tutti i singolari della tua categoria" per visualizzare la barra laterale solo per quella particolare categoria.

10 suggerimenti per personalizzare il tema Astra

Barra laterale personalizzata per categorie specifiche

6 Disabilitare il caricamento dei file delle icone dei caratteri

Il tema Astra utilizza un file di caratteri per l’utilizzo sulle icone di navigazione. Questo file può creare problemi come richieste di chiavi di precaricamento e spostamento cumulativo del layout nello strumento Google PageSpeed ​​Insights. Puoi facilmente disabilitare il file dei caratteri sul tuo sito aggiungendo il codice seguente nel file functions.php del tuo tema figlio.

add_filter( 'astra_enable_default_fonts', '__return_false' );

7 Memorizzazione nella cache di WooCommerce

Se stai utilizzando WooCommerce, nella maggior parte dei casi non funzionerà in modo reattivo con il tema Astra quando si utilizza con plug-in di memorizzazione nella cache come WP Rocket. Ciò creerà problemi sui dispositivi mobili che le pagine del prodotto e del negozio caricheranno in modo simile al desktop. Puoi consultare il nostro articolo su come escludere le pagine WooCommerce dalla memorizzazione nella cache per assicurarti che le pagine del tuo negozio vengano caricate correttamente sui dispositivi mobili.

8 Generatore di intestazioni e piè di pagina

L’ultimo addon pro ha un bellissimo generatore di intestazioni e piè di pagina. Puoi utilizzare queste opzioni per creare i layout di intestazione e piè di pagina secondo le tue necessità. Dopo aver attivato il componente aggiuntivo Pro, vai alla sezione "Aspetto> Personalizza" e inizia a creare le sezioni del generatore di intestazioni e piè di pagina.

10 suggerimenti per personalizzare il tema Astra

Generatore di intestazioni per temi Astra

Inoltre, puoi anche attivare l’opzione "Intestazioni di pagina" nella sezione "Aspetto> Opzioni Astra". Questo ti aiuterà a creare intestazioni di pagina singole o a livello di sito nella sezione ""Aspetto> Opzioni Astra> Intestazioni di pagina> Aggiungi nuovo".

10 suggerimenti per personalizzare il tema Astra

Generatore di intestazioni di pagina in Astra

9 Usa il plugin Hooks per inserire il codice

I prossimi suggerimenti sul tema Astra sono per coloro che sono interessati a inserire frammenti di codice sul proprio sito. Gli utenti del tema Pro possono utilizzare l’opzione Layout personalizzato per inserire Google Analytics e altri inserimenti di layout. Se sei un utente di temi gratuiti, devi installare i plug-in Astra Hooks per inserire il codice nella sezione dell’intestazione e del piè di pagina.

10 suggerimenti per personalizzare il tema Astra

Plugin Astra Hooks

Dopo aver installato e attivato il plug-in "Astra Hooks", aggiungerà automaticamente opzioni aggiuntive nella sezione di personalizzazione di WordPress nella sezione "Hooks". È possibile inserire codici a livello di sito nell’intestazione, nel piè di pagina, nella barra laterale, nei commenti o nell’area del contenuto.

10 suggerimenti per personalizzare il tema Astra

Utilizzo dei ganci Astra

Correlati: I 7 temi principali del portfolio di WordPress.

10 Usa layout personalizzato per inserire sezioni

Gli utenti Pro possono utilizzare la funzione di layout personalizzato per inserire contenuti HTML e script in qualsiasi punto del sito senza il plug-in Astra Hooks. Dopo aver attivato l’opzione "Layout personalizzati", puoi creare una sezione di layout e inserirla in base alle regole. Puoi inserire il codice di Google Analytics utilizzando l’azione wp_head. Assicurati di fare clic sul pulsante "WordPress Code Editor" nella barra di amministrazione in alto quando inserisci i codici. Questo ti aiuterà a usare le virgolette singole e doppie corrette nel tuo codice.

Inoltre, puoi inserire sezioni personalizzate su qualsiasi articolo o pagina con dopo un certo numero di blocchi o prima di un certo numero di blocchi di intestazione. Questo è utile per inserire banner pubblicitari o di affiliazione in posizioni predefinite nel layout del tuo sito.

10 suggerimenti per personalizzare il tema Astra

Crea layout personalizzato nel tema Astra

Parole finali

La bellezza del tema Astra è che aggiunge una dimensione inferiore a 50 KB durante il caricamento sul browser. Tuttavia, ciò non significa che devi convivere con un semplice sito WordPress minimalista. Puoi utilizzare hook o layout personalizzati e importare modelli di partenza per creare bellissimi siti come qualsiasi altro tema WordPress commerciale.

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More