¿Le gusta cómo los sitios de redes sociales como Facebook y Twitter muestran vistas previas de enlaces cuando pega un enlace en su estado? ¿No sería bueno si pudiera agregar funciones de tarjetas de contenido similares en su sitio? En este artículo, le mostraremos cómo agregar enlaces como tarjetas de contenido en WordPress.
¿Qué es una tarjeta de contenido?
Muy similar a las tarjetas de Twitter o la vista previa de enlaces de Facebook, las tarjetas de contenido le permiten mostrar un resumen del enlace que comparte en su sitio.
Piense en ello como incrustar un tweet o incrustar un video en su contenido, excepto que ahora está incrustando otros artículos.
Como la imagen de la vista previa de arriba. Echemos un vistazo a cómo funcionan las tarjetas de contenido.
¿Cómo funcionan las tarjetas de contenido?
Las tarjetas de contenido utilizan metadatos de gráficos abiertos para extraer la información del enlace. Si no conoce los metadatos de gráficos abiertos, debe consultar nuestra guía sobre cómo agregar metadatos de gráficos abiertos de Facebook en WordPress.
Facebook inició el protocolo de gráfico abierto y ahora lo utilizan millones de sitios web en todo el mundo. Permite a los propietarios de sitios proporcionar información estructurada sobre un artículo.
Estos datos son utilizados por Facebook, Twitter, etc. para mostrar información cuando alguien comparte el enlace en su plataforma.
Debido a la popularidad y el alcance de la red social de Facebook, la mayoría de los sitios web tienen metadatos de gráficos abiertos en sus artículos.
Las tarjetas de contenido también vienen con una hermosa alternativa para los sitios web que no tienen metadatos de gráficos abiertos. Si agrega un enlace de este tipo, utilizará la imagen de marcador de posición predeterminada para la imagen destacada y mostrará el título de la página vinculada.
Tutorial en video
Si no le gusta el video o necesita más instrucciones, continúe leyendo.
¿Cómo agregar tarjetas de contenido en WordPress?
Lo primero que debe hacer es instalar y activar el Tarjetas de contenido enchufar. Tras la activación, puede dirigirse a crear una nueva publicación o editar una existente.
En la pantalla del editor de publicaciones, verá un nuevo botón en editor visual etiquetado CC.
Al hacer clic en él, se mostrará la ventana emergente de agregar tarjeta de contenido.
Simplemente proporcione el enlace a la página que desea incrustar como tarjeta de contenido, marque la casilla de destino si desea abrir el enlace en una nueva ventana y haga clic en el botón Aceptar para insertar el enlace en su publicación.
Notará que el enlace se transformará inmediatamente en un cuadro de contenido. Mostrará una imagen para el artículo, título, descripción y el nombre del sitio web.
La imagen del artículo se muestra directamente desde el enlace que compartió y no se almacena en su sitio de WordPress.
También puede agregar la tarjeta de contenido usando un código corto como este:
[contentcards url="http://wpbeginner.com"]
Después de agregar tarjetas de contenido a su publicación, puede guardarla y obtener una vista previa. Tenga en cuenta que las tarjetas de contenido responden completamente y se verán geniales en todos los dispositivos.
Convierta automáticamente enlaces en tarjetas de contenido para sitios específicos
Si solo desea crear tarjetas de contenido para sitios específicos, puede hacerlo en la configuración del complemento. Ir Configuración »Tarjetas de contenido y agregue los nombres de dominio que desea incluir en la lista blanca.
Los sitios que agregue aquí actuarán como incrustaciones de YouTube en WordPress. Todo lo que necesita hacer es agregar un enlace y el complemento lo convertirá automáticamente en una tarjeta de contenido.
Cambiar el aspecto de las tarjetas de contenido
El complemento viene con dos máscaras predeterminadas para las tarjetas de contenido que se pueden cambiar desde la página de configuración del complemento.
También puede cambiar la apariencia de las tarjetas de contenido copiando los archivos de máscara predeterminados en su tema o directorio de temas secundarios.
Los archivos de máscara se encuentran en /wp-content/plugins/content-cards/skins/default/
carpeta. Necesitará un cliente FTP para descargar los archivos a su computadora y luego volver a cargarlos en su tema o directorio de temas secundarios.
Después de eso, puede editar estos archivos usando cualquier editor de texto sin formato. Si le resulta difícil editar y cambiar CSS, puede probar CSS Hero. Es un complemento fácil de usar que le permite modificar CSS usando una GUI simple.
Esperamos que este artículo le haya ayudado a agregar hermosas tarjetas de contenido para enlaces externos en WordPress. Es posible que también desee ver nuestra guía sobre cómo crear fácilmente galerías de imágenes receptivas en WordPress con Envira.