Pré-renderização

​

Processo de pré-renderização

• Publicar uma edição no modelo de uma página
• Atualizando dados compartilhados, como algumas configurações do site
• Atualizando um módulo incluído em um modelo ou página

​

Verifique se uma página foi pré-renderizada

• ?hsDebugOnly=true: carregue a página com um parâmetro ?hsDebugOnly=true de consulta. Isso incluirá uma indicação se a página pode ser pré-renderizada. Se não puder ser pré-renderizado, uma lista de problemas que impedem a pré-renderização será exibida, juntamente com arquivos específicos e números de linhas de modelo. Se a formatação das informações de depuração for difícil de ler, você pode usar o parâmetro ?hsDebug=true em vez de. Ao inspecionar a página com esse parâmetro de consulta, as mesmas informações de depuração aparecerão em um comentário HTML formatado próximo ao final da página.

• X-HS-Prerendered: procure o cabeçalho X-HS-Prerendered nos cabeçalhos de resposta HTTP da solicitação de página. Este cabeçalho só estará presente se a página for pré-renderizada e incluirá o valor da última vez que a página foi pré-renderizada. Você pode encontrar essas informações inspecionando a página, clicando na guia de rede e observando os cabeçalhos de resposta da solicitação de página.

​

Recursos incompatíveis

​

Variáveis HubL incompatíveis

• account
• company
• contact
• local_dt
• owner
• request_contact
• request.cookies
• request.full_url
• request.headers
• request.path_and_query
• request.query
• request.query_dict
• request.referrer
• request.remote_ip

​

Funções HubL incompatíveis

• personalization_token()
• today()

​

Funcionalidades incompatíveis

• Páginas que usam testes adaptativos
• Páginas que incluem conteúdo inteligente são suportados via pré-renderização parcial.

​

Pré-renderização parcial

​

Verifique se há pré-renderização parcial

​

Variáveis HubL

• account
• company
• contact
• local_dt
• owner
• query
• request
• request_contact
• year

​

Filtros HubL

• |random
• |shuffle

​

Alternativas JavaScript para HubL incompatível

{% set hubspot_utk = request.cookies.hubspotutk %} {% if hubspot_utk %}
<div class="returning-visitor">
  <h2>Welcome back!</h2>
  <p>Thanks for returning. Here's what's new since your last visit:</p>
  <ul class="updates-list">
    <li>New product features launched</li>
    <li>Updated pricing plans</li>
  </ul>
</div>
{% else %}
<div class="new-visitor">
  <h2>Welcome to our site!</h2>
  <p>New here? Check out our Get Started guide:</p>
  <a href="" class="btn btn-primary">Get Started</a>
</div>
{% endif %}

    <div id="visitor-welcome">
    <div id="new-visitor-content">
    <h2>Welcome to our site!</h2>
    <p>New here? Start with our Get Started guide:</p>
    <a href="" class="btn btn-primary">Get Started</a>
  </div>

  <div id="returning-visitor-content" style="display: none;">
    <h2>Welcome back!</h2>
    <p>Thanks for returning. Here's what's new since your last visit:</p>
    <ul class="updates-list">
      <li>New product features launched</li>
      <li>Updated pricing plans</li>
    </ul>
  </div>
</div>

<script>
  function getCookie(name) {
    const value = `; ${document.cookie}`;
    const parts = value.split(`; ${name}=`);
    if (parts.length === 2) {
      return parts.pop().split(';').shift();
    }
    return null;
  }

  function personalizeForVisitor() {
    const hubspotUtk = getCookie('hubspotutk');
    const newVisitorContent = document.getElementById('new-visitor-content');
    const returningVisitorContent = document.getElementById('returning-visitor-content');

    if (hubspotUtk) {
      // Returning visitor
      newVisitorContent.style.display = 'none';
      returningVisitorContent.style.display = 'block';
    }
    // New visitor content is already visible by default
  }

  // Run immediately to minimize content flash
  personalizeForVisitor();
</script>

​

Recursos relacionados

• Otimizando o desempenho do site CMS Hub
• Usando frameworks e bibliotecas JavaScript na HubSpot