# Como aumento la fuente del titulo y precio de un producto?

**URL:** <https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221>\
**Category:** WooCommerce\
**Created:** [11 Agosto, 2024 01:07 UTC](https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221 "2024-08-11T01:07:00Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ivan\_Montero](https://foro.wpargentina.org/user_avatar/foro.wpargentina.org/ivan_montero/32/3389_2.png) [@Ivan\_Montero](https://foro.wpargentina.org/u/Ivan_Montero)\
**Post date:** [11 Agosto, 2024 01:07 UTC](https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221/1 "2024-08-11T01:07:01Z")

</div>

Busque mil maneras y no puedo, mi tema Astra no tiene la opcion, en el constructor tampoco, probe codigo y no pude, no se si sea yo o que

---

<div class="post-metadata">

**Author:** ![0xAlm0ck](https://foro.wpargentina.org/letter_avatar_proxy/v4/letter/0/a6a055/32.png) [@0xAlm0ck](https://foro.wpargentina.org/u/0xAlm0ck)\
**Post date:** [11 Agosto, 2024 20:50 UTC](https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221/2 "2024-08-11T20:50:31Z")

</div>

@Ivan_Montero podrás compartir el código con el que probaste ?  
Y por otro lado que modelo y builder estás usando ? Porque creo que Astra permite varios.

Un saludo.

---

<div class="post-metadata">

**Author:** ![Binweb](https://foro.wpargentina.org/letter_avatar_proxy/v4/letter/b/d9b06d/32.png) [@Binweb](https://foro.wpargentina.org/u/Binweb)\
**Post date:** [12 Agosto, 2024 19:48 UTC](https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221/3 "2024-08-12T19:48:42Z")

</div>

Hola @Ivan_Montero  
Si lo manejas con Astra, generalmente está en Apariencia → Personalizar → Woocommerce → Catalogo o página individual, o archivo si es la tienda en sí…  
Si lo armaste con Elementor, revisa por fuentes globales y/o en el elemento de los productos en Estilos.  
Es raro que no se pueda, ya que es de los más utilizados tanto con Elementor como con Gutenberg el theme Astra…  
Es el free o pro?

Saludos  
Leo

---

<div class="post-metadata">

**Author:** ![TitoWhisky](https://foro.wpargentina.org/user_avatar/foro.wpargentina.org/titowhisky/32/1953_2.png) [@TitoWhisky](https://foro.wpargentina.org/u/TitoWhisky)\
**Post date:** [1 Diciembre, 2025 19:40 UTC](https://foro.wpargentina.org/t/como-aumento-la-fuente-del-titulo-y-precio-de-un-producto/6221/4 "2025-12-01T19:40:07Z")

</div>

Hola le pregunte a chatgpt porque seguro hay que hacerlo con pho o css, yo siempre prefiero en estos casos ccs y me dio estas opciones:

A continuación le detallo **las formas más seguras y controladas** para aumentar el tamaño de fuente del **título** y el **precio** de un producto en WooCommerce, sin tocar `functions.php` y manteniendo buena compatibilidad con temas y actualizaciones.

* * *

# 1. Identificar qué está mostrando WooCommerce

WooCommerce utiliza estas clases estándar:

- **Título del producto en fichas/listados (archive/shop):**  
`.woocommerce-loop-product__title`

- **Precio del producto en fichas/listados:**  
`.price`

- **Título dentro de la página individual del producto:**  
`.product_title`

- **Precio dentro de la página individual:**  
`.summary .price`

Según su tema (posiblemente **Astra** , **Storefront** , **Blocksy** , **GeneratePress** , etc.) puede haber variaciones, pero estas clases funcionan en el 95% de los casos.

* * *

# 2. Dónde colocar el CSS (según sus preferencias)

Como usted **prefiere evitar modificar functions.php** , las mejores opciones son:

### Opción A: Apariencia → Personalizar → CSS adicional

(Seguro, persistente y fácil de editar.)

### Opción B: Usar un plugin de snippets de CSS

(por ejemplo: “Simple Custom CSS”, “Code Snippets” para CSS).

Las dos opciones son igual de válidas.

* * *

# 3. CSS para aumentar la fuente

## A) Listado de productos (Shop / Categorías / Archivo)

```auto
/* Título en las fichas de productos */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.4rem;
    font-weight: 700;
}

/* Precio en las fichas de productos */
.woocommerce ul.products li.product .price {
    font-size: 1.3rem;
}

```

Puede ajustar las medidas:

- `1.4rem` ≈ 22.4px

- `1.3rem` ≈ 20.8px

* * *

## B) Página individual de producto

```auto
/* Título dentro del producto */
.single-product .product_title {
    font-size: 2rem;
    font-weight: 700;
}

/* Precio dentro del producto */
.single-product .summary .price {
    font-size: 1.6rem;
}

```

* * *

# 4. Si su tema usa constructores o bloque de productos

Si su tienda usa bloques de WooCommerce (editor de bloques), podría necesitar este selector:

```auto
.wc-block-grid__product-title {
    font-size: 1.5rem;
}

.wc-block-grid__product-price {
    font-size: 1.4rem;
}

```

* * *

# 5. Ajustar solo un área específica

Si quiere aumentar solo en **shop** , pero no en categorías, o viceversa, también se puede segmentar por página utilizando:

```auto
body.post-type-archive-product .woocommerce-loop-product__title { ... }
body.tax-product_cat .woocommerce-loop-product__title { ... }

```