Para desarrolladores de HubSpot

Dónde van tus cambios

Cada tema de transjt incluye dos archivos reservados para tu propio código:

• custom.css para los estilos
• custom.js para los scripts

Se cargan después de todo lo que genera transjt, así que en la mayoría de los casos tus reglas se imponen sin !important.

Encontrar los archivos

1. En HubSpot, ve a Content > Design Manager.
2. Abre la carpeta transjt projects y después la carpeta de tu proyecto. Su nombre empieza por tj-, seguido del nombre del proyecto, por ejemplo tj-northbeam-claude.
3. custom.css está en la carpeta css, y custom.js, en la carpeta js.

Editar en el Design Manager

1. Abre custom.css o custom.js.
2. Añade tu código al final del archivo.
3. Haz clic en Publish changes.

Las páginas publicadas recogen el cambio la próxima vez que se publican. Para verlo de inmediato, abre la página en HubSpot y haz clic en Update.

Editar en local con la CLI de HubSpot

Si prefieres tu propio editor de código, usa la CLI de HubSpot. Descarga el tema:

hs cms fetch "transjt projects/tj-<your-project>" ./my-theme

Edita css/custom.css o js/custom.js y después sube el archivo, por ejemplo:

hs cms upload ./my-theme/css/custom.css "transjt projects/tj-<your-project>/css/custom.css"

O ejecuta hs cms watch para subir cada cambio mientras trabajas.

Ejemplo: ajustar un módulo

Inspecciona el elemento en tu navegador para encontrar la clase del módulo que quieres cambiar y después aplica tus reglas a esa clase en custom.css:

/* Example: larger hero headline on mobile */
@media (max-width: 767px) {
.hero__title { font-size: 2.25rem; }
}

El nombre de clase de arriba es solo un ejemplo. Usa la clase que encuentres en tu propio tema.

Buenas prácticas

• Mantén todos los ajustes en custom.css y custom.js. Los cambios en los archivos generados se pueden perder cuando vuelves a exportar.
• Limita tus reglas a una clase de módulo, para que no afecten a otras partes del sitio.
• Comenta para qué sirve cada bloque de CSS. El próximo desarrollador te lo agradecerá.