Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents


This page explains the steps that needs to be followed when working on the following scenarios:

...

This will generate the Rule and Template HTML as shown below.




Note: Here, VSCode editor is used for creating/editing of html/cfg files.

Step 2 : Create a new rule generated by the utility with page name mapped in the related cfg file.

...

"/smarterp/Solutions/ResponsiveTalentOnboarding/pages/Invitation/" is the path where the file name 'InvitationSource.html' is created.

...

Step to create a new HTML file in the the editor (VSCode):

Right click on 'Invitation' folder, select 'New File' and enter the html file name with '.html' extension.

Here, the file is named as 'InvitationSource.html'.



Image Added


Path where the HTML file is created


...

Place the HTML content generated by the utility in 'InvitationSource.html' file. In the generated HTML content, make changes like adding css (if required) and bootstrap to make it mobile responsive.




Step 3:

After the new file is saved or any changes made to existing html file, to make the changes reflect in PIA, navigate to <Instance> UX project folders using command prompt and check if 'gulp' command is running.


Image Added




Step 4: Run admincmd=reloadrules

Whenever any changes are made to cfg file, run admincmd=reloadrules. Append “admincmd=reloadrules” to end of URL and run it.

...

When the following page opens, click on “Reload Configuration”.




The final output of the modern page will be as given below:Final Output ((Ignore the styles you see in runtime page at top of page, it is not present in classic and made it appear on only Modern page for good layout with help of CSS.)




Scenario 2: Mapping a new field to an already existing html page when it is added in classic page

...

The final output of the MUI page looks like below:




Note: The following step is applicable only when changes are made in the handlebar

Navigate to <Instance> UX project folders using command prompt and run 'gulp prepare_dist' command.

This command recompiles all the HTML files wherever that particular handlebar is used. After the command is run, it may take some time to compile all the files.


Image Added