ここ最近初めてHubSpotを使い始めました。HTML,CSS,JSはわかりますがPythonは未学習です。
ボイラーテンプレートにあるblog-index.htmlをブログリストに適用しました。
14件ブログを投稿したのですがページネーションが表示されません。
該当のページを編集する画面ではモジュールとしてページネーションは表示されています。
任意の件数ごとにページネーションを表示させたいのですが、どうすればいいでしょうか？
@03967 さん、コミュニティーへの投稿ありがとうございます。
コンテンツ作成周りに詳しい皆さま、メンションさせてください： @assi @KMurota @yskz_aoyama
こちらのご質問にアドバイスできる点があればぜひお願いいたします🙏
他にも詳しい方がいらっしゃったら、ぜひアドバイスや提案コメントを残していただけると助かります！
@natsumimori コミュニティの詳しい方にメンションしてくださってありがとうございました！おかげさまで解決いたしました。
@03967
こちらが参考になるかと思います。
{% set posts_per_page = 11 %}
{% set total_posts = blog_recent_posts_count() %}
{% if page_query_param %}
{% set current_page = int(page_query_param) %}
{% else %}
{% set current_page = 1 %}
{% endif %}
{% set posts_offset = posts_per_page - 1 %}
{% set max_page = ceil((total_posts - posts_per_page) / posts_offset) + 1 %}
{% set blog_posts = blog_recent_posts(limit=posts_per_page, offset=(current_page - 1) * posts_offset) %}
{% if current_page == 1 %}
{% set blog_posts = blog_recent_posts(limit=posts_per_page) %}
{% else %}
{% set blog_posts = blog_recent_posts(limit=posts_offset, offset=(current_page - 2) * posts_offset + posts_per_page) %}
{% endif %}
`blog_recent_posts()` にlimitの他offsetのオプションがありますので、そちらでコントロールします。
@KMurota 返信ありがとうございます。HubSpotの設定から表示件数の設定をして解決しましたが、ページネーションを作成する際にこちらも参考にさせていただきます！
@03967 ボイラープレートを利用されているということであれば、恐らくページネーション部分はHubSpotが標準で用意しているページネーションモジュールを利用されていると思うので、いったん出力コードについては割愛します。
HubSpotが標準で用意しているページネーションの仕組みで重要なのが、ブログごとの一覧ページに表示する件数設定です。例えばこれが10となっていると、1ページに表示するブログ記事の件数を10件として、10件以上ある場合はページネーションが有効になります。
もしここの設定を確認しても変わらずページネーションが表示されない場合、一度ページネーションを表示させたい箇所にドキュメントにも掲載のある下記コードを差し込んでみてください！
{% if contents.total_page_count > 1 %}
<div class="blog-pagination">
{% set page_list = [-2, -1, 0, 1, 2] %}
{% if contents.total_page_count - current_page_num == 1 %}{% set offset = -1 %}
{% elif contents.total_page_count - current_page_num == 0 %}{% set offset = -2 %}
{% elif current_page_num == 2 %}{% set offset = 1 %}
{% elif current_page_num == 1 %}{% set offset = 2 %}
{% else %}{% set offset = 0 %}{% endif %}
<a class="blog-pagination__link blog-pagination__prev-link {{ "blog-pagination__prev-link--disabled" if !last_page_num }}" href="{{ blog_page_link(last_page_num) }}">
{% icon name="chevron-left" style="SOLID", width="13", no_wrapper=True %}
Prev
</a>
{% for page in page_list %}
{% set this_page = current_page_num + page + offset %}
{% if this_page > 0 and this_page <= contents.total_page_count %}
<a class="blog-pagination__link blog-pagination__number-link {{ "blog-pagination__link--active" if this_page == current_page_num }}" href="{{ blog_page_link(this_page) }}">{{ this_page }}</a>
{% endif %}
{% endfor %}
<a class="blog-pagination__link blog-pagination__next-link {{ "blog-pagination__next-link--disabled" if !next_page_num }}" href="{{ blog_page_link(current_page_num + 1) }}">
Next
{% icon name="chevron-right" style="SOLID", width="13", no_wrapper=True %}
</a>
</div>
{% endif %}
※ちなみにですが、HubSpotのフロントエンド開発では基本的にPythonは利用しませんので未学習で問題ありません
@assi 返信ありがとうございます。 教えていただいた方法で解決いたしました！丁寧に教えていただきありがとうございます。