How to change the Page title for Product and Collection pages to add the Site Name?

Summary:

The requirement is to add the Site Name to the Page title of the Product and Collection pages.

The product page title should be as below:

Product Name | Site Title

The collection page title should be as below:

Collection Name | Site Title

This can be done through the layout settings for Pages like Home, Checkout and Order Confirmation, etc... For more information refer to the documentation here. But how to achieve this for the Product and Collection pages?

Content (required):

Version (include the version you are using, if applicable):

22.3.1

Code Snippet (add any code snippets that support your topic, if applicable):