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

# Criar uma listagem de posts de blog relacionados com a tag de posts de blog relacionados do HubL

> A tag related_blog_posts do HubL pode ser usada para criar uma listagem dinâmica de posts de blog relacionados com base em uma variedade de parâmetros. Ela permite gerar listagens de posts de blog, com a capacidade de filtrar por tags, autores, caminhos de posts e datas de publicação.

A tag [related\_blog\_posts](/cms/reference/hubl/tags/standard-tags#blog-related-posts) do HubL pode ser usada para criar uma listagem dinâmica de posts de blog relacionados com base em uma variedade de parâmetros. Ela permite gerar listagens de posts de blog, com a capacidade de filtrar por tags, autores, caminhos de posts e datas de publicação. Os desenvolvedores também podem especificar a saída HTML do módulo usando uma macro. Esta tag do HubL pode ser usada em posts de blog e páginas. Este tutorial mostrará os parâmetros e opções de uso para a tag de posts de blog relacionados do HubL.

<Info>
  Observe que a tag `related_blog_posts` do HubL não gera um módulo editável em nível de post/página; ela é totalmente configurada com HubL.
</Info>

## Parâmetros

A lista de posts é gerada a partir de uma pontuação de relevância com base em uma comparação entre os valores dos parâmetros definidos e os posts correspondentes a esses parâmetros ou relacionados ao post na qual a tag do HubL é exibida. Nenhum dos parâmetros é obrigatório; no entanto, especificá-los permitirá controlar ainda mais quais posts são retornados. Para parâmetros separados por vírgula, quanto mais valores você definir, mais diversificada será a listagem retornada. O parâmetro `post_formatter` permite especificar uma [macro](/cms/reference/hubl/variables-macros-syntax#macros) para gerar a saída HTML do módulo. Para obter uma lista completa dos parâmetros e exemplos da saída HTML padrão, consulte a especificação de [related\_blog\_posts](/cms/reference/hubl/tags/standard-tags#blog-related-posts).

| Parameter            | Type                 | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | Default |
| -------------------- | -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| `limit`              | number               | O número máximo de posts de blog para listar.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `3`     |
| `blog_ids`           | 'default' or blog id | O ID do blog do qual incluir os posts.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `none`  |
| `tags`               | String               | As tags que devem ser usadas para determinar se um post é relevante (separadas por vírgula). Se um post de blog tiver uma dessas tags ou uma tag semelhante, a relevância dele será aumentada, melhorando sua classificação na listagem.                                                                                                                                                                                                                                                                                                                                                 | `none`  |
| `blog_authors`       | String               | Os nomes dos autores dos quais incluir os posts(separados por vírgula)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `none`  |
| `blog_post_ids`      | String               | O ID de post de blog para usar ao encontrar posts de blog relevantes para listar (separadas por vírgula). Este parâmetro somente deve ser usado quando o widget for exibido nas páginas, pois nos posts de blog, o padrão será o post no qual o widget é exibido.                                                                                                                                                                                                                                                                                                                        | `none`  |
| `post_formatter`     | String               | O nome de uma macro personalizada para renderizar os posts de blog retornados. A macro recebe três parâmetros que são o objeto de post de blog para formatar, a contagem na iteração de posts de blog e a contagem total de posts de blog nos resultados. Se não for especificado ou definido como "padrão", o formatador interno será usado para formatar cada post.<br /><br />**Nota: é recomendado usar o parâmetro callback abaixo no lugar do parâmetro "post\_formatter", pois o HTML da tag será renderizado mais rapidamente, diminuindo os tempos de carregamento de página.** | `none`  |
| `callback`           | String               | O nome de uma função javascript para renderizar os posts de blog retornados. A função recebe um array de objetos de post de blog para formatar. Se os parâmetros callback ou post\_formatter forem especificados, a tag gerará HTML em um formato padrão.                                                                                                                                                                                                                                                                                                                                | `none`  |
| `path_prefixes`      | String               | Caminhos de URL ou subdiretórios dos quais incluir os posts (separados por vírgula). Se um post de blog tiver um prefixo semelhante em seu caminho, a relevância dele será aumentada, melhorando sua classificação na listagem.                                                                                                                                                                                                                                                                                                                                                          | `none`  |
| `start_date`         | date/time            | Permite a filtragem de posts publicados após uma data/hora.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | `none`  |
| `end_date`           | Date/Time            | Permite a filtragem de posts publicados antes de uma data/hora.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `False` |
| `blog_post_override` | String               | Os Ids de um post de blog que sempre devem ser exibidos na listagem retornada, apesar de todos os outros valores de parâmetros e filtros (separados por vírgula).                                                                                                                                                                                                                                                                                                                                                                                                                        | `none`  |

<Warning>
  Recomendamos fortemente o uso do parâmetro `callback` em vez do parâmetro `post_formatter` para garantir tempos de carregamento de página mais rápidos.
</Warning>

<Info>
  Observe que, se a tag `related_blog_posts` do HubL for usada em um post, o parâmetro `blog_post_ids` não deverá ser especificado, pois nos posts do blog, o padrão será o post no qual o widget é exibido.
</Info>

## Exemplos de usos da tag related\_blog\_posts do hubL

Abaixo estão alguns exemplos de maneiras de usar essa tag para aprimorar seu site.

### Exibir os posts de um autor específico em vários blogs

Neste exemplo, geramos uma lista de posts escritos por um dos três `blog_authors` especificados em dois blogs diferentes.

```hubl theme={null}
{% related_blog_posts blog_ids="3241539189,3261083894", limit=6, blog_authors="John Smith,Joe Smith,Frank Smith" %}
```

### Exibir posts com a tag "sales enablement", restritos a um intervalo de datas de publicação específico

Neste exemplo, geramos uma lista de 10 posts relacionados a um post de blog específico, com a tag "sales enablement" e restritos a um intervalo de datas de publicação específico. Este exemplo especifica o parâmetro `blog_post_ids`, então ele seria usado em uma página.

```hubl theme={null}
{% related_blog_posts blog_post_ids="3267910554", limit=10, tags="sales enablement", start_date="2018-02-05", end_date="2018-06-10" %}
```

### Exibir posts usando um retorno de chamada JS para controlar a saída HTML

Neste exemplo, geramos uma listagem de 5 posts usando o parâmetro `callback` para controlar a saída HTML da listagem de posts. (Em vez do parâmetro `post_formatter` usando uma [macro](/cms/reference/hubl/variables-macros-syntax#macros).)

```hubl theme={null}
{% related_blog_posts limit=5, callback="blog_post_formatter" %}

<script>
  var blog_post_formatter = function(blogposts) {

    var formatted = "<div>";
    for (var i = 0; i < blogposts.length; i++) {
      var blogpost = blogposts[i];
      formatted += '<div class="related-blog-item">';
      formatted += `<span>Related Post ${i + 1}/${blogposts.length}</span><br>`;
      formatted += `<a class="related-blog-title" href="https://br.developers.hubspot.com/docs${blogpost.url}"><span>${blogpost.name}</span></a>`;
      formatted += `<div class="hs-related-blog-byline">by <span class="related-blog-author">${blogpost.blogAuthor.fullName}</span><span class="related-blog-posted-at"> posted on </span><span class="related-blog-date">${new Date(blogpost.publishDate).toLocaleDateString()}</span></div>`;
      formatted += `<p class="related-blog-post-summary">${blogpost.postSummary}<a href="https://br.developers.hubspot.com/docs${blogpost.url}">Read more</a></p>`;
      formatted += '<div class="related-blog-tags">';
      if (blogpost.tagList.length > 0) {
        formatted += `Tags: ${blogpost.tagList.map(tag => tag.label).join(", ")}`;
      }
      formatted += '</div>';

      if (blogpost.featuredImage) {
        formatted += `<img src="${blogpost.featuredImage}" alt="${blogpost.featuredImageAltText}">`;
      }
      formatted += '</div>';
    }
    formatted += '</div>';
    return formatted;
  }
</script>
```