Es más fácil que nunca crear tablas de precios para sus productos en línea. Crea tantas tablas como quieras y controla los precios y características de cada una con el módulo de Tablas de Precios de tu tema de WordPress división Incluso puede idear un plan particular para aumentar las conversiones. Incluso si su módulo incluye varias tablas de precios, se tratará como un módulo y se puede colocar en cualquier tamaño de columna.

Cómo agregar un módulo de Tablas de tarifas a su página

Antes de que pueda agregar un módulo de tablas de precios a su página, primero debe acceder a Divi Builder. Una vez el Tema divi instalado en su sitio web, notará un botón Utilice Divi Builder encima del editor de publicaciones cada vez que crea una página nueva. Haga clic en este botón para activar Divi Builder y acceder a todos los módulos de Divi Builder. Luego haga clic en el botón Use Visual Builder para iniciar el generador en modo visual. También puede hacer clic en el botón Use Visual Builder cuando navega por su sitio web en primer plano si está conectado a su panel de WordPress.

Una vez que haya ingresado a Visual Builder, puede hacer clic en el botón gris más para agregar un nuevo módulo a su página. Los nuevos módulos solo se pueden agregar dentro de las filas. Si está comenzando una nueva página, recuerde agregar una fila a su página primero.

Busque el módulo de tablas de precios en la lista de módulos y haga clic en él para agregarlo a su página. La lista de módulos se puede buscar, lo que significa que también puede escribir la palabra "tablas de precios" y luego hacer clic en "ingresar" para buscar y agregar automáticamente el módulo de tablas de precios. Una vez que se agrega el módulo, será recibido por la lista de opciones del módulo. Estas opciones se dividen en tres grupos principales: Contenido , diseño et Avanzado .

Caso de uso: agregar una tabla de precios para una página de producto

cuando haces el promociones y de sus productos en una página de destino, las tablas de precios pueden mostrar de manera efectiva sus diversas opciones de precios.

En este ejemplo, voy a agregar un módulo de tabla de precios para mostrar tres planes de precios (o tablas) con uno de esos planes destacándose como un plan destacado para aumentar las conversiones.

Primero, agregue una nueva sección regular a la página donde se deben mostrar las tablas de precios. Agregue una fila de ancho completo (1 columna) a la sección e inserte un módulo Tablas de precios en la fila.

En la configuración de las tablas de precios, en la pestaña Contenido, haga clic en + Agregar un nuevo elemento para agregar tu primera tabla.

Actualice los parámetros de la tabla de precios de la siguiente manera:

Opciones de contenido

Título: Moneda personal: $ Por: año Precio: 69 Texto del botón: Contenido de registro:

Acceso a todos los temas Actualizaciones de temas perpetuas Soporte técnico premium -Acceso a todos los complementos -Archivos de superposición de la tienda -Sin tarifa anual

URL del botón: [ingresar URL del botón] Fondo: #ffffff

Opciones de diseño

Precio Color del texto: # 3e51b5 Use estilos de botón personalizados: SÍ Color del texto del botón: #ffffff Color del botón: # 3e51b5 Ancho del botón: 0px

Guardar configuración

Ahora, duplique la tabla de precios que acaba de crear dos veces para tener tres tablas de precios en total.

Para la tabla de precios medios, actualice las siguientes opciones:

Pestaña de contenido

Título: Desarrollador Precio: 89 Contenido: Acceso a todos los temas Actualizaciones perpetuas del tema Soporte técnico premium Acceso a todos los archivos en capas de Photoshop - sin tarifa anual URL del botón: [ingresar URL del botón]

Pestaña Diseño

Color del texto: # 0091ca Color del botón: # 0091ca

Para la tercera tabla de precios, actualice la configuración de la siguiente manera:

Pestaña de contenido

Título: Precio de por vida: 249 Texto del botón: Suscribirse Contenido: Acceso a todos los temas Actualizaciones permanentes del tema Soporte técnico premium Acceso a todos los complementos Archivos de Photoshop en capas Sin tarifa anual URL del botón: [ingresar URL botón]

Guardar configuración

Ahora regrese a la configuración de la tabla de precios y actualice lo siguiente:

Opciones de contenido

Color de fondo de la tabla destacada: #0091ca

Opciones de diseño

Color de la bola: # 3e51b5 Color de la mesa destacado: # 0091ca

Guardar configuración

Ahora regrese y edite la configuración de la sección para darle a la sección un color de fondo de #3e51b5.

Es todo. Ahora tiene una tabla de precios con tres opciones con la opción del medio establecida como un elemento destacado que se destaca del resto.

Opciones de contenido para tablas de precios

En la pestaña de contenido, encontrará todos los elementos de contenido del módulo, como texto, imágenes e iconos. Todo lo que controla lo que aparece en su módulo siempre se encontrará en esta pestaña.

+ Agregar un nuevo artículo

Aquí es donde agrega nuevas tablas de precios a su módulo. Al hacer clic en "+ agregar nuevo artículo" se abrirá una lista completamente nueva de opciones de diseño específicas para esa tabla de precios. Consulte a continuación la configuración de la tabla de precios individual.

Después de agregar su primera pestaña, aparecerá una barra gris con el título de su tabla de precios en forma de etiqueta. La barra gris también tiene tres botones que le permiten editar, duplicar o eliminar la tabla.

Mostrar Bullet

De forma predeterminada, los elementos de la tabla de precios se muestran como listas con viñetas. Si desea eliminar las viñetas de la lista de funciones, puede desactivar esta opción.

Color de fondo de la tabla destacada

Cada tabla de precios se puede "presentar". Las tablas destacadas se resaltan en la fila, lo que las diferencia de otras opciones. Con esta configuración, puede cambiar el color de fondo solo para las tablas destacadas.

Color de fondo del encabezado de la tabla

Encima de cada tabla de precios hay un área de encabezado que incluye el título y el subtítulo de la tabla. Puede controlar el color de fondo de esta área independientemente del color de fondo de la tabla principal seleccionando el color deseado en el selector de color.

Encabezado de tabla destacado

Cada tabla de precios puede ser "destacada". Las tablas destacadas se resaltan en la fila, lo que las diferencia de otras opciones. Con esta configuración, puede cambiar el color de fondo del encabezado solo para las tablas seleccionadas.

Color de fondo

Por defecto, las tablas de precios tienen un color de fondo blanco. Si desea utilizar un color diferente para el fondo de la tabla de precios, puede establecer su color personalizado aquí utilizando el selector de color.

Etiqueta de administrador

Esto cambiará la etiqueta del módulo en el constructor para una fácil identificación. Cuando usa la vista WireFrame en Visual Builder, estas etiquetas aparecen en el bloque de módulo de la interfaz Divi Builder.

Opciones de diseño de mesa de precios

En la pestaña Diseño, encontrará todas las opciones de estilo del módulo, como fuentes, colores, tamaño y espaciado. Esta es la pestaña que usará para cambiar la apariencia de su módulo. Cada módulo Divi tiene una larga lista de configuraciones de diseño que puede usar para cambiar cualquier cosa.

alineación

De forma predeterminada, las listas de funciones se alinean a la izquierda en la tabla de precios. Si desea alinearlos, puede activar esta opción.

Eliminar la sombra paralela de la tabla destacada

De forma predeterminada, las tablas de precios tienen una sombra sutil detrás de cada tabla. Si desea eliminar esta sombra, puede habilitar esta opción.

Artículos de la lista en el centro

Aquí puede elegir centrar los elementos enumerados en su tabla.

Color de la pelota

De forma predeterminada, las viñetas en la lista de la tabla de precios heredarán el color de acento de su tema. Si desea usar un color diferente, puede configurarlo aquí usando el selector de color.

Color de la tabla destacada

Si desea usar un color diferente para las viñetas en las tablas de precios, puede establecer ese color aquí usando el selector de color.

Color del texto del encabezado de la tabla destacada

Esta opción controla el color del texto del encabezado de su tabla. Si cambia el color de fondo del encabezado de la tabla, también puede cambiar esta opción para garantizar la legibilidad.

Fuente de encabezado

Puede cambiar la fuente del texto del encabezado seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto usando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente del encabezado

Aquí puede ajustar el tamaño del texto de su encabezado. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del encabezado

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su encabezado, elija el color deseado en el selector de color usando esta opción.

Espaciado entre letras del encabezado

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto del encabezado, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la fila del encabezado

La altura de la fila afecta el espacio entre cada fila del texto del encabezado. Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espaciado deseado en el campo de entrada a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto de la tabla destacada

Esto cambia el color del texto del cuerpo de su tabla destacada. Si cambia el color de fondo de su tabla, es posible que deba cambiar esta opción para garantizar la legibilidad.

Fuente del cuerpo

Puede cambiar la fuente de su cuerpo seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de letra del cuerpo

Aquí puede ajustar el tamaño del texto del cuerpo. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del cuerpo

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color de su texto, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras corporales

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en su texto, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea del cuerpo

La altura de la línea afecta el espacio entre cada línea de texto en su cuerpo Si desea aumentar el espacio entre cada línea, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espaciado deseado en el campo de entrada ubicado a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color de texto de la tabla subtítulo

Esto cambia el color del texto del título de la tabla destacada. Si cambia el color de fondo de su tabla, es posible que deba cambiar esta opción para garantizar la legibilidad.

Fuente de subtítulos

Puede cambiar la fuente del texto de la leyenda seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente de subtítulo o subtítulo

Aquí puede ajustar el tamaño del texto del subtítulo. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del subtítulo

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su título, elija el color deseado en el selector de color usando esta opción.

Espaciado de subtítulos

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de la leyenda, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea del subtítulo

La altura de la línea afecta el espacio entre cada línea del texto de la leyenda. Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Moneda Moneda y frecuencia

Puede cambiar la fuente y el texto de frecuencia de su moneda seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Moneda Moneda Tamaño y frecuencia

Aquí puede ajustar el tamaño de la moneda y el texto de frecuencia. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede introducir "px" o "em" según el valor de su tamaño para cambiar el tipo de unidad.

Color de texto de moneda y frecuencia

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color de su moneda y el texto de frecuencia, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras y monedas

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en su moneda y el texto de frecuencia, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Línea de moneda de frecuencia

La altura de la línea afecta el espacio entre cada línea de su moneda y el texto de frecuencia.Si desea aumentar el espacio entre cada línea, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Precio de color destacado

Esto cambia el color de los precios de su tabla destacada. Si cambia el color de fondo de su tabla, es posible que deba cambiar esta opción para garantizar la legibilidad.

Price Police

Puede cambiar la fuente del texto de su precio seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto usando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente de precio

Aquí puede ajustar el tamaño del texto de su precio. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del precio

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su precio, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras de precio

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de su precio, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea de precio

La altura de la fila afecta el espacio entre cada fila de su texto de precio Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada ubicado a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Usa el borde

Habilitar esta opción colocará un borde alrededor de su módulo. Este borde se puede personalizar utilizando los siguientes parámetros condicionales.

Color del borde

Esta opción afecta el color de su borde. Seleccione un color personalizado del selector de color para aplicarlo a su borde.

Ancho del borde

De forma predeterminada, los bordes tienen 1 píxel de ancho. Puede aumentar este valor arrastrando el control deslizante de rango o ingresando un valor personalizado en el campo de entrada a la derecha del control deslizante. Se admiten unidades de medida personalizadas, lo que significa que puede cambiar la unidad predeterminada de "px" a algo más como em, vh, vw, etc.

Estilo del borde

Los bordes admiten ocho estilos diferentes: sólido, punteado, doble, surco, cresta, superpuesto e inicio. Seleccione el estilo que desee en el menú desplegable para aplicarlo a su borde.

Use estilos personalizados para el botón

Habilitar esta opción revela varias configuraciones de personalización de botones que puede usar para cambiar la apariencia del botón de su módulo.

Tamaño del texto del botón

Esta configuración se puede utilizar para aumentar o disminuir el tamaño del texto en el botón. El botón se adapta a medida que aumenta y disminuye el tamaño del texto.

Color del texto del botón

De forma predeterminada, los botones adoptan el color de acento de su tema como se define en el Personalizador de temas. Esta opción le permite asignar un color de texto personalizado al botón de este módulo. Seleccione su color personalizado con el selector de color para cambiar el color del botón.

Color de fondo del botón

Por defecto, los botones tienen un color de fondo transparente. Esto se puede cambiar seleccionando el color de fondo deseado en el selector de color.

Ancho del borde del botón

Todos los botones Divi tienen un borde de 2px por defecto. Este borde se puede aumentar o disminuir con esta configuración. Los bordes se pueden eliminar ingresando un valor de 0.

Color del borde del botón

De forma predeterminada, los bordes de los botones adoptan el color de acento de su tema como se define en el Personalizador de temas. Esta opción le permite asignar un color de borde personalizado al botón de este módulo. Seleccione su color personalizado con el selector de color para cambiar el color del borde del botón.

Radio del borde del botón

El radio del borde afecta la redondez de las esquinas de sus botones. De forma predeterminada, los botones en Divi tienen un pequeño radio de borde que redondea las esquinas en 3 píxeles. Puede reducir este valor a 0 para crear un botón cuadrado o aumentarlo significativamente para crear botones con bordes circulares.

Espaciado de las letras del botón

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de su botón, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Policía de Boutton

Puede cambiar la fuente del texto de su botón seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto usando las opciones de negrita, cursiva, mayúsculas y subrayado.

Agregar un ícono de botón

Desactivado, esta configuración eliminará los iconos de su botón. De forma predeterminada, todos los botones Divi muestran un icono de flecha.

Icono de botón

Si los íconos están habilitados, puede usar esta configuración para elegir qué ícono usar en su botón. Divi tiene diferentes iconos para elegir.

Color del icono del botón

El ajuste de esta configuración cambiará el color del icono que aparece en su botón. De forma predeterminada, el color del icono es el mismo que el color del texto del botón, pero esta configuración le permite ajustar el color de forma independiente.

Ubicación del icono de botón

Puede elegir mostrar el icono de su botón a la izquierda o derecha de su botón.

Mostrar icono solo al pasar el cursor sobre el botón

De forma predeterminada, los iconos de los botones se muestran solo cuando se desplaza. Si desea que el icono aparezca siempre, desactive esta configuración.

Color del texto en el paso elevado del botón

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Color de fondo del botón de desplazamiento

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Botón de borde Color Hover

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Botón de radio del borde deslizante

Cuando el mouse de un visitante pasa el mouse sobre el botón, se utilizará este valor. El valor cambiará del valor base definido en la configuración anterior.

Botón de espaciado de nota apuntando

Cuando el mouse de un visitante pasa el mouse sobre el botón, se utilizará este valor. El valor cambiará del valor base definido en la configuración anterior.

Opciones avanzadas de hoja de tarifas

En la pestaña avanzada, encontrará opciones que los diseñadores web más experimentados pueden encontrar útiles, como los atributos personalizados de CSS y HTML. Aquí puede aplicar CSS personalizado a cualquiera de los muchos elementos del módulo. También puede aplicar clases e ID de CSS personalizados al módulo, que se pueden usar para personalizar el módulo en el archivo style.css de su tema secundario.

ID de CSS

Ingrese un ID de CSS opcional para usar en este módulo. Se puede usar una identificación para crear un estilo CSS personalizado o para vincular a secciones particulares de su página.

Clase de CSS

Ingrese las clases de CSS opcionales para usar en este módulo. Se puede usar una clase CSS para crear estilos CSS personalizados. Puede agregar varias clases, separadas por un espacio. Estas clases se pueden usar en su tema secundario Divi o en la hoja de estilo CSS personalizada que agrega a su página o sitio web usando las opciones del tema Divi o la configuración de la página Divi Builder.

CSS personalizado

También se puede aplicar CSS personalizado al módulo y a cualquiera de los componentes internos del módulo. En la sección CSS personalizado, encontrará un campo de texto donde puede agregar hojas de estilo CSS personalizadas directamente a cada elemento. Las entradas CSS en esta configuración ya están envueltas en etiquetas de estilo. Así que simplemente ingrese las reglas CSS separadas por punto y coma.

visibilidad

Esta opción le permite controlar los dispositivos en los que aparece su módulo. Puede optar por desactivar su módulo en tabletas, teléfonos inteligentes o computadoras de escritorio individualmente. Esto es útil si desea utilizar diferentes mods en diferentes dispositivos o si desea simplificar el diseño del móvil eliminando ciertos elementos de la página.

Opciones de contenido de tablas de precios individuales

Título

El título que inserte aquí se usará para esta opción de precio (Premium).

Subtítulos

El subtítulo que inserte aquí aparecerá debajo de su título.

Ideamos

Ingrese el símbolo de su moneda deseada aquí.

por

Si su precio está basado en suscripción, ingrese el ciclo de suscripción aquí (por ejemplo, Año).

Precio

Ingrese el valor del producto aquí.

Texto del botón

Especifique el texto del botón aquí.

Contenido

Este campo es donde puede ingresar la lista de características que vienen o no vienen con su producto. Separe cada elemento de la lista en una nueva línea y comience cada línea con un símbolo + o -. A + especifica una característica incluida, mientras que A - especifica una característica excluida.

URL del botón

En la parte inferior de cada tabla, puede insertar un botón de llamada a la acción insertando una URL web válida en este campo. Deja esto y el
campo de texto de botón vacío si no desea tener un botón en su tabla de precios.

Color de fondo

Defina un color de fondo personalizado para su módulo o déjelo en blanco para usar el color predeterminado.

Opciones de diseño para tablas de precios individuales

Haz que esta tabla aparezca

Elija adelantar o no esta tabla de precios con este menú desplegable. Esto permitirá que la tabla se destaque del resto.

Color del artículo excluido

Para los elementos de su lista que se han establecido como excluidos con el símbolo -, puede ajustar su color con esta configuración. Por ejemplo, es posible que desee cambiar el color a rojo o reducir su opacidad para indicar visualmente que los elementos están excluidos del paquete actual.

Fuente de encabezado

Puede cambiar la fuente del texto del encabezado seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente del encabezado

Aquí puede ajustar el tamaño del texto de su encabezado. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del encabezado

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su encabezado, elija el color deseado en el selector de color usando esta opción.

Espaciado entre letras del encabezado

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto del encabezado, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la fila del encabezado

La altura de la fila afecta el espacio entre cada fila del texto del encabezado. Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espaciado deseado en el campo de entrada a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Fuente del cuerpo

Puede cambiar la fuente de su cuerpo seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de letra del cuerpo

Aquí puede ajustar el tamaño del texto del cuerpo. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del cuerpo

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color de su texto, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras corporales

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en su texto, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea del cuerpo

La altura de la línea afecta el espacio entre cada línea de texto en su cuerpo Si desea aumentar el espacio entre cada línea, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espaciado deseado en el campo de entrada ubicado a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Fuente de subtítulos

Puede cambiar la fuente del texto de la leyenda seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de letra del subtítulo

Aquí puede ajustar el tamaño del texto del subtítulo. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color de texto de subtítulos

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su título, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras de subtítulos

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de la leyenda, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea de subtítulos

La altura de la línea afecta el espacio entre cada línea del texto de la leyenda. Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Moneda Moneda y frecuencia

Puede cambiar la fuente y el texto de frecuencia de su moneda seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente para moneda y frecuencia

Aquí puede ajustar el tamaño de la moneda y el texto de frecuencia. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede introducir "px" o "em" según el valor de su tamaño para cambiar el tipo de unidad.

Color del texto para moneda y frecuencia

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color de su moneda y el texto de frecuencia, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras y monedas

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en su moneda y el texto de frecuencia, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Línea de moneda y frecuencia

La altura de la línea afecta el espacio entre cada línea de su moneda y el texto de frecuencia.Si desea aumentar el espacio entre cada línea, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Política de precios

Puede cambiar la fuente del texto de su precio seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Tamaño de fuente de precio

Aquí puede ajustar el tamaño del texto de su precio. Puede arrastrar el control deslizante de rango para aumentar o disminuir el tamaño de su texto o ingresar directamente el valor de tamaño de texto deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Color del texto del precio

De forma predeterminada, todos los colores del texto en Divi aparecen en blanco o gris oscuro. Si desea cambiar el color del texto de su precio, elija el color deseado en el selector de color usando esta opción.

Espaciado de letras de precio

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de su precio, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Altura de la línea de precio

La altura de la fila afecta el espacio entre cada fila de su texto de precio Si desea aumentar el espacio entre cada fila, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada ubicado a la derecha del cursor. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Use estilos personalizados para el botón

Habilitar esta opción revela varias configuraciones de personalización de botones que puede usar para cambiar la apariencia del botón de su módulo.

Tamaño del texto del botón

Esta configuración se puede utilizar para aumentar o disminuir el tamaño del texto en el botón. El botón se adapta a medida que aumenta y disminuye el tamaño del texto.

Color del texto del botón

De forma predeterminada, los botones adoptan el color de acento de su tema como se define en el Personalizador de temas. Esta opción le permite asignar un color de texto personalizado al botón de este módulo. Seleccione su color personalizado con el selector de color para cambiar el color del botón.

Color de fondo del botón

Por defecto, los botones tienen un color de fondo transparente. Esto se puede cambiar seleccionando el color de fondo deseado en el selector de color.

Ancho del borde del botón

Todos los botones Divi tienen un borde de 2px por defecto. Este borde se puede aumentar o disminuir con esta configuración. Los bordes se pueden eliminar ingresando un valor de 0.

Color del borde del botón

De forma predeterminada, los bordes de los botones adoptan el color de acento de su tema como se define en el Personalizador de temas. Esta opción le permite asignar un color de borde personalizado al botón de este módulo. Seleccione su color personalizado con el selector de color para cambiar el color del borde del botón.

Radio del borde del botón

El radio del borde afecta la redondez de las esquinas de sus botones. De forma predeterminada, los botones en Divi tienen un pequeño radio de borde que redondea las esquinas en 3 píxeles. Puede reducir este valor a 0 para crear un botón cuadrado o aumentarlo significativamente para crear botones con bordes circulares.

Espaciado de letras de los botones

El espaciado de letras afecta el espacio entre cada letra. Si desea aumentar el espacio entre cada letra en el texto de su botón, use el control deslizante de rango para ajustar el espacio o ingrese el tamaño de espacio deseado en el campo de entrada a la derecha del control deslizante. Los campos de entrada admiten diferentes unidades de medida, lo que significa que puede ingresar "px" o "em" según el valor de su tamaño para cambiar su tipo de unidad.

Fuente del botón

Puede cambiar la fuente del texto de su botón seleccionando la fuente deseada en el menú desplegable. Divi viene con docenas de fuentes geniales impulsadas por Google Fonts. De forma predeterminada, Divi usa la fuente Open Sans para todo el texto de su página. También puede personalizar el estilo de su texto utilizando las opciones de negrita, cursiva, mayúsculas y subrayado.

Agregue un ícono al botón

Desactivado, esta configuración eliminará los iconos de su botón. De forma predeterminada, todos los botones Divi muestran un icono de flecha en el desplazamiento.

Icono de botón

Si los íconos están habilitados, puede usar esta configuración para elegir qué ícono usar en su botón. Divi tiene diferentes iconos para elegir.

Color del icono del botón

El ajuste de esta configuración cambiará el color del icono que aparece en su botón. De forma predeterminada, el color del icono es el mismo que el color del texto del botón, pero esta configuración le permite ajustar el color de forma independiente.

Ubicación del botón de icono

Puede elegir mostrar el icono de su botón a la izquierda o derecha de su botón.

Mostrar icono solo al pasar el cursor sobre el botón

De forma predeterminada, los iconos de los botones se muestran solo cuando se desplaza. Si desea que el icono aparezca siempre, desactive esta configuración.

Color del texto en el paso elevado del botón

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Color de fondo del botón en el paso elevado

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Color del borde en paso elevado

Cuando el botón de un visitante pasa por encima del botón, se utilizará este color. El color cambiará del color base definido en la configuración anterior.

Radio del borde del botón en la descripción

Cuando el mouse de un visitante pasa el mouse sobre el botón, se utilizará este valor. El valor cambiará del valor base definido en la configuración anterior.

Espaciado de las letras del botón en el paso elevado

Cuando el mouse de un visitante pasa el mouse sobre el botón, se utilizará este valor. El valor cambiará del valor base definido en la configuración anterior.

Opciones de tabla de precios individuales Opciones avanzadas

CSS personalizado

También se puede aplicar CSS personalizado al módulo y a cualquiera de los componentes internos del módulo. En la sección CSS personalizado, encontrará un campo de texto donde puede agregar hojas de estilo CSS personalizadas directamente a cada elemento. Las entradas CSS en esta configuración ya están envueltas en etiquetas de estilo. Así que simplemente ingrese las reglas CSS separadas por punto y coma.

[vc_row center_row = "yes"] [vc_column width = "1/2 ″] [vcex_button target =" blank "layout =" extended "align =" center "font_family =" Raleway "font_weight =" 700 ″ style = "flat" custom_background = "# 18b69d" custom_hover_background = "# 118d7a" custom_color = "#ffffff" custom_hover_color = "#ffffff" icon_right = "fa fa-download"] DESCARGUE EL TEMA DIVI [/ vcex_button] [/ width_column] [»vc_column] »1/2 ″] [vcex_button url =" https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials "target =" blank "layout =" extended "align =" center " font_family = "Raleway" font_weight = "700 ″ style =" flat "custom_background =" # c4226e "custom_hover_background =" # 8d184f "custom_color =" #ffffff "custom_hover_color =" #ffffff "icon_right =" fa fa-download "] DESCARGAR PLANTILLAS DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

Otros tutoriales de Divi

• 5 sitios web para su uso restaurante temático Divi
• Cómo agregar texto en un producto Divi WooCommerce
• Cómo cambiar el color del menú entre páginas Divi
• Cómo personalizar las cuadrículas de un blog con Divi
• Cómo utilizar la función de editor Divi en WordPress
• Cómo crear un control deslizante Divi a pantalla completa
• Cómo cambiar el color de los menús entre páginas Divi
• Características que probablemente no conozcas sobre Divi
• Cómo usar Divi Builder en WordPress
• Cómo usar el módulo de desplazamiento de video Divi
• Cómo usar el módulo Divi Builder Flip
• Cómo agregar un módulo testimonial en Divi Builder
• Cómo usar el módulo de texto Divi
• Cómo crear un control deslizante en Divi
• Cómo editar un rol de usuario Divi
• Cómo usar el módulo de Divi Social Media
• Cómo usar el módulo de tienda en el tema WordPress Divi
• Cómo usar el módulo de la barra lateral Divi
• Cómo usar el Módulo Divi Price Table
• Cómo usar el módulo de título de las publicaciones de Divi
• Cómo agregar un módulo de video de Divi
• Cómo usar el módulo de navegación del artículo
• Cómo usar el módulo de búsqueda Divi
• Cómo usar el módulo Divi wallet
• Cómo usar el módulo de persona en Divi Builder
• Cómo usar el módulo de billetera con filtro Divi
• Cómo usar el módulo deslizante de ancho completo
• Cómo usar el Módulo de imagen Divi Builder
• Cómo utilizar el módulo de navegación de ancho completo de Divi Builder
• Cómo usar el módulo de la galería de imágenes
• Cómo utilizar el módulo de tarjeta de ancho completo de Divi Builder
• Cómo utilizar el módulo de cartera de ancho completo de Divi
• Cómo usar el módulo de encabezado de ancho completo Divi
• Cómo usar el módulo Divi Counter
• Cómo usar el control deslizante de artículos en Divi Builder
• Cómo usar el módulo Divi Email Optin