> ## Documentation Index
> Fetch the complete documentation index at: https://help.kajabi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Agrega comentarios de Facebook con la plantilla heredada

> Habilita los comentarios de Facebook en entradas de blog creadas con la plantilla heredada Premier.

## Descripción general

Este artículo explica cómo agregar comentarios de Facebook a entradas de blog creadas con la plantilla heredada Premier. Si usas Kajabi Pages o Website Builder, consulta la [guía actualizada](../../website/pages/how-to-add-facebook-comments-to-your-page).

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/9bs2slimch" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

<Note>
  **Nota:** Para agregar comentarios de Facebook, necesitarás una cuenta Kajabi Pro para acceder al editor de código. Conoce los diferentes planes [aquí](https://kajabi.com/pricing/).
</Note>

## Paso 1. Obtén el código de comentarios de Facebook

Para agregar comentarios de Facebook a una entrada de blog, inicia sesión en tu cuenta de Facebook y sigue [este enlace](https://developers.facebook.com/docs/plugins/comments) para configurar y generar fragmentos de HTML para el complemento de comentarios de Facebook:

1. Copia y pega la URL de la página de blog en el campo URL del generador de código del complemento de comentarios.
2. Ingresa el número de entradas (o comentarios) a mostrar en la página.
3. Haz clic en **GET CODE**:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/5fz3kihhv8" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

<Tip>
  **Tip:** Mantén dos pestañas abiertas en tu navegador, una para tu blog de Kajabi y otra para el generador de código del complemento de comentarios de Facebook, para poder cambiar fácilmente entre ellas durante el proceso de agregar comentarios de Facebook a tu página.
</Tip>

## Paso 2. Abre el editor de código en Kajabi

Una vez generados los fragmentos de código, vuelve a Kajabi e ingresa al editor de código de la entrada de blog:

1. Abre la pestaña **Website** desde el Dashboard.
2. Selecciona **Pages**.
3. Ubica la plantilla de página **Blog Post**.
4. Haz clic en `…` en el extremo derecho y elige **Modify code**:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/gy6ucpx20i" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

## Paso 3. Pega el primer fragmento de código en Kajabi

Abre la carpeta `Layouts` en el editor de código:

1. Haz clic en el archivo `theme.liquid`.
2. Desplázate hasta la etiqueta `<body>` (generalmente cerca de la línea 70 en una plantilla recién instalada).
3. Copia el primer fragmento de código del generador del complemento de comentarios.
4. Pega el fragmento una línea debajo de la etiqueta `<body>`.
5. Haz clic en **Save**:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/kfqmet65oi" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

## Paso 4. Pega el segundo fragmento de código

Abre la carpeta `Templates` en el editor de código:

1. Haz clic en el archivo `blog_post.liquid`.
2. Ubica la etiqueta `{% section "blog_post_body" %}` (generalmente cerca de la línea 5 en una plantilla recién instalada).
3. Copia el segundo fragmento de código del generador del complemento de comentarios.
4. Pega el segundo fragmento de código una línea debajo de `{% section "blog_post_body" %}`:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/zbnk4xzb7k" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

## Paso 5. Configura el segundo fragmento de código

Finalmente, para que tus comentarios de Facebook funcionen completamente en todas tus entradas de blog:

1. Reemplaza la URL del sitio dentro de las comillas en el segundo fragmento de código con este texto exacto: `#####{{canonical_url}}`

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/uc9ps8ig74" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

Por ejemplo, si el segundo fragmento de código comenzaba así:

`<div class="fb-comments" data-href="https://help.kajabi.com/blog/getting-to-know-the-how-tos"data-numposts="3" data-width=""></div>`

Se cambiaría para que se vea así:

`<div class="fb-comments" data-href="#####{{canonical_url}}" data-numposts="3" data-width=""></div>`

Haz clic en **Save** y previsualiza tus entradas de blog para ver los comentarios de Facebook cerca de la parte inferior de la página.
