Search engine optimization
Search engine optimization (SEO) allows shoppers to find your site content more effectively through search engines. The React Store application supports SEO URLs that use keywords and metadata and can be managed by business users directly from the Management Center.
- The SEO URL and page metadata information that is available in the HCL Commerce database is used by ElasticSearch (full and delta) as a new document index. All category and product URLs are indexed into the ElasticSearch Index.
- The React SPA makes a REST service call to HCL Commerce which efficiently maps a URL request to the appropriate page and page metadata.
- SEO ingest and decomposition also supports any redirects due to URL modifications to objects. When a URL is modified, the new URL information is added to the SEO index and an additional document is generated to indicate a redirect of old URL to new URL.
- The SEO URL and page metadata are impacted by product and category data and store information such as name, description, and keywords. As such the SEO URL documents must be updated when SEO URL, product or category information is updated from the Management Center during delta indexing processes.
- Modifications to the store name.
- Modifications to a substitution template for page metadata.
- Expiry of redirects triggered by
dbclean
.
How are SEO pages handled?
When a React store URL is used in a browser, the React Router looks at the relative path and first compares it against the list of paths that are statically defined in the app. If no match is found, then a fallback handles any other URLs.
For the React Store application, most URL routing is handled directly by React Router, where a static relative path routes to a page component based on the mappings defined in src\configs\routes.ts. However, catalog browsing pages (category page, sub-category page, and product details page) have dynamic SEO relative paths. These paths and all other unknown paths are generically routed to the SEO component (src\_foundation\seo\SEO.tsx) which then determines the end component that is to be used.
The SEO component calls the urls
REST API to determine which page
component is to be used. The SEO relative path is passed as a parameter to the
urls
REST API. The API returns the page type and the page
meta-data. The SEO component then uses the page type to route to the proper page
component in order to display the page contents. For example, the page type
CategoryPage is routed to the page component
src\components\pages-seo\category.
The Reference Store application uses the Redux Saga library to call the
urls
REST API and uses Redux state management to store the
resulting page information. The logic to resolve a list of known page types to page
components is defined in the Redux reducer in the
src\redux\reducers\seo.ts folder. If the page type cannot
be determined, a generic Not Found component is used. The SEO
component is also responsible for injecting the metadata for a page based on the
data that is returned by the urls
REST API. The
urls
REST API also provides information about the catalog
object, such as category ID. This information is then forwarded to the resolved page
component to fetch the catalog object details for further processing and for
displaying the information about the catalog object.
For more information about Search engine optimization in HCL Commerce, see Search engine optimization (SEO).