Cómo agregar archivos a las publicaciones y páginas de WordPress

Las pestañas son una característica bastante común en muchos sitios web, especialmente tiendas comerciales electrónicas. Los propietarios de las tiendas de comercio electrónico generalmente usan archivos en el área de descripción del producto, donde dividen las revisiones, la descripción, las especificaciones técnicas, etc. en varias pestañas.

Sin embargo, las pestañas han encontrado su uso en muchos otros tipos diferentes de sitios web, no solo sitios web electrónicos. Incluso el sitio web oficial de WordPress.org utiliza pestañas en las páginas de descripción del complemento. Vea la imagen a continuación para ver las pestañas resaltadas desde wp.org.

Muchos otros propietarios de sitios web usan archivos en diferentes tipos de sitios web. Sin embargo, las pestañas no deben confundirse con el acordeón, que se extiende para revelar información. A continuación, observe cómo utilicé los acordeones en mi sitio.

Pero, aparte de los acordeones, estamos aquí para hablar sobre las pestañas, para no perder nuestra atención; Solo tenía que hacer la distinción entre filetes y acordeón claramente. Ahora, espero que estemos en la misma página, esencialmente, los propietarios web usan archivos para compartir información que de otro modo habría tomado una página completa o publicación. Esto significa que las pestañas hacen que la información sea mucho más fácil de digerir, sin necesariamente obligar a los usuarios a alcanzar la rueda de desplazamiento un millón de veces.
En otras palabras, las pestañas mejoran el grado de uso de su sitio, especialmente en un mundo con una atención más corta. Entonces, si desea mantener a los usuarios en su sitio por más tiempo, sin abordarlos hasta la muerte con páginas largas, debe considerar usar las pestañas. En la publicación de hoy, le mostramos exactamente cómo agregar pestañas a sus publicaciones y páginas de WordPress. Antes del final de esta publicación, tendrá todas las instrucciones que necesita para usar las pestañas para su ventaja. Esperamos que lo disfrute y no se vaya sin compartir sus pensamientos en la sección de comentarios. Esto está en el camino, comencemos. Use un generador de páginas si ya tiene un creador de páginas instalado, tiene suerte; probablemente ya tenga un módulo de pestaña a su alcance. La mayoría de las principales páginas constructores ofrecen las pestañas como parte de su conjunto principal de elementos para el generador de páginas. Aquí hay un vistazo rápido a dos de nuestros favoritos. Constructor de página gratuito de Elementor
Información y descarga de la demostración de vista

El popular Elementor Page Builder incluye hojas como parte de la versión gratuita del complemento. Todo lo que tiene que hacer es ingresar un elemento de pestaña en su página, luego editar el título, el contenido, el estilo, etc. ¡Esto es!
WPBakery Premium Page Builder
Información y descarga de la demostración de vista

¿Utiliza un tema premium que incluya WPBakery Page Builder (como nuestro propio tema)? ¡Eso es genial! Las pestañas están incorporadas y son fáciles de usar. El módulo de pestañas WPBakery es ligeramente diferente del ejemplo anterior, porque las pestañas están inicialmente vacías cuando las agrega. Deberá insertar elementos de página adicionales (área de texto, imágenes, iconos, etc.) para agregar contenido. Pero esto le brinda mucha libertad para crear las pestañas como desee (además de las opciones de estilo construidas). También he presentado este generador de páginas de blog, por lo que si desea instrucciones más detalladas, consulte nuestra guía WPbakery (recuerde: este complemento se ha llamado previamente Visual Composer, lo siento por cualquier confusión). Instale las pestañas de complemento de WordPress
Información y descarga de la demostración de vista
Si no usa un generador de página, no es necesario usarlo solo para archivos. Hay muchas alternativas excelentes, como el complemento gratuito de WordPress, simplemente conocido como las pestañas WP Shop Mart. Tabs es un complemento inteligente de WordPress que le ayuda a crear un número ilimitado de pestañas hermosas, sin sudar. Comencemos instalando las pestañas de complemento de WordPress. Debido a que está disponible en el repositorio oficial del complemento de WordPress, puede instalar el complemento directamente dentro del administrador de WordPress.

Utilizamos la versión gratuita, pero hay una versión premium disponible si desea actualizar para funciones adicionales más adelante. Instalación de las pestañas de WordPress de complemento Iniciar sesión en el tablero del administrador de WordPress y explorar complementos> Nuevo agregar e ingrese “archivo wpshopmart” en el cuadro de búsqueda de palabras clave. Una vez que haya encontrado el complemento correcto, presione el botón de instalación ahora, como se muestra a continuación. Después de eso, haga clic en el botón de activación. Y listo, las pestañas sensibles a su complemento de WordPress están listas para usar. Ahora, creemos algunas pestañas para descubrir qué ofrece este complemento.
Configure el complemento de WordPress que responde para activar el complemento agregará un nuevo elemento al menú de administración de WordPress. Para crear nuevos archivos, explore las pestañas adaptables> Agregar nuevas pestañas como lo detallé en la pantalla a continuación.
Si hace esto, vaya a Tabs Receptive Builder, que ofrece todas las características que necesita para crear hermosos archivos como jefe. Vea la imagen a continuación para ver las expectativas.

Ni siquiera un pergamino, ¿no? Bueno, puede encontrar la mayoría de las características en la barra lateral derecha. También tenga en cuenta que las pestañas individuales tienen su configuración. Incluso puede usar editores WYSIWYG en las pestañas, lo que significa que tiene control sobre las pestañas.
Ahora, creemos algunos ejemplos de pestañas y mostremoslos en una página o publicación. Añadir título

Comience dando a las pestañas un título descriptivo (como en el caso de los menús de navegación), como se muestra en la imagen de arriba. De esta manera, puede identificar fácilmente sus pestañas en el tablero del administrador de WordPress más tarde, si tiene que editar algo. Para el propósito de este tutorial, bauticé mis pestañas “Prueba las pestañas en casa”. Elija la plantilla de diseño de pestañas

Como se ve en la captura de pantalla anterior, el siguiente paso implica elegir una plantilla de diseño que desee usar para sus pestañas. La versión gratuita de las pestañas de complementos de WordPress le brinda una sola plantilla de diseño, pero siempre puede actualizar a la versión premium para otro 19. Estamos hablando de la libertad del diseño.
Agregue el archivo y luego, agregue cuántas pestañas desea, como se muestra a continuación.

Hemos creado una lista grande que detalla lo que puede hacer en la sección Agregar archivo presentada anteriormente. Los números corresponden a cada área.

Pestaña Título: agregue el título de las pestañas en este campo, p. Descripción, especificaciones, detalles, etc.

Descripción de la pestaña – Agregue la descripción de las pestañas aquí. Este campo le permite agregar el contenido de la pestaña. La mejor parte es que puede usar el editor Wysiwyg (presentado en el número 3 a continuación) para agregar contenido rico en sus pestañas, incluidas imágenes, música y videos
Use Wysiwyg- Si desea usar el ou- s ee- i s- w hat- g para crear el contenido de la pestaña, no dude en presionar este botón para iniciar la ventana superior

Icono de pestaña: este campo lo ayuda a elegir un icono para usar en la pestaña. Las pestañas de complemento de WordPress le brindan acceso a toneladas de iconos increíbles para levantar sus pestañas como un profesional y superar el icono en la parte superior; si desea mostrar el título de pestaña junto al icono, le gustará esta función. Además, le permite apagar el icono sin tocar el título de la pestaña
Eliminar: presione este botón para eliminar una pestaña particular
Agregar nuevo archivo: haga clic en este botón para agregar múltiples pestañas
Eliminar todo, ¿te cansaste de todas las pestañas? Simplemente presione el botón Eliminar para restablecer todo
Algunos consejos de bonificación para ayudarte. Primero, puede deslizar y sujetar las pestañas para reordinarlas y organizarlas como desee.
En segundo lugar, no olvide presionar el botón de boceto una o dos veces a medida que crea las pestañas, para asegurarse de no perder ningún cambio si navega accidentalmente el generador de archivos. Finalmente: si necesita ayuda, hay un gran botón azul que obtiene asistencia justo debajo de la sección Agregar archivo (y en la mayoría de las páginas de arado) que lo lleva al foro oficial de asistencia de pestañas en wordpress.org. No dude en presionar el botón de asistencia si necesita ayuda en cualquier momento. Pestañas de código corto
Luego encontrará el código de pestañas cortos que usa para agregar y mostrar las pestañas en cualquier página o publicación que desee. Por ejemplo, nuestro código corto es [TABS_R ID = 443]. Para mostrar las pestañas en una página, copiaría y pegaría el código corto anterior en esa página. Pestañas de widgets
¿Está buscando agregar pestañas a un área de widget en su sitio web? Si esto es un rotundo sí, le gustará el soporte de widgets que viene con el complemento Tabs WordPress. Si accede al enlace de clic aquí en la imagen de arriba, llegará a la pantalla del widget de WordPress, donde puede agregar sus pestañas donde tenga una personalización de widget de las pestañas (solo eche un vistazo a la barra lateral derecha; es ¡Lleno de opciones de estilo!), Puede agregar sus propios estilos CSS personalizados como se muestra a continuación.
Además, puede establecer la configuración personalizada como configuración predeterminada para todas las pestañas nuevas, simplemente haciendo clic en el botón Actualizar, como se muestra en la imagen de arriba. La barra del lado derecho
La barra lateral derecha que resaltamos en la imagen de arriba le brinda el día. Está lleno de todas las opciones que necesita para estilizar sus pestañas por contenido cardíaco. Las opciones notables incluyen:
El color de fondo de la pestaña

Color de la fuente de las sábanas

Estilo de familia y fuente

Muestre las opciones para el título y el icono de la pestaña

Alineación de la posición del icono de pestaña, es decir, antes o después del título de las pestañas

Pestañas
Animaciones con una descripción de múltiples archivos
Y más
Agregue sus pestañas a una página de WordPress o publique después de agregar la pestaña Contenido y opciones de estilo, desplácese y haga clic en el botón como se muestra a continuación.
En este momento sus pestañas están listas. Solo tiene que agregar las pestañas a una página de WordPress o publicar. Simplemente copie las pestañas de código corto que vi antes. El nuestro es [TABS_R ID = 443]. Inicie el editor de publicaciones (incluso si usa Gutenberg) y pegue el código corto en su publicación / página, presione el botón de publicación como se muestra a continuación. Después de aproximadamente 5 minutos para configurar las cosas; Utilizo el tema de veinte diecisiete y muchos lorem ipsum, vine con el siguiente resultado.
Tenga en cuenta que no he personalizado los colores o algo más. Dime que piensas; ¿No era tan fácil?
Agregar hojas a sus páginas y publicaciones de WordPress son los estudiantes de cuarto grado. No espero tener problemas, especialmente si usa un complemento como WP Shop Mart Tabs. ¿Cómo se agrega pestañas a sus páginas y publicaciones de WordPress? ¿Cuál es su pestaña favorita para el complemento de WordPress? Por favor comparta nuestros pensamientos en los comentarios. ¡Feliz creación!