This page explains the steps needed for the following scenarios:

...

As an example, let us consider modernizing the “Invitation Search“ page. The classic page is shown below.

Step 1: Generate the Rule and Template HTML code with Smart UX utility

...

In Template Generator page, provide the Component Name and Page Name of the page you wish to modernize, and then click on "Generate Rule & HTML". 

This will generate the Rule and Template HTML as shown below. Copy and Paste the Rule and Template HTML generated to a text file for later steps.

Note: Here, we use VSCode editor for creating/editing of html/cfg files.

...

Go the following path /smarterp/Solutions/ResponsiveTalentOnboarding/Invitation/InvitationSource.html and search with id "SM_OB_INV_WRK_LAST_NAME_SRCH". Delete the handlebar i.e  the snippet shown in below screen along with <div></div> tags and save the file . As long as "gulp" is running changes are moved to SVN.

...

When any Handlebar is changed:

We might make  make changes in handlebar usually when PeopleTools version gets changed.

...