Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo añadir un ticker de noticias desplazable en WordPress

¿Desea añadir un teletipo de noticias con desplazamiento a su sitio WordPress?

Las cadenas de televisión suelen utilizar teletipos para destacar noticias importantes. Es una buena forma de captar la atención del visitante, así que puede añadir un teletipo de noticias a su sitio web y destacar ofertas especiales, entradas populares y otros contenidos importantes.

En este artículo, le mostraremos cómo añadir un ticker de noticias con desplazamiento en WordPress.

How to Add a Scrolling News Ticker in WordPress

¿Qué es un teletipo de noticias con desplazamiento?

Un teletipo es una línea de texto que se desplaza continuamente por la pantalla. Suele mostrar elementos / artículos de actualidad, resultados deportivos, información financiera y monetaria en tiempo real e información meteorológica.

Esto es similar a utilizar una barra de pie de página flotante y fija.

Los teletipos son una buena manera de mostrar pequeños fragmentos de código de forma atractiva. Como el contenido siempre se desplaza, también se pueden utilizar para mostrar mucha información en poco espacio.

Por ejemplo, puede utilizar un teletipo de noticias para mostrar las entradas con mejor rendimiento, anunciar una próxima oferta o compartir otra información útil.

Dicho esto, veamos cómo añadir un teletipo de noticias con desplazamiento a su blog o sitio web en WordPress.

Cómo añadir un ticker de noticias desplazable en WordPress

La mejor forma de añadir un teletipo de noticias con desplazamiento a tu sitio web es utilizar Ditty, uno de los mejores plugins de noticias para WordPress. Este plugin le permite añadir contenido en movimiento, desplazamiento y deslizamiento a su sitio web y luego cambiar la dirección de la animación, el espaciado, la velocidad y el estilo.

Lo primero que tienes que hacer es instalar y activar el plugin Ditty. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez activado, debe ir a Ditty ” Añadir nuevo en el escritorio de WordPress y, a continuación, haga clic en el botón “Añadir predeterminado”.

Adding a ticker to your WordPress website

Ahora puede crear el primer elemento del teletipo. En la casilla “Contenido”, escriba el texto que desea que aparezca en el ticker de desplazamiento.

Aquí puede hacer un anuncio o compartir información útil, de forma similar al banner de un sitio web. Por ejemplo, puede informar a los compradores acerca de una oferta programada o de entradas recientes.

Adding content to an online ticker

También puede añadir enlaces a las noticias para que los usuarios puedan visitar fácilmente la página o entrada que aparece en el teletipo.

Para ello, basta con añadir una URL en el campo “Enlace”.

Adding links to a website ticker

También puede añadir un título al enlace, marcar la URL como nofollow, etc.

Para sacar el máximo partido al teletipo, puede añadir varios elementos de noticias al hacer clic en el botón “Actualizar ajustes de elementos”.

Adding a scrolling news ticker to WordPress

La vista previa se actualizará para mostrar el elemento / artículo que acaba de crear.

Para añadir otro elemento al teletipo, haga clic en el botón “Añadir artículo”.

Adding items to a scrolling news ticker

Ahora puede hacer clic en “Añadir por defecto” y crear el elemento siguiendo el proceso descrito anteriormente.

Repita estos pasos para añadir más elementos al teletipo.

Cuando esté satisfecho con sus elementos / artículos, es posible que desee cambiar el orden en el que aparecen en el teletipo. Para ello, simplemente tome el elemento que desea cambiar y arrástrelo y suéltelo en una nueva posición.

Changing the order of ticker items in a scrolling newsfeed

Por defecto, Ditty muestra tus artículos en un anuncio / catálogo / ficha.

Como quieres crear un teletipo con desplazamiento, haz clic en la pestaña “Visualización”.

Creating an animated ticker in WordPress

En esta pantalla, haga clic en el enlace “Cambiar tipo”.

En el mensaje / ventana emergente que aparece, seleccione “Ticker” y, a continuación, haga clic en “Tipo de actualización”.

How to create a scrolling ticker in WordPress

Ahora puede cambiar el aspecto y el funcionamiento del ticker en su sitio web WordPress.

Esto incluye cambiar la dirección de desplazamiento, la velocidad y el espaciado entre elementos / artículos.

Customizing an animated ticker

También puede elegir entre diferentes estilos para el contenedor del teletipo, los elementos, los títulos, etc. La mayoría de estos ajustes se explican por sí mismos, así que vale la pena repasarlos para ver qué cambios quieres hacer.

Cuando estés satisfecho con cómo se ha establecido el ticker, haz clic en el botón “Guardar Ditty”.

Saving the ticker settings in WordPress

Después de eso, usted está listo para añadir el teletipo a su sitio usando un shortcode. Para obtener este shortcode, siga adelante y haga clic en la pestaña ‘Ajustes’.

Ahora, copia el valor en el campo ‘Shortcode’.

Adding a ticker to a website using shortcode

Una vez hecho esto, puedes añadir el shortcode a cualquier página, entrada o área preparada para widgets. Para obtener más información sobre cómo colocar el shortcode, consulta nuestra guía sobre cómo añadir un shortcode.

Una vez hecho esto, actualice o publique los cambios para que el ticker aparezca en su sitio web de WordPress.

News Ticker Preview

Esperamos que este tutorial te haya ayudado a aprender cómo añadir un ticker de noticias con desplazamiento en WordPress. Puede que también quieras aprender cómo resaltar nuevas entradas para los visitantes que vuelven o ver nuestra selección experta de los mejores trucos para la barra lateral de WordPress para obtener los máximos resultados.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

15 comentariosDeja una respuesta

  1. Lin

    I have two websites. Can I add a ticker on one site that will reflect the other site?

    • WPBeginner Support

      While the ticker would not transmit the information to your other site, you can certainly add the same information in the ticker.

      Administrador

  2. karbhari

    How do i add the Latest News: title to the scrolling news, after header in main page it shows on my site.

  3. Anna Sue

    Where do you enter the text for your ticker? My install doesn’t show some of the items you have in your screenshots.

  4. Anna Sue

    I this may be the ticker I want but, as in many online videos about plugins, you talked and moved so fast I could get the instructions.

  5. H.M.Mohiuddin

    how can i add a news ticker without using plugin

  6. felix

    How do i add the Latest News: title to the scrolling news, it shows on my site, but i didnt see where to add if its lastest news or latest update etc

  7. hosam abdallah

    very good plugin but i have aquestion
    i use artisteer to make my themes can you tell me where can i add php function to widget
    in this or from where can i add to my themes

  8. Abdulmumin

    Hello, Please how can I add the direct function, kindly provide the ste by step instruction in adding the direct funtction.

    I added the shortcode in my about page and it worked but i added it on my home page but it didnt work…..kindly advice

    • WPBeginner Support

      Simply copy the Direct function as shown in the last screenshot of the article and paste in your theme’s home.php or header.php. Paste it at the location where you would like your news ticker to appear.

      Administrador

  9. Sujani

    hey,
    thanks for giving the instructions clearly.. i had a a question where should we put the shortcode and direct function?
    do we place it in the post/page?

    Thanks,
    Sujani

    • WPBeginner Support

      shortcode for posts/pages/widgets and direct function if you want to hard code it in your theme’s template files.

      Administrador

  10. Peter Johnson

    It seems a great theme, as I am not a PHP developer but I want to use this theme and integrate this theme on my wordpress blog. I just want you to describe ho can I use this theme in my Blog so my latest news can be shown on top of my menu or below my main menu like a slide shown on Television. Please I need a procedure.

    Thanks

  11. Mackenzie

    Thanks, really nice tut.

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.