¿Cómo enviar datos de un formulario a Hubspot API Javascript?

recolectamos todos los datos del formulario

data = $( "form" ).serializeArray();
//o
data = [
    {
      "name": "email",
      "value": email@dominio.com
    },
...
];

preparamos los campos enviados y los ponemos en formato json

var json_value = {
                "fields": data,
                "skipValidation": false
            };

enviamos el total de los datos por ajax

$.ajax({
 url: 'https://api.hsforms.com/submissions/v3/integration/submit/id_cuenta_hs/id_formulario',
                type: 'post',
                dataType: 'json',
                contentType: 'application/json',
                data: JSON.stringify(json_value),
                success: function (resp) {
                    console.log(resp);
                },
            });

resultado

{
  "thankYouMessage": "Thanks!",
}

//o 

{
  "redirectUri": "https://domain.com/redirect",
}

En caso de error

{
  "status": "error",
  "message": “",
...
}

Hubspot paginación – múltiples formas

Forma 1 - default (Previous All posts Next)

<div class="blog-pagination">
  {% if last_page_num %}
    <a class="previous-posts-link" href="{{ blog_page_link(last_page_num) }}">Previous</a>
  {% endif %}
    <a class="all-posts-link" href="{{ blog_all_posts_url(group.id) }}">All posts</a>
  {% if next_page_num %}
     <a class="next-posts-link" href="{{ blog_page_link(next_page_num) }}">Next</a>
   {% endif %}
</div>

Forma 2 - mostrar todas las páginas numeradas ( < 1234567 >)

{% set total_pages = contents.total_page_count %} <!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %} <!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}
<nav>
  <ul class="pagination">
<li class="{% if current_page_num == 1 %}disabled{% endif %}"><a href="{% if last_page_num=="1" %}{{ group.absolute_url }}{% else %}{{blog_page_link(last_page_num)}}{% endif %}"><</a></li>
                        
{% if more_pages == 0 %}
    {% if current_page_num - 4 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 4 }}</a></li>{% endif %}
    {% if current_page_num - 4 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 4) }}">{{ current_page_num - 4 }}</a></li>{% endif %}
{% endif %}
{% if more_pages <= 1 %}
    {% if current_page_num - 3 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 3 }}</a></li>{% endif %}
    {% if current_page_num - 3 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 3) }}">{{ current_page_num - 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num - 2 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 2 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 2) }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 1 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 1 }}</a></li>{% endif %}
{% if current_page_num - 1 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 1) }}">{{ current_page_num - 1 }}</a></li>{% endif %}
<li class="active"><a href="{% if current_page_num==1 %}{{ group.absolute_url }}{% else %}{{ blog_page_link(current_page_num) }}{% endif %}">{{ current_page_num }}</a></li>
{% if current_page_num + 1 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 1) }}">{{ current_page_num + 1 }}</a></li>{% endif %}
{% if current_page_num + 2 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 2) }}">{{ current_page_num + 2 }}</a></li>{% endif %}
{% if current_page_num <= 2 %}
    {% if current_page_num + 3 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 3) }}">{{ current_page_num + 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num == 1 %}
    {% if current_page_num + 4 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 4) }}">{{ current_page_num + 4 }}</a></li>{% endif %}
{% endif %}
<li class="{% if current_page_num == total_pages %}disabled{% endif %}"><a href="{{blog_page_link(next_page_num)}}">></a></li>
</ul>
</nav>
{% endif %}

Forma 3 - mostrar solo 3 páginas numeradas ( < ... 123 ... >)

<div class="blog-pagination">
             
{% set total_pages = contents.total_page_count %} <!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %} <!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}
  <nav>
  <ul class="pagination">
 <li class="{% if current_page_num == 1 %}disabled{% endif %}"><a href="{% if last_page_num=="1" %}{{ group.absolute_url }}{% else %}{{blog_page_link(last_page_num)}}{% endif %}"><</a></li>
{# mostrar página numeradas #}
{% set num_pagination = [-2, -1, 0, 1, 2] %}
{% for num_pag in num_pagination %}
  {# mostrar ... si es que hay mas páginas antes #}
  {% if loop.first and current_page_num - 1 - ( (loop.length-1)//2 ) > 0 %}
  	<li class="first_more"><a href="{{ blog_page_link(current_page_num - 1 - ( (loop.length-1)//2 )) }}">...</a></li>
  {% endif %}
  {# mostrar num página anterior #}
  {% if loop.first and current_page_num - ( (loop.length-1)//2 ) > 0 %}
     <li class="first"><a href="{{ blog_page_link(current_page_num - ( (loop.length - 1)//2 )) }}">{{(current_page_num - ( (loop.length-1)//2 ))}}</a></li>
  {% endif %}
  {# mostrar num página #}
  {% if not loop.first and not loop.last and current_page_num + num_pag > 0 and current_page_num + num_pag <= total_pages %}
  	<li class="pag_num {% if current_page_num + num_pag == current_page_num  %}{{"active"}}{%endif%} "><a href="{{ blog_page_link(current_page_num + num_pag) }}">{{current_page_num + num_pag}}</a></li>
  {% endif %}
  {# mostrar num página siguiente #}
  {% if loop.last and (current_page_num + ( (loop.length-1)//2 )) <= total_pages %}
  	<li class="last"><a href="{{ blog_page_link(current_page_num + ( (loop.length-1)//2 )) }}">{{(current_page_num + ( (loop.length-1)//2 ))}}</a></li>
  {% endif %}
  {# mostrar ... si es que hay mas páginas despues #}
  {% if loop.last and current_page_num + 1 + ( (loop.length-1)//2 ) <= total_pages %}
  	<li class="last_more"><a href="{{ blog_page_link(current_page_num + 1 + ( (loop.length-1)//2 )) }}">...</a></li>
  {% endif %}	
{% endfor %}
  <li class="{% if current_page_num == total_pages %}disabled{% endif %}"><a href="{{blog_page_link(next_page_num)}}">></a></li>
  </ul>
</nav>
{% endif %} 
</div>

Hubspot – Modelo de blog

Modelo de blog, con validación para mostrar elementos en grilla de artículos.

{% for content in contents %} 
{% if loop.index<=1 %} 
<article class="article2">
    <div class="item" style="background-image: url({{ content.post_list_summary_featured_image }})">        
        <a href="{{content.absolute_url}}">
            <div class="content_image" style="background-image: url({{ content.post_list_summary_featured_image }});"></div>
        </a>
        <a href="{{content.absolute_url}}"><h3>{{ content.name }}</h3></a>
        <div>Por: {%if content.blog_post_author %}{{ content.blog_post_author.display_name }}{% endif %}</div>
<div class="date">{{ content.publish_date|datetimeformat('%b %e, %Y')|capitalize }}</div>
        <div>{% if content.topic_list %}{% for topic in content.topic_list %} {% if loop.index <=1 %} {{ topic.name }} {% endif %} {% endfor %} {% endif %}</div>

    </div>
</article>
{% endif %} 
{% if loop.index == 2 or loop.index == 3 or loop.index == 4 or loop.index == 5 or loop.index == 6 %}
<article class="article">
    <div class="item">
        <a href="{{content.absolute_url}}">
            <div class="">
                <img src="{{ content.post_list_summary_featured_image }}">
            </div>
        </a>
        <a href="{{content.absolute_url}}"><h3>{{ content.name }}</h3></a>
        <div>Por: {%if content.blog_post_author %}{{ content.blog_post_author.display_name }}{% endif %}</div>
        <div>{% if content.topic_list %}{% for topic in content.topic_list %} {% if loop.index <=1 %} {{ topic.name }} {% endif %} {% endfor %} {% endif %}</div>
    </div>
</article>
{% endif %} 
{% if loop.index == 6 %}
<article class="article">
    <a href=""><img src=""></a>
</article>
{% endif %} 

{% endfor %} 

{% if not simple_list_page %} 
{% set total_pages = contents.total_page_count %}
<!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %}
<!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}
<!--paginación-->
 {% if not simple_list_page %}
                {% set total_pages = contents.total_page_count %} <!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %} <!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}
<nav aria-label="Page navigation" id="nav_pagination">
<ul class="pagination">
{% if last_page_num %}
                    <li>
                      <a class="previous-posts-link" href="{{ blog_page_link(last_page_num) }}">
                        <span aria-hidden="true">&laquo; Anterior</span>
                      </a>
                    </li>
                {% endif %}
                    
                {% if next_page_num %}
                    <li>
                      <a class="next-posts-link" href="{{ blog_page_link(next_page_num) }}">
                        <span aria-hidden="true">Siguiente &raquo;</span>
                      </a>
                    </li>
                {% endif %}

{% endif %}
</ul>
</nav>
{% endif %}

Codificalo