Personalización Básica de CSS
Los cambios básicos de CSS permiten personalizar la apariencia de tu tienda Shopify más allá de la configuración predeterminada del tema. En este capítulo, aprenderás a crear e importar un nuevo archivo CSS a tu tema para realizar modificaciones de estilo.
Pasos
- Crear un nuevo archivo CSS: ve a Tienda Online > Temas > Editar código y abre la carpeta Assets. Haz clic en Agregar un nuevo recurso, elige Crear un archivo en blanco y nómbralo custom.css;
- Agregar código CSS: abre tu archivo
custom.cssy añade este código para cambiar las fuentes y ajustar los estilos de los encabezados:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
h2 {
font-family: 'Poppins', sans-serif;
font-size: 42px;
font-weight: 600;
color: #000;
}
- Vincular tu archivo CSS al tema: ve al archivo
layout/theme.liquidy agrega la siguiente línea antes de la etiqueta de cierre</head>para vincular tu nuevo archivo CSS:
{{ 'custom.css' | asset_url | stylesheet_tag }}
- Previsualizar los cambios: guarda los cambios y previsualiza tu tienda para ver cómo se han actualizado la fuente y los estilos de los encabezados.
1. ¿Dónde se crea un nuevo archivo CSS en Shopify?
2. ¿Qué cambia el código CSS proporcionado?
3. ¿Cómo se importa un archivo CSS personalizado en tu tema de Shopify?
4. ¿Por qué es útil realizar cambios personalizados en CSS?
5. ¿Cuál es el propósito de importar la fuente Poppins en el ejemplo?
¡Gracias por tus comentarios!
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Can you explain how to use Google Fonts with Shopify in more detail?
What should I do if my custom CSS changes aren't showing up on my store?
How can I customize other elements besides headings and paragraphs?
Awesome!
Completion rate improved to 6.25Personalización Básica de CSS
Desliza para mostrar el menú
Los cambios básicos de CSS permiten personalizar la apariencia de tu tienda Shopify más allá de la configuración predeterminada del tema. En este capítulo, aprenderás a crear e importar un nuevo archivo CSS a tu tema para realizar modificaciones de estilo.
Pasos
- Crear un nuevo archivo CSS: ve a Tienda Online > Temas > Editar código y abre la carpeta Assets. Haz clic en Agregar un nuevo recurso, elige Crear un archivo en blanco y nómbralo custom.css;
- Agregar código CSS: abre tu archivo
custom.cssy añade este código para cambiar las fuentes y ajustar los estilos de los encabezados:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
h2 {
font-family: 'Poppins', sans-serif;
font-size: 42px;
font-weight: 600;
color: #000;
}
- Vincular tu archivo CSS al tema: ve al archivo
layout/theme.liquidy agrega la siguiente línea antes de la etiqueta de cierre</head>para vincular tu nuevo archivo CSS:
{{ 'custom.css' | asset_url | stylesheet_tag }}
- Previsualizar los cambios: guarda los cambios y previsualiza tu tienda para ver cómo se han actualizado la fuente y los estilos de los encabezados.
1. ¿Dónde se crea un nuevo archivo CSS en Shopify?
2. ¿Qué cambia el código CSS proporcionado?
3. ¿Cómo se importa un archivo CSS personalizado en tu tema de Shopify?
4. ¿Por qué es útil realizar cambios personalizados en CSS?
5. ¿Cuál es el propósito de importar la fuente Poppins en el ejemplo?
¡Gracias por tus comentarios!
