Skip to content

Featured Recipes

Four article cards in a horizontal scroll on mobile that locks into a 4-column grid on desktop. Each card shows the article image, a category tag, the title, and a truncated excerpt (150 characters). Used for surfacing recipes, Fresh Press articles, or any blog content alongside the sections it relates to.

The section has a three-tier data priority: manual article pickers win, then a tag filter on a blog, then the four most recent articles from the blog. On product pages, the blog and tag can be connected via dynamic source from the product’s featured_articles metaobject, so each product surfaces its own curated set without any per-product setup.

Setting What it does
Section ID Optional anchor for jump links.
Blog Blog handle (e.g. recipes, fresh-press). Supports dynamic source.
Tag Full tag to filter by (e.g. product_nama-j2). Only used when no manual articles are set. Supports dynamic source.
Article 1–4 Manual article pickers. If any are set, tag and blog filtering are ignored entirely.
CTA label Button text for the “view all” link. Leave blank to hide the CTA.
CTA link (dynamic) Connect to a metaobject field via dynamic source. Overridden by CTA link if set.
CTA link URL picker. Takes priority over the dynamic link.
Category group The blog_category group name used for card tags (e.g. recipe_type, article_topic). Default recipe_type.
Tag prefix Tag prefix for card category labels (e.g. type_, topic_). Leave blank to auto-derive from the group name.
Padding top / bottom (mobile) Default 48px each.
Padding top / bottom (tablet) Default 64px each.
Padding top / bottom (desktop) Default 80px each.

Static blocks:

  • Tag — a small label above the title (e.g. “Recipes”)
  • Title — the section heading. Default style heading-md.

Product pages (blog and tag connected via nama.product_featured_recipes), homepage, and any page where blog content is relevant.

  • Manual pickers override everything. Setting even one manual article disables the tag filter and blog fallback completely.
  • Check the blog handle is correct. A typo produces an empty section with no error message — the section just renders nothing.
  • The CTA has two link fields because the URL picker can’t accept dynamic source. Use the dynamic field on PDP templates; use the URL picker everywhere else.