orionplace-react 0.7.2 → 0.7.4

package/README.md

@@ -513,6 +513,9 @@ server render. Public product, article and tariff details load through the
 maintained API client. Page metadata uses those returned records and follows
 client navigation and language selection. Home-page event clicks open enrollment
 for the returned event, preserving its return path through sign-in.
+Pages with a canonical address also link the same page in the other storefront languages (`hreflang`) and set `og:type` and `og:locale`; a journal article adds its publication date (`article:published_time`) and schema.org `BlogPosting` data. The store icon (`logos.ico`) is the page's `<link rel="icon">`. An unknown `?locale` opens the default language.
+
+List pages (journal, categories, stores) link their previous and next pages as real links (`?page=2`). Each later page has its own canonical address and a title with its page number; a journal page past the last one answers 404.
 
 `StorefrontShell` mounts the header, route content and footer after Application
 Load succeeds. If initialization fails, it shows `StorefrontErrorPage`; Retry

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orionplace-react",
-  "version": "0.7.2",
+  "version": "0.7.4",
   "description": "Next.js 16 storefront for your Orionplace marketplace: setup CLI, server API gateway, typed store and ready-made catalog, cart, checkout and account components in English and Russian, plus an Android app build.",
   "type": "module",
   "license": "MIT",

package/templates/app/_storefront/AppRoutes.tsx

@@ -32,6 +32,7 @@ import {
 } from '@/lib/orionplace/navigation';
 import { requestProductPage } from '@/lib/orionplace/productPage';
 import {
+  requestJournalPage,
   requestPromoProducts,
   requestPublication,
   requestTariffs,
@@ -121,6 +122,7 @@ export function AppRoutes() {
       publication: (id) => requestPublication(api, id),
       tariffs: (id) => requestTariffs(api, id),
       promoProducts: (id, page) => requestPromoProducts(api, id, page),
+      journalPage: (page, pageSize) => requestJournalPage(api, page, pageSize),
     }).then((route) => {
       if (!current) {
         return;

package/templates/app/_storefront/StorefrontPageMetadata.tsx

@@ -69,6 +69,49 @@ export function StorefrontPageMetadata(records: StorefrontPageRecords) {
         element.content = '';
       }
     }
+    // Canonical and hreflang links follow the address too (a later list
+    // page has its own). The server's links belong to Next.js, so they are
+    // updated in place; only links added here are ever removed.
+    const wanted   = new Map(
+      head.links.map((link) => [
+        'hreflang' in link ? `alternate:${link.hreflang}` : 'canonical',
+        link.href,
+      ]),
+    );
+    // Next.js's own links first, so they take the address and a copy
+    // added here earlier is the one removed.
+    const links    = [
+      ...document.head.querySelectorAll<HTMLLinkElement>(
+        'link[rel="canonical"], link[rel="alternate"][hreflang]',
+      ),
+    ].sort(
+      (left, right) =>
+        Number(Boolean(left.dataset.orionplaceLink)) -
+        Number(Boolean(right.dataset.orionplaceLink)),
+    );
+    for (const element of links) {
+      const key  = element.rel === 'canonical'
+        ? 'canonical'
+        : `alternate:${element.hreflang}`;
+      const href = wanted.get(key);
+      if (href) {
+        element.href = href;
+        wanted.delete(key);
+      } else if (element.dataset.orionplaceLink) {
+        element.remove();
+      }
+    }
+    for (const [key, href] of wanted) {
+      const element                  = document.createElement('link');
+      const [rel, hreflang]          = key.split(':');
+      element.rel                    = rel;
+      element.href                   = href;
+      element.dataset.orionplaceLink = key;
+      if (hreflang) {
+        element.hreflang = hreflang;
+      }
+      document.head.append(element);
+    }
   }, [pathname, query, locale, init, product, post, tariff, promo, search, errorKind]);
   return null;
 }

package/templates/app/_storefront/storefrontRoutes.tsx

@@ -49,6 +49,7 @@ import type { IUserAddressListResponse } from '@/interfaces/orionplace/address/I
 import type { StorefrontCartData } from '@/lib/orionplace/cartController';
 import type { requestProductPage } from '@/lib/orionplace/productPage';
 import type {
+  requestJournalPage,
   requestPromoProducts,
   requestPublication,
   requestTariffs,
@@ -57,8 +58,7 @@ import type { TicketSubjectContext } from '@/lib/orionplace/ticketRequests';
 import {
   blogPageNumber,
   blogPageSize,
-  blogPostsRequest,
-  type BlogPostsPage,
+  journalPagePastEnd,
 } from '@/lib/orionplace/blogJournal';
 import { blogViewType } from '@/lib/orionplace/blogPresentation';
 import { catalogBranchIds, findCatalogCategory } from '@/lib/orionplace/catalog';
@@ -113,6 +113,8 @@ export interface StorefrontRouteContext {
   tariffs: (id: number) => ReturnType<typeof requestTariffs>;
   /** The promotion page's products; the server shares it with the page title. */
   promoProducts: (id: number, page: number) => ReturnType<typeof requestPromoProducts>;
+  /** One journal list page; the server shares it with the page metadata. */
+  journalPage: (page: number, pageSize: number) => ReturnType<typeof requestJournalPage>;
 }
 
 export type StorefrontRouteResult =
@@ -314,14 +316,16 @@ const routes: Record<string, Loader> = {
     );
     let initial;
     try {
-      const data = await (await context.api()).request<BlogPostsPage>(
-        'blog_posts_get',
-        blogPostsRequest({}, page, pageSize),
-      );
+      const data = await context.journalPage(page, pageSize);
       initial    = { page, pageSize, data };
     } catch {
       initial = undefined;
     }
+    // A page number past the last page has no articles: 404, so search
+    // engines drop it instead of indexing an empty list.
+    if (journalPagePastEnd(page, initial)) {
+      return { notFound: true };
+    }
     return {
       page: (
         <JournalPage

package/templates/app/layout.tsx

@@ -25,7 +25,7 @@ export default async function RootLayout({
   // Bootstrap precedes page rendering. Failures stay in the store for the interface to handle.
   const { result, failure } = await getOrionplaceAppLoad();
   const language            = await getOrionplaceServerLocale();
-  const { tags }            = await getStorefrontMetadataContext();
+  const { tags, jsonLd }    = await getStorefrontMetadataContext();
   return (
     <html lang={language}>
       <head>
@@ -44,6 +44,13 @@ export default async function RootLayout({
             />
           ),
         )}
+        {jsonLd ? (
+          <script
+            type="application/ld+json"
+            // Escaped by structuredDataJson, so the text cannot close the tag.
+            dangerouslySetInnerHTML={{ __html: jsonLd }}
+          />
+        ) : null}
       </head>
       <body>
         <OrionplaceProvider

package/templates/components/orionplace/blog/StorefrontJournal.tsx

@@ -350,6 +350,7 @@ export function StorefrontJournal({
             pagination={pagination}
             pending={pending}
             scrollTarget={results.current}
+            linked
             onChange={changePage}
           />
         </div>

package/templates/components/orionplace/search/ProductSearchResults.module.css

@@ -276,9 +276,12 @@
   border-top: 1px solid var(--orionplace-border);
 }
 
-/* Page buttons have a light frame that darkens on hover or focus, as in Nuxt. */
+/* Page buttons have a light frame that darkens on hover or focus, as in Nuxt.
+   Previous and next are links while that page exists. */
 .pagination .button {
   border-color: var(--orionplace-border);
+  font-family: inherit;
+  text-decoration: none;
 }
 
 .pagination .button:focus-visible {

package/templates/components/orionplace/search/ProductSearchResults.tsx

@@ -4,7 +4,9 @@ import {
   useEffect,
   useRef,
   useState,
+  type MouseEvent,
 } from 'react';
+import { usePathname, useSearchParams } from 'next/navigation';
 import {
   useOrionplaceBrowse,
   useOrionplaceSelections,
@@ -15,6 +17,7 @@ import type {
   ProductFacetSelection,
 } from '@/interfaces/orionplace/products/IProductSearchFacets';
 import { hasSearchFilters } from '@/lib/orionplace/searchFilters';
+import { storefrontPageHref } from '@/lib/orionplace/pageSeo';
 import { browseLabels } from '@/lib/orionplace/browseLabels';
 import { useOrionplaceStableHeight } from '@/hooks/useOrionplaceStableHeight';
 import {
@@ -81,6 +84,32 @@ export function ProductSearchResults({
   const storedFilters = useOrionplaceBrowse((state) => state.searchFilters);
   const locale = useOrionplaceSelections((state) => state.localeCode);
   const labels = browseLabels(locale);
+  // Every list of this component keeps its page in the address (`?page=`),
+  // so previous and next are links search engines follow; a click changes
+  // the page in place.
+  const pathname     = usePathname() ?? '/';
+  const search       = useSearchParams()?.toString() ?? '';
+  const previousHref = !pending && page > 1
+    ? storefrontPageHref(pathname, search, page - 1)
+    : undefined;
+  const nextHref     = !pending && !failed && hasNext
+    ? storefrontPageHref(pathname, search, page + 1)
+    : undefined;
+
+  // A link opened in a new tab or window keeps its default.
+  function followPage(event: MouseEvent<HTMLAnchorElement>, value: number) {
+    if (
+      event.button !== 0 ||
+      event.metaKey ||
+      event.ctrlKey ||
+      event.shiftKey ||
+      event.altKey
+    ) {
+      return;
+    }
+    event.preventDefault();
+    onChangePage?.(value);
+  }
   const facets = suppliedFacets === undefined ? storedFacets : suppliedFacets;
   const filters = suppliedFilters ?? storedFilters;
   const ids = productIds.length
@@ -278,26 +307,48 @@ export function ProductSearchResults({
                 className={styles.pagination}
                 data-search-pagination
               >
-                <button
-                  type="button"
-                  className={styles.button}
-                  disabled={pending || page === 1}
-                  onClick={() => onChangePage?.(page - 1)}
-                >
-                  <span><span aria-hidden="true">←</span> {labels.previous}</span>
-                </button>
+                {previousHref ? (
+                  <a
+                    className={styles.button}
+                    href={previousHref}
+                    rel="prev"
+                    onClick={(event) => followPage(event, page - 1)}
+                  >
+                    <span><span aria-hidden="true">←</span> {labels.previous}</span>
+                  </a>
+                ) : (
+                  <button
+                    type="button"
+                    className={styles.button}
+                    disabled={pending || page === 1}
+                    onClick={() => onChangePage?.(page - 1)}
+                  >
+                    <span><span aria-hidden="true">←</span> {labels.previous}</span>
+                  </button>
+                )}
                 <span>
                   {labels.page} {page}
                   {pages ? ` ${labels.of} ${pages}` : ''}
                 </span>
-                <button
-                  type="button"
-                  className={styles.button}
-                  disabled={pending || failed || !hasNext}
-                  onClick={() => onChangePage?.(page + 1)}
-                >
-                  <span>{labels.next} <span aria-hidden="true">→</span></span>
-                </button>
+                {nextHref ? (
+                  <a
+                    className={styles.button}
+                    href={nextHref}
+                    rel="next"
+                    onClick={(event) => followPage(event, page + 1)}
+                  >
+                    <span>{labels.next} <span aria-hidden="true">→</span></span>
+                  </a>
+                ) : (
+                  <button
+                    type="button"
+                    className={styles.button}
+                    disabled={pending || failed || !hasNext}
+                    onClick={() => onChangePage?.(page + 1)}
+                  >
+                    <span>{labels.next} <span aria-hidden="true">→</span></span>
+                  </button>
+                )}
               </nav>
             ) : null}
           </div>

package/templates/components/orionplace/shared/StorefrontPagination.README.md

@@ -7,7 +7,9 @@ an available page calls `onChange(page)` and moves the list into view.
 `scrollTarget` identifies the list by element or CSS selector; `null` keeps
 the current scroll position. Without a target, the nearest section, article
 or main container is used. `pending` disables both actions. `compact` shows
-arrow buttons with accessible names.
+arrow buttons with accessible names. With `linked`, Previous and Next are
+links to the list's `?page=` addresses, so search engines reach every page;
+a click still changes the page in place.
 
 ### Props
 
@@ -18,6 +20,7 @@ arrow buttons with accessible names.
 | `pending?: boolean`                     | Shows the loading state and blocks duplicate actions.                                    |
 | `scrollTarget?: PaginationScrollTarget` | Element or selector used as the pagination scroll destination.                           |
 | `compact?: boolean`                     | Uses the compact component presentation.                                                 |
+| `linked?: boolean`                      | Previous and Next become links to the list's `?page=` addresses (lists that keep their page in the address). |
 
 ## Русский
 
@@ -26,7 +29,9 @@ arrow buttons with accessible names.
 к списку. `scrollTarget` задаёт элемент списка или CSS-селектор; `null`
 оставляет прокрутку на месте. Без этого параметра используется ближайший
 контейнер section, article или main. `pending` блокирует кнопки. `compact`
-показывает стрелки с доступными названиями.
+показывает стрелки с доступными названиями. С `linked` «Назад» и «Далее» —
+ссылки на адреса списка с `?page=`, поэтому поисковые системы доходят до
+каждой страницы; по клику страница по-прежнему меняется на месте.
 
 ### Свойства
 
@@ -37,3 +42,4 @@ arrow buttons with accessible names.
 | `pending?: boolean`                     | Показывает загрузку и блокирует повторные действия.                                              |
 | `scrollTarget?: PaginationScrollTarget` | Элемент или селектор для прокрутки после смены страницы.                                         |
 | `compact?: boolean`                     | Включает компактное представление компонента.                                                    |
+| `linked?: boolean`                      | «Назад» и «Далее» становятся ссылками на адреса списка с `?page=` (для списков, хранящих страницу в адресе). |

package/templates/components/orionplace/shared/StorefrontPagination.tsx

@@ -1,8 +1,10 @@
 'use client';
 
-import { useRef } from 'react';
+import { useRef, type MouseEvent, type ReactNode } from 'react';
+import { usePathname, useSearchParams } from 'next/navigation';
 import { useOrionplaceSelections } from '@/providers/OrionplaceProvider';
 import { scrollToPaginatedList } from '@/lib/orionplace/paginationScroll';
+import { storefrontPageHref } from '@/lib/orionplace/pageSeo';
 import type { IApiPagination } from '@/interfaces/orionplace/accounts/IProfileData';
 import type { PaginationScrollTarget } from '@/lib/orionplace/paginationScroll';
 import styles from './StorefrontPagination.module.css';
@@ -13,6 +15,12 @@ export interface StorefrontPaginationProps {
   pending?: boolean;
   scrollTarget?: PaginationScrollTarget;
   compact?: boolean;
+  /**
+   * The list keeps its page number in the address (`?page=`): previous and
+   * next are links to those addresses, so search engines reach every page.
+   * A click still changes the page in place.
+   */
+  linked?: boolean;
 }
 
 export function StorefrontPagination({
@@ -21,7 +29,10 @@ export function StorefrontPagination({
   pending = false,
   scrollTarget,
   compact = false,
+  linked = false,
 }: StorefrontPaginationProps) {
+  const pathname   = usePathname() ?? '/';
+  const search     = useSearchParams()?.toString() ?? '';
   const localeCode = useOrionplaceSelections((state) => state.localeCode);
   const labels = localeCode.toLowerCase().startsWith('ru')
     ? { page: 'Страница', previous: 'Назад', next: 'Далее' }
@@ -38,6 +49,61 @@ export function StorefrontPagination({
     scrollToPaginatedList(nav.current, scrollTarget);
   }
 
+  const previousPage = pagination.previous_page_number || page - 1;
+  const nextPage     = typeof pagination.next_page_number === 'number'
+    ? pagination.next_page_number
+    : page + 1;
+
+  // A link while that page exists (linked lists), else a button.
+  function control(
+    target: number,
+    available: boolean,
+    rel: 'prev' | 'next',
+    label: string,
+    content: ReactNode,
+  ) {
+    const common = {
+      className: styles.button,
+      'aria-label': compact ? label : undefined,
+      title: compact ? label : undefined,
+    };
+    if (linked && available && !pending) {
+      return (
+        <a
+          {...common}
+          href={storefrontPageHref(pathname, search, target)}
+          rel={rel}
+          onClick={(event: MouseEvent<HTMLAnchorElement>) => {
+            // A link opened in a new tab or window keeps its default.
+            if (
+              event.button !== 0 ||
+              event.metaKey ||
+              event.ctrlKey ||
+              event.shiftKey ||
+              event.altKey
+            ) {
+              return;
+            }
+            event.preventDefault();
+            change(target);
+          }}
+        >
+          {content}
+        </a>
+      );
+    }
+    return (
+      <button
+        {...common}
+        type="button"
+        disabled={pending || !available}
+        onClick={() => change(target)}
+      >
+        {content}
+      </button>
+    );
+  }
+
   return (
     <nav
       ref={nav}
@@ -45,15 +111,12 @@ export function StorefrontPagination({
       className={`${styles.root} ${compact ? styles.compact : ''}`.trim()}
       data-feature-part="StorefrontPagination"
     >
-      <button
-        className={styles.button}
-        type="button"
-        aria-label={compact ? labels.previous : undefined}
-        title={compact ? labels.previous : undefined}
-        disabled={pending || !pagination.has_previous}
-        onClick={() => change(pagination.previous_page_number || page - 1)}
-      >
-        {compact ? (
+      {control(
+        previousPage,
+        Boolean(pagination.has_previous),
+        'prev',
+        labels.previous,
+        compact ? (
           <svg
             viewBox="0 0 24 24"
             fill="none"
@@ -65,25 +128,18 @@ export function StorefrontPagination({
           >
             <path d="m15 5-7 7 7 7" />
           </svg>
-        ) : labels.previous}
-      </button>
+        ) : labels.previous,
+      )}
       <span className={styles.count}>
         {labels.page} {page}
         {pagination.pages ? ` / ${pagination.pages}` : ''}
       </span>
-      <button
-        className={styles.button}
-        type="button"
-        aria-label={compact ? labels.next : undefined}
-        title={compact ? labels.next : undefined}
-        disabled={pending || !pagination.has_next}
-        onClick={() => change(
-          typeof pagination.next_page_number === 'number'
-            ? pagination.next_page_number
-            : page + 1,
-        )}
-      >
-        {compact ? (
+      {control(
+        nextPage,
+        Boolean(pagination.has_next),
+        'next',
+        labels.next,
+        compact ? (
           <svg
             viewBox="0 0 24 24"
             fill="none"
@@ -95,8 +151,8 @@ export function StorefrontPagination({
           >
             <path d="m9 5 7 7-7 7" />
           </svg>
-        ) : labels.next}
-      </button>
+        ) : labels.next,
+      )}
     </nav>
   );
 }

package/templates/components/orionplace/stores/StorefrontStores.tsx

@@ -389,6 +389,7 @@ export function StorefrontStores({
       <StorefrontPagination
         pagination={pagination}
         pending={pending || disabled}
+        linked={!storeId}
         onChange={changePage}
       />
     </section>

package/templates/lib/orionplace/appLoadClient.ts

@@ -1,5 +1,6 @@
 import {
   AppLoadError,
+  appLoadRejectedLocale,
   appLoadResult,
   inspectAppLoad,
 } from '@/lib/orionplace/appLoadResult';
@@ -68,6 +69,10 @@ export async function requestBrowserAppLoad(
     });
   }
   const failure     = inspectAppLoad(body, status);
+  // A language the storefront does not have opens its default language.
+  if (failure && locale && appLoadRejectedLocale(failure)) {
+    return requestBrowserAppLoad(signal);
+  }
   if (failure) {
     throw new AppLoadError('Marketplace initialization failed.', failure);
   }

package/templates/lib/orionplace/appLoadResult.ts

@@ -108,3 +108,13 @@ export class AppLoadError extends Error {
     this.data = data;
   }
 }
+
+/**
+ * Whether App Load refused the request's language (`?lang=` of a language the
+ * storefront does not have): the backend answers it with field errors and
+ * HTTP 452. The language is the only client value App Load reads, so the
+ * storefront loads again without it.
+ */
+export function appLoadRejectedLocale(failure: AppLoadFailure): boolean {
+  return failure.kind === 'validation' || failure.httpStatus === 452;
+}

package/templates/lib/orionplace/appLoadServer.ts

@@ -1,7 +1,11 @@
 import { cache } from 'react';
 import { headers } from 'next/headers';
 import { forwardMarketplace } from '@orionplace-runtime/marketplace.mjs';
-import { appLoadResult, inspectAppLoad } from '@/lib/orionplace/appLoadResult';
+import {
+  appLoadRejectedLocale,
+  appLoadResult,
+  inspectAppLoad,
+} from '@/lib/orionplace/appLoadResult';
 import type {
   AppLoadFailure,
   AppLoadRequest,
@@ -49,7 +53,11 @@ function handoffs(): Map<string, Promise<ServerAppLoad>> {
   return scope[HANDOFF_KEY];
 }
 
-function buildRequest(incoming: Headers, signal: AbortSignal): Request {
+function buildRequest(
+  incoming: Headers,
+  signal: AbortSignal,
+  withLocale = true,
+): Request {
   const host     =
     incoming.get('x-forwarded-host') || incoming.get('host') || 'localhost';
   const protocol =
@@ -59,7 +67,7 @@ function buildRequest(incoming: Headers, signal: AbortSignal): Request {
     incoming.get('x-orionplace-page-url') || '/',
     url.origin,
   );
-  const locale   = pageUrl.searchParams.get('locale');
+  const locale   = withLocale ? pageUrl.searchParams.get('locale') : null;
   if (locale) {
     url.searchParams.set('lang', locale);
   }
@@ -92,12 +100,16 @@ function buildRequest(incoming: Headers, signal: AbortSignal): Request {
 export async function requestAppLoad(
   signal?: AbortSignal,
   incoming?: Headers,
+  withLocale = true,
 ): Promise<ServerAppLoad> {
   const timeout     = AbortSignal.timeout(35_000);
   const combined    = signal ? AbortSignal.any([signal, timeout]) : timeout;
   let response: Response;
+  let source: Headers;
+  let request: Request;
   try {
-    const request = buildRequest(incoming ?? new Headers(await headers()), combined);
+    source        = incoming ?? new Headers(await headers());
+    request       = buildRequest(source, combined, withLocale);
     response      = await forwardMarketplace(request, {
       mimicFrontDomain: process.env.MIMIC_FRONT_DOMAIN ?? '',
     });
@@ -116,6 +128,15 @@ export async function requestAppLoad(
     body = null;
   }
   const failure     = inspectAppLoad(body, response.status);
+  // An address with a language the storefront does not have (`?locale=xx`)
+  // opens in the storefront's default language instead of the 503 page.
+  if (
+    failure &&
+    new URL(request.url).searchParams.has('lang') &&
+    appLoadRejectedLocale(failure)
+  ) {
+    return requestAppLoad(signal, source, false);
+  }
   if (failure) {
     return { result: null, failure, cookies };
   }

package/templates/lib/orionplace/blogJournal.ts

@@ -113,3 +113,16 @@ export function mergeBlogPagination(
     ),
   };
 }
+
+/**
+ * Whether a journal page number lies past the last page: the server render
+ * loaded that page (no filters) and it has no articles. Page 1 of an empty
+ * journal is a page of its own.
+ */
+export function journalPagePastEnd(
+  page: number,
+  loaded: BlogJournalPage | null | undefined,
+): boolean {
+  const posts = loaded?.data?.posts?.data;
+  return page > 1 && loaded?.page === page && Array.isArray(posts) && !posts.length;
+}

package/templates/lib/orionplace/pageMetadata.ts

@@ -14,10 +14,18 @@ import type { IPromoDefinition } from '@/interfaces/orionplace/cart/ICartData';
 import { promoName } from '@/lib/orionplace/promoPresentation';
 import {
   storefrontAbsoluteUrl,
+  storefrontAlternateLinks,
+  storefrontArticleData,
   storefrontCanonicalUrl,
+  storefrontIconLinks,
+  storefrontIsoDate,
+  storefrontOpenGraphLocale,
+  storefrontOpenGraphType,
   storefrontPageMetadata,
+  storefrontPagedText,
   type StorefrontSeoPage,
 } from '@/lib/orionplace/pageSeo';
+import { structuredDataJson } from '@/lib/orionplace/productStructuredData';
 import { getStorefrontSeo } from '@/lib/orionplace/seo';
 import { findCatalogCategory } from '@/lib/orionplace/catalog';
 import { blogPostCover } from '@/lib/orionplace/blogPresentation';
@@ -127,6 +135,8 @@ export function storefrontMetadata(
   }
   const values: MetadataValues = {};
   let image: string | undefined;
+  let published: string | undefined;
+  let modified: string | undefined;
   const tags: MetaTags         = [];
   let robots: string | undefined;
   // A private product link (`key`) stays out of search results, loaded or not.
@@ -201,6 +211,9 @@ export function storefrontMetadata(
       ),
     ).slice(0, 160);
     image              = blogPostCover(records.post);
+    published          = storefrontIsoDate(records.post.date_created?.date);
+    modified           =
+      storefrontIsoDate(records.post.date_updated?.date) ?? published;
   } else if (page === 'tariff' && records.tariff) {
     const tariff       = records.tariff;
     const field        = <Key extends keyof ISubscribeTariffLocales>(name: Key) =>
@@ -216,7 +229,7 @@ export function storefrontMetadata(
     // The offer's name, as the other packages title this page.
     values.title       = promoName(records.promo, locale);
   }
-  const content                = storefrontPageMetadata(page, locale, values);
+  const listContent            = storefrontPageMetadata(page, locale, values);
   // Link previews load only complete image addresses; the canonical address
   // is the sitemap's one for this page.
   image                        = storefrontAbsoluteUrl(image, origin);
@@ -227,17 +240,77 @@ export function storefrontMetadata(
     locale,
     robots,
   );
+  // A later list page (`?page=2`) names its page number.
+  const content                = {
+    ...listContent,
+    title: storefrontPagedText(listContent.title, canonical, locale) ?? listContent.title,
+    description: storefrontPagedText(listContent.description, canonical, locale) ?? listContent.description,
+  };
+  // The home page may carry the admin's own og:type (tags, rendered as is).
+  const ogType                 = tags.some(
+    (tag) => 'property' in tag && tag.property === 'og:type',
+  )
+    ? undefined
+    : storefrontOpenGraphType(page);
+  const ogLocale               = storefrontOpenGraphLocale(locale);
+  // The page in the storefront's other languages, beside the canonical one.
+  const languages              = Object.fromEntries(
+    storefrontAlternateLinks(canonical, Object.keys(init?.locale ?? {})).map(
+      (alternate) => [alternate.hreflang, alternate.href],
+    ),
+  );
+  const icon                   = storefrontIconLinks(init?.logos?.ico)[0]?.href;
+  // Next.js has no og:type "product"; that page gets it as a plain tag below.
+  const openGraph              = ogType === 'article'
+    ? {
+        type: 'article' as const,
+        ...(published ? { publishedTime: published } : {}),
+        ...(modified ? { modifiedTime: modified } : {}),
+      }
+    : ogType === 'website'
+      ? { type: 'website' as const }
+      : {};
   const metadata: Metadata     = {
     ...content,
     ...(robots ? { robots } : {}),
-    ...(canonical ? { alternates: { canonical } } : {}),
+    ...(canonical
+      ? {
+          alternates: {
+            canonical,
+            ...(Object.keys(languages).length ? { languages } : {}),
+          },
+        }
+      : {}),
+    ...(icon ? { icons: { icon } } : {}),
     openGraph: {
+      ...openGraph,
       title: content.title,
       description: content.description,
+      ...(ogLocale ? { locale: ogLocale } : {}),
       ...(canonical ? { url: canonical } : {}),
       ...(image ? { images: [image] } : {}),
     },
   };
+  if (ogType === 'product') {
+    tags.unshift({ property: 'og:type', content: 'product' });
+  }
+  // A journal article as schema.org BlogPosting, with the store as its author.
+  const jsonLd                 =
+    page === 'publication' && records.post && canonical && origin
+      ? structuredDataJson(
+          storefrontArticleData({
+            canonical,
+            origin,
+            headline: content.title,
+            description: content.description,
+            image,
+            published,
+            modified,
+            locale,
+            storeName: init?.contact?.company_name,
+          }),
+        )
+      : '';
   const headTags               = new Map<
     string,
     { name?: string; property?: string; content: string }
@@ -250,9 +323,13 @@ export function storefrontMetadata(
     'og:description': content.description,
     'og:image': image,
     'og:url': canonical,
+    'og:type': ogType,
+    'og:locale': ogLocale,
+    'article:published_time': ogType === 'article' ? published : undefined,
+    'article:modified_time': ogType === 'article' ? modified : undefined,
   })) {
     headTags.set(name, {
-      ...(name.startsWith('og:') ? { property: name } : { name }),
+      ...(/^(?:og|article):/.test(name) ? { property: name } : { name }),
       content: value ?? '',
     });
   }
@@ -263,6 +340,22 @@ export function storefrontMetadata(
   return {
     metadata,
     tags,
-    head: { title: content.title, meta: [...headTags.values()] },
+    jsonLd,
+    head: {
+      title: content.title,
+      meta: [...headTags.values()],
+      // The canonical address and its other languages, for the browser's
+      // head after an in-page change (a list page, a language).
+      links: canonical
+        ? [
+            { rel: 'canonical', href: canonical },
+            ...Object.entries(languages).map(([hreflang, href]) => ({
+              rel: 'alternate',
+              hreflang,
+              href,
+            })),
+          ]
+        : [],
+    },
   };
 }

package/templates/lib/orionplace/pageSeo.ts

@@ -263,17 +263,157 @@ const pageCopy = {
       'error, store',
     ],
   },
+  es: {
+    tariffs: [
+      'Planes de suscripción',
+      'Precios por periodo, periodos de prueba y opciones de cada plan.',
+      'planes, suscripciones, prueba',
+    ],
+    tariff: [
+      'Plan de suscripción',
+      'Descripción, funciones, periodos y opciones de un plan de suscripción.',
+      'plan, suscripción, periodo',
+    ],
+    subscriptions: [
+      'Mis suscripciones',
+      'Fechas de las suscripciones y renovación automática.',
+      'suscripciones, cuenta',
+    ],
+    sellers: ['Vendedores', 'Vendedores y sus productos.', 'vendedores, productos'],
+    stores: [
+      'Tiendas',
+      'Direcciones, contactos y horarios de las tiendas.',
+      'tiendas, direcciones',
+    ],
+    catalog: ['Catálogo', 'Categorías de productos de la tienda.', 'catálogo, categorías'],
+    activity: [
+      'Mi actividad',
+      'Códigos promocionales, reseñas e historial de accesos del cliente.',
+      'cuenta, códigos promocionales, reseñas, accesos',
+    ],
+    promo: [
+      'Productos del código promocional',
+      'Productos de la tienda a los que se aplica la oferta del código promocional.',
+      'código promocional, oferta, productos',
+    ],
+    wishlist: [
+      'Favoritos',
+      'Productos guardados y avisos de disponibilidad.',
+      'favoritos, productos',
+    ],
+    contact: [
+      'Contacto',
+      'Datos de contacto de la empresa y formulario de mensajes de la tienda.',
+      'contacto, mensaje',
+    ],
+    privacy: [
+      'Política de privacidad',
+      'Qué datos recibe la tienda, para qué, a quién los transmite y qué cookies usa el sitio.',
+      'datos personales, privacidad, cookies',
+    ],
+    unsubscribe: [
+      'Preferencias de correo',
+      'Darse de baja de los correos de la tienda.',
+      'correos, baja',
+    ],
+    tickets: [
+      'Soporte',
+      'Conversaciones del usuario con el soporte.',
+      'soporte, conversaciones',
+    ],
+    orders: [
+      'Mis pedidos',
+      'Historial de pedidos y artículos comprados.',
+      'pedidos, compras',
+    ],
+    cart: ['Carrito', 'Artículos y pago del pedido.', 'carrito, pago'],
+    addresses: [
+      'Mis direcciones',
+      'Direcciones de entrega guardadas.',
+      'direcciones, entrega',
+    ],
+    wallet: [
+      'Monedero y pagos',
+      'Saldo e historial de pagos.',
+      'monedero, pagos',
+    ],
+    home: [
+      'Tienda',
+      'Categorías y productos de la tienda.',
+      'tienda, catálogo, productos',
+    ],
+    browse: [
+      'Resultados de búsqueda',
+      'Productos que coinciden con la búsqueda y los filtros elegidos.',
+      'búsqueda de productos, filtros, catálogo',
+    ],
+    featured: [
+      'Destacados',
+      'Productos de las categorías que el cliente ha buscado en la tienda.',
+      'recomendaciones, productos, filtros',
+    ],
+    category: [
+      'Categoría de productos',
+      'Productos y filtros disponibles de la categoría elegida.',
+      'categoría, productos, filtros',
+    ],
+    journal: [
+      'Revista',
+      'Publicaciones de la tienda con títulos, resúmenes y tiempo de lectura.',
+      'revista, publicaciones, artículos',
+    ],
+    publication: [
+      'Publicación de la revista',
+      'Un artículo de la revista de la tienda.',
+      'revista, publicación, artículo',
+    ],
+    product: [
+      'Ficha de producto',
+      'Descripción, precio, variantes y disponibilidad del producto.',
+      'producto, precio, disponibilidad',
+    ],
+    manufacturers: [
+      'Fabricantes',
+      'Fabricantes de la tienda con logotipos e índice alfabético.',
+      'fabricantes, marcas, índice alfabético',
+    ],
+    profile: [
+      'Perfil personal',
+      'Datos personales, correo, notificaciones y contraseña de la cuenta.',
+      'perfil, cuenta, ajustes',
+    ],
+    logout: [
+      'Cerrar sesión',
+      'Fin de la sesión y vuelta a la página principal.',
+      'cuenta, cerrar sesión, sesión',
+    ],
+    notFound: [
+      'Página no encontrada',
+      'No hay ninguna página de la tienda en esta dirección.',
+      'página no encontrada, 404',
+    ],
+    error: [
+      'Algo salió mal',
+      'No se pudo mostrar la página de la tienda.',
+      'error, tienda',
+    ],
+  },
 } as const;
 
 export type StorefrontSeoPage = keyof typeof pageCopy.en;
 
+/** The page copy for a storefront language; languages without one use English. */
+function storefrontCopyLanguage(locale: string): keyof typeof pageCopy {
+  const language = locale.toLowerCase().split(/[-_]/)[0];
+  return language === 'ru' || language === 'es' ? language : 'en';
+}
+
 export function storefrontPageMetadata(
   page: StorefrontSeoPage,
   locale: string,
   values: { title?: string; description?: string; keywords?: string } = {},
 ) {
-  const copy  =
-    pageCopy[locale.toLowerCase().startsWith('ru') ? 'ru' : 'en'][page];
+  const copy  = pageCopy[storefrontCopyLanguage(locale)][page];
   const title = plainText(values.title ?? '') || copy[0];
 
   return {
@@ -320,11 +460,15 @@ export function storefrontAbsoluteUrl(
 // The pages the sitemap lists (runtime/marketplace.mjs), plus plan pages.
 const indexedPage = /^\/(?:|catalog|journal|tariffs|manufacturers|sellers|stores|contact|privacy|(?:category|product|journal)\/\d+|tariffs\/[^/]+\/\d+)$/;
 
+// Listed pages that are lists with page numbers (`?page=2`).
+const pagedList   = /^\/(?:journal|stores|category\/\d+)$/;
+
 /**
  * The canonical address of a page: the sitemap's address for it, the page in
- * the language it shows (`?locale=`). Pages that are not listed, pages with
- * other query parameters (filters, page numbers, private keys) and noindex
- * pages get none.
+ * the language it shows (`?locale=`). A later page of a list is a page of its
+ * own (`?locale=en&page=2`, Google's pagination guide), linked from the
+ * list's page links. Pages that are not listed, pages with other query
+ * parameters (filters, private keys) and noindex pages get none.
  */
 export function storefrontCanonicalUrl(
   origin: string,
@@ -333,9 +477,13 @@ export function storefrontCanonicalUrl(
   locale: string,
   robots?: string,
 ): string | undefined {
-  const path  = pathname.replace(/\/+$/, '') || '/';
-  const query = new URLSearchParams(search);
+  const path       = pathname.replace(/\/+$/, '') || '/';
+  const query      = new URLSearchParams(search);
+  const pageNumber = query.get('page');
   query.delete('locale');
+  if (pageNumber !== null && pagedList.test(path) && /^[1-9]\d{0,5}$/.test(pageNumber)) {
+    query.delete('page');
+  }
   if (
     !origin ||
     /noindex/i.test(robots ?? '') ||
@@ -344,9 +492,171 @@ export function storefrontCanonicalUrl(
   ) {
     return undefined;
   }
-  const url   = new URL(path, `${origin}/`);
+  const url        = new URL(path, `${origin}/`);
   if (locale) {
     url.searchParams.set('locale', locale);
   }
+  if (pageNumber && Number(pageNumber) > 1 && pagedList.test(path)) {
+    url.searchParams.set('page', pageNumber);
+  }
   return url.toString();
 }
+
+/**
+ * A later page of a list repeats the list's title and description; the page
+ * number keeps them distinct (search engines report repeated titles as
+ * duplicates). The number comes from the canonical address, so only the
+ * indexed list pages get it.
+ */
+export function storefrontPagedText(
+  text: string | undefined,
+  canonical: string | undefined,
+  locale: string,
+): string | undefined {
+  const page = canonical ? Number(new URL(canonical).searchParams.get('page')) : 0;
+  if (!text || !(page > 1)) {
+    return text;
+  }
+  const words: Record<string, string> = { ru: 'страница', es: 'página' };
+  const word                          = words[storefrontCopyLanguage(locale)] ?? 'page';
+  return `${text} · ${word} ${page}`;
+}
+
+/**
+ * The address of another page of the list on screen: the current address
+ * with `page=` set (left out for page 1), every other parameter kept. Page
+ * links are real links, so search engines reach every page of a list.
+ */
+export function storefrontPageHref(
+  pathname: string,
+  search: string,
+  page: number,
+): string {
+  const query = new URLSearchParams(search);
+  if (page > 1) {
+    query.set('page', String(page));
+  } else {
+    query.delete('page');
+  }
+  const text  = query.toString();
+  return `${pathname}${text ? `?${text}` : ''}`;
+}
+
+/** og:type of a page: a product and a journal article have their own kinds. */
+export function storefrontOpenGraphType(
+  page: StorefrontSeoPage,
+): 'product' | 'article' | 'website' {
+  if (page === 'product') {
+    return 'product';
+  }
+  return page === 'publication' ? 'article' : 'website';
+}
+
+const openGraphRegions: Record<string, string> = {
+  de: 'de_DE',
+  en: 'en_US',
+  es: 'es_ES',
+  fr: 'fr_FR',
+  it: 'it_IT',
+  kk: 'kk_KZ',
+  pl: 'pl_PL',
+  pt: 'pt_PT',
+  ru: 'ru_RU',
+  tr: 'tr_TR',
+  uk: 'uk_UA',
+  zh: 'zh_CN',
+};
+
+/** og:locale (`language_TERRITORY`) of a storefront language, when it is known. */
+export function storefrontOpenGraphLocale(locale: string): string | undefined {
+  return openGraphRegions[locale.toLowerCase().split(/[-_]/)[0]!];
+}
+
+/**
+ * The same page in every storefront language (hreflang), for a page with a
+ * canonical address: the canonical address with each language's `?locale=`,
+ * as the sitemap lists them. Search engines that ignore the sitemap's
+ * language links (Yandex) read these. A single language gives none.
+ */
+export function storefrontAlternateLinks(
+  canonical: string | undefined,
+  locales: string[],
+): { hreflang: string; href: string }[] {
+  const codes = [
+    ...new Set(
+      locales
+        .map((code) => code.trim())
+        .filter((code) => /^[a-z]{2,3}(?:-[a-z0-9]{2,8})*$/i.test(code)),
+    ),
+  ];
+  if (!canonical || codes.length < 2) {
+    return [];
+  }
+  return codes.map((code) => {
+    const url = new URL(canonical);
+    url.searchParams.set('locale', code);
+    return { hreflang: code, href: url.toString() };
+  });
+}
+
+/**
+ * A backend date (`d.m.Y`, e.g. `22.09.2026`) as an ISO 8601 date
+ * (`2026-09-22`); anything else gives `undefined`. A date without a time
+ * cannot disagree with the visible date in another time zone.
+ */
+export function storefrontIsoDate(
+  value: string | null | undefined,
+): string | undefined {
+  const match = /^(\d{2})\.(\d{2})\.(\d{4})$/.exec((value ?? '').trim());
+  return match ? `${match[3]}-${match[2]}-${match[1]}` : undefined;
+}
+
+/**
+ * schema.org BlogPosting of a journal article (Google "Article" structured
+ * data): headline, cover, dates, and the store as author and publisher.
+ */
+export function storefrontArticleData(input: {
+  canonical: string;
+  origin: string;
+  headline: string;
+  description?: string;
+  image?: string;
+  published?: string;
+  modified?: string;
+  locale: string;
+  storeName?: string;
+}): Record<string, unknown> {
+  const store = {
+    '@type': 'Organization',
+    name: input.storeName || new URL(input.origin).hostname,
+    url: `${input.origin}/`,
+  };
+  const modified = input.modified || input.published;
+  return {
+    '@context': 'https://schema.org',
+    '@type': 'BlogPosting',
+    '@id': `${input.canonical}#article`,
+    mainEntityOfPage: input.canonical,
+    url: input.canonical,
+    headline: input.headline.slice(0, 110),
+    ...(input.description ? { description: input.description } : {}),
+    ...(input.image ? { image: [input.image] } : {}),
+    ...(input.published ? { datePublished: input.published } : {}),
+    ...(modified ? { dateModified: modified } : {}),
+    inLanguage: input.locale,
+    author: store,
+    publisher: store,
+  };
+}
+
+/**
+ * The store's icon (App Load `logos.ico`) as `<link rel="icon">` tags: search
+ * engines read the icon from the home page. Only a complete http(s) address
+ * is used; the type is left out, so it cannot disagree with the file.
+ */
+export function storefrontIconLinks(
+  icon: string | null | undefined,
+): { key: string; rel: 'icon'; href: string }[] {
+  const href = storefrontAbsoluteUrl(icon, '');
+  return href ? [{ key: 'icon', rel: 'icon', href }] : [];
+}

package/templates/lib/orionplace/serverRecords.ts

@@ -2,6 +2,7 @@ import { cache } from 'react';
 import { getOrionplaceServerApi } from '@/lib/orionplace/serverApi';
 import { requestProductPage } from '@/lib/orionplace/productPage';
 import {
+  requestJournalPage,
   requestPromoProducts,
   requestPublication,
   requestTariffs,
@@ -16,6 +17,11 @@ export const getStorefrontPublication   = cache(async (id: number) =>
   requestPublication(await getOrionplaceServerApi(), id),
 );
 
+// One journal list page (no filters), shared by the page and its metadata.
+export const getStorefrontJournalPage  = cache(async (page: number, pageSize: number) =>
+  requestJournalPage(await getOrionplaceServerApi(), page, pageSize),
+);
+
 export const getStorefrontTariffs       = cache(async (id: number) =>
   requestTariffs(await getOrionplaceServerApi(), id),
 );

package/templates/lib/orionplace/serverRoute.tsx

@@ -8,6 +8,7 @@ import {
   getStorefrontRequestUrl,
 } from '@/lib/orionplace/serverLocale';
 import {
+  getStorefrontJournalPage,
   getStorefrontProduct,
   getStorefrontPromoProducts,
   getStorefrontPublication,
@@ -46,6 +47,7 @@ export async function renderStorefrontRoute(
     publication: getStorefrontPublication,
     tariffs: getStorefrontTariffs,
     promoProducts: getStorefrontPromoProducts,
+    journalPage: getStorefrontJournalPage,
   });
   if ('redirect' in result) {
     redirect(result.redirect);

package/templates/lib/orionplace/storefrontRecords.ts

@@ -1,8 +1,21 @@
 import type { OrionplaceApi } from '@/lib/orionplace/api';
+import { blogPostsRequest, type BlogPostsPage } from '@/lib/orionplace/blogJournal';
 import type { IBlogPostsResponse } from '@/interfaces/orionplace/blog/IBlogApi';
 import type { ISubscriptionTariffsResponse } from '@/interfaces/orionplace/subscribes/ISubscriptionApi';
 import type { IProductSearchResponse } from '@/interfaces/orionplace/products/IProductSearchApi';
 
+/** One page of the journal list, without filters. */
+export function requestJournalPage(
+  api: OrionplaceApi,
+  page: number,
+  pageSize: number,
+) {
+  return api.request<BlogPostsPage>(
+    'blog_posts_get',
+    blogPostsRequest({}, page, pageSize),
+  );
+}
+
 /** One journal publication, or undefined when the storefront has none with this id. */
 export async function requestPublication(api: OrionplaceApi, id: number) {
   const data = await api.request<NonNullable<IBlogPostsResponse['page_data']>>(