Preguntas Frecuentes
NUEVO
Soporte de Bitrix24
Inscripción e inicio de sesión
Cómo empezar
Feed
Messenger
Página de inicio: el Vibe
Calendario
Bitrix24 Drive
Webmail
Grupos de trabajo
Tareas y proyectos
CoPilot - IA en Bitrix24
CRM
Contact center
Sales center
CRM Analytics
Sales Intelligence
BI Builder
Bitrix24 Market
Sitios web
Tienda Online
CRM + Online store
Tienda CRM
Compañía
Base de conocimientos
Firma electrónica
Firma electrónica para RR. HH.
Automatización
Flujos de trabajo
Marketing
Gestión del inventario
Telefonía
Mi perfil
Configuraciones de la cuenta
Suscripción
Enterprise
Bitrix24 En Premisa
Aplicación de escritorio
Preguntas generales
Actualización de los artículos (archivo)
Log In
Su Bitrix24
Autorizar el ingreso
a su cuenta de Bitrix24
Ingresar

Soporte Bitrix24

Agregar CSS personalizado al sitio web o tienda online

En Bitrix24, siempre puede agregar CSS personalizado a su sitio web para personalizar el aspecto de los elementos.

El uso de CSS requiere habilidades y experiencia particulares. Le recomendamos leer los tutoriales de CSS primero si nunca lo ha usado antes. Por ejemplo, la guía de CSS gratuita.

A continuación, consideremos algunos ejemplos básicos del uso de CSS personalizado en Bitrix24.

Cambiar el color de elementos

Por ejemplo, su empresa utiliza solo ciertos colores. Use CSS personalizado para cambiar los colores de los elementos.

Tenemos un bloque con texto y vamos a cambiar los colores de fuente y de fondo.

Debe publicar la página antes de comenzar a trabajar con CSS personalizado.

Abra Herramientas para desarrolladores en su navegador > haga click en Inspect > seleccione el bloque que quiere personalizar.

Para cambiar el color de la fuente, necesita usar ID y la clase de este bloque.

 #block1682 .landing-block-node-title 
{
color: #FF6347 ;
}
Si no especifica el ID del bloque, los cambios se aplicarán a todos los bloques similares en la página.

Para cambiar el color de fondo, debe seleccionar este bloque, usar ID y la clase del bloque y especificar que necesita la etiqueta de la sección (section).

 #block1682.block-27-3-one-col-fix-title section
{
background-color: #00FFFF;
}

Abra su cuenta de Bitrix24 > Sitios > seleccione este sitio web > Acciones > Configurar sitio > HTML personalizado y CSS > marque la opción Agregar / Editar > pegue estos códigos en el cuadro de texto del Código CSS > haga click en Guardar.

No necesita volver a publicar su sitio web, solo actualice la página. Los colores de fuente y de fondo se cambiarán en este bloque.

También puede utilizar la declaración !important. Esta función hace que determinadas propiedades tomen mayor importancia (por ejemplo, el color: FF6347 !important;).

Ocultar elementos del bloque

Si quiere ocultar algunos elementos del bloque, también puede usar CSS personalizado. Para hacerlo, necesita obtener la clase de este bloque primero. Por ejemplo, vamos a ocultar botones en el bloque de lista de precios.

No se olvide de hacer click en Publicar antes de abrir Herramientas para desarrolladores.

Luego agregue el código al cuadro de texto del Código CSS en la pestaña Configurar sitio:

.landing-block-node-price-button
{
display: none;
}

Guarde los cambios y actualice la página.

En la versión self-hosted (en premisa) de Bitrix24 el CSS personalizado se puede usar desde la versión 18.5.8 del módulo de Sitios. Verifique por adelantado si su Bitrix24 está actualizado y, si es necesario, actualice su cuenta.
¿Le ha resultado útil esta información?
Asistencia de especialistas en integración
No es lo que estoy buscando
Texto complicado e incomprensible
La información está desactualizada
La explicación es demasiado corta. Necesito más información
No me gusta cómo funciona esta herramienta
Ir a Bitrix24
¿No tiene una cuenta? Créela gratis
Artículos relacionados
Diseño de sitios web y tiendas online ¿Cómo usar las etiquetas de encabezado? Configuraciones del sitio web y la página web Configurar animación en sitios web de Bitrix24 Eliminar / desactivar el sitio web Cómo transferir un sitio web o tienda online a otro Bitrix24 Parámetros UTM Sitios web: interfaz para trabajar con colores y fondos Google Maps en Sitios web de Bitrix24 Favicon del sitio web