Come creare news ticker in WordPress

Se hai già un sito Web WordPress per riviste, giornali o blog per la lettura..., potresti avere difficoltà ad attirare l'attenzione dei visitatori sui post in sospeso perché il tuo sito è pieno zeppo di troppe informazioni. Per risolvere questo problema, i news ticker sono sicuramente una caratteristica perfetta per rendere il tuo sito di lettura più leggibile, informativo ed eccezionale!

In questo post, ti mostreremo cosa sono i news ticker, perché dovremmo usarli e come creare un news ticker impressionante con pochi semplici passaggi.

Iniziamo!

Cosa sono i News Ticker?

Su alcuni tipi di siti Web come riviste online, giornali online, potresti vedere alcune diapositive di notizie scorrere nella parte inferiore o nell'intestazione, nel piè di pagina o nella barra laterale. Queste diapositive delle notizie sono simili a quelle dei telegiornali.

Dando un'occhiata al telegiornale di un telegiornale o di un sito web di una rivista, gli spettatori possono ottenere le informazioni più interessanti e evidenti. Di solito ci sono molte informazioni, chiamate tick , in un news ticker.

Come nella gif qui sotto, vedete la notizia in corso? Ecco come funziona un news ticker.

Un esempio di news ticker in WordPress

Perché dovremmo usare i news ticker?

I news ticker hanno vari vantaggi per diversi tipi di siti web:

• Per le riviste, i news ticker ti aiutano a evidenziare quali informazioni e post devono essere notati.
• Per i portafogli, attirano l'attenzione dei reclutatori su esperienze lavorative e ricompense evidenti.
• Per altri tipi di siti Web, i news ticker stessi diventeranno un punto culminante dei siti, per rendere i tuoi blog, ad esempio, più attraenti e professionali.

Pertanto, i news ticker sono chiaramente uno strumento utile per i proprietari di siti web. Inoltre, è molto facile aggiungere news ticker al tuo sito WordPress. Passiamo alla parte successiva e prendine uno per te!

Come aggiungere news ticker in WordPress?

Ci sono molti modi per aggiungere un news ticker.

All'inizio puoi utilizzare un tema predefinito con i news ticker ; sarebbe la cosa più facile. Basta leggere attentamente la documentazione del tema.

Tuttavia, non tutti i temi hanno un ticker di notizie preimpostato come quello. Quindi, in questi casi, puoi pensare di utilizzare page builder o plugin.

In questo post utilizzeremo un plugin gratuito chiamato Ditty News Ticker plugin . È gratuito, molto facile da usare e altamente personalizzabile . Devi solo scaricarlo e attivarlo su Dashboard.

Puoi leggere di più su come installare un plugin qui.

Ora, non esitiamo più e segui i nostri 3 passaggi per avere un fantastico news ticker sul tuo sito:

Passaggio 1: aggiungi un nuovo News Ticker

Per prima cosa, vai su News Ticker > Aggiungi nuovo .

Nella schermata successiva, vedrai 5 schede di seguito: Aggiungi titolo, Shortcode, Modalità ticker, Tipo di ticker e Impostazioni globali . Queste schede vengono utilizzate per configurare e visualizzare i tuoi news ticker.

Pensi che ci siano troppe cose da tenere a mente? Non preoccuparti, lo faremo in modo breve e chiaro per te:

Innanzitutto, dai un nome al tuo ticker. Digita il nome nella scheda Aggiungi titolo . Il titolo viene solitamente visualizzato nella parte superiore del ticker, quindi cerca di trovare un nome attraente per attirare l'attenzione dei visitatori.

Successivamente, fai clic su Tipo di ticker , quindi aggiungi il contenuto da visualizzare nel news ticker (con un collegamento se necessario) nella sezione Ticker Text .

Come accennato in precedenza, il tuo news ticker può contenere molti tick . Basta fare clic sul pulsante ( + ) per aggiungerne uno e fare clic sul pulsante ( x ) per eliminarlo.

Passaggio 2: configura il News Ticker

Dopo aver avuto un nuovo ticker di notizie, devi renderlo più accattivante configurandolo.

Prima di tutto, scegli come verranno visualizzati i tuoi news ticker. Fai clic su Modalità ticker , vedrai 3 opzioni: Scorri, Ruota ed Elenca . In effetti, Scroll è l'opzione più comune, ma puoi decidere qual è quella più adatta al tuo sito.

Una volta scelta una delle tre opzioni sopra, puoi regolare il comportamento dei ticker da varie schede sottostanti.

Personalmente, ho scelto la modalità di scorrimento , quindi regolerò l'azione di scorrimento. Ci sono due cose importanti da notare: Scroll Speed e Tick ​​Space . In realtà, devi provare molte volte per scoprire i parametri più adatti. Per me, preferisco la velocità di scorrimento di 8 e lo spazio di spunta di 10 pixel.

Inoltre, seleziono anche l' opzione Pausa al passaggio del mouse , in modo che il ticker delle notizie smetta di muoversi quando voglio fare clic su un segno di spunta.

Inoltre, quando fai clic su Impostazioni globali , vedrai alcune altre opzioni per personalizzare i ticker. Ad esempio, se desideri che il titolo dei ticker sia sopra di essi, seleziona Visualizza titolo . O se vuoi nascondere i ticker quando non ci sono segni di spunta, spunta l'opzione come nell'immagine qui sotto.

Ora il tuo news ticker è pronto per essere visualizzato!

Passaggio 3: visualizza i News Ticker

Torniamo alla scheda Shortcode nella parte superiore dello schermo:

Il ticker delle notizie verrà visualizzato nel punto in cui inserisci questo shortcode. Puoi aggiungerlo a qualsiasi posizione: piè di pagina della home page, post, widget della barra laterale,...

Normalmente, non utilizziamo i news ticker per il contenuto di un post. Sarebbe meglio posizionare i news ticker nell'intestazione, nel piè di pagina o nella barra laterale. Posso darti un esempio di news ticker di una barra laterale. Per prima cosa, scelgo una pagina a caso, vado su Anteprima > Personalizza > Widget .

Quindi, vai su Barra laterale > Aggiungi un widget . Vedrai molte opzioni per barre laterali aggiuntive come Audio, Calendario, ... Scegli Testo, quindi vedrai una piccola casella per aggiungere il nome della barra laterale e incollare il tuo shortcode:

Hai fatto molti passaggi, giusto? Ma se vuoi rendere i tuoi ticker di notizie più belli, con colori personalizzati, dimensione del carattere, opacità, ..., hai ancora un po' di lavoro da fare. La versione gratuita di questo plugin non supporta gli utenti nella regolazione di tali parametri. Quindi abbiamo solo risultati come la gif qui sotto:

I ticker delle notizie non sembrano così belli, quindi l'ho modellato un po' con i CSS. Vai su Personalizza > CSS aggiuntivo .

Lì vedrai una piccola casella per aggiungere il codice. Questi codici cambieranno l'aspetto dei tuoi news ticker.

Sto usando il tema Memory con la tavolozza principale di blu e bianco. Pertanto, ho aggiunto questo CSS per avere un news ticker di colore blu:

 .mtphr-dnt-tick-content a {
	color: var(--main-color);
}

.mtphr-dnt-tick-contents a:hover {
	colore: #000;
}

Fai clic su Pubblica e guarda cosa abbiamo:

Ecco solo un semplice esempio per te. Sono sicuro che puoi creare un telegiornale molto più sorprendente da solo. Proviamolo!

Ultime parole

Quindi si tratta di aggiungere un news ticker al tuo sito Web WordPress tramite il plug-in Ditty News Ticker . Abbiamo fatto del nostro meglio per renderlo breve e chiaro, quindi speriamo che questo post ti sia utile.

Forse potresti avere alcune meraviglie o domande sul nostro tutorial, quindi sentiti libero di dircelo nella sezione commenti. Siamo disposti a mostrarti un tutorial più dettagliato sulle opzioni avanzate in questo plugin, o altri metodi per aggiungere news ticker senza usare plugin. Quindi, non dimenticare di connetterti!