How do set the different URLs for each UI tab on the page?

Issue

• Using UI tabs functionality on one of the pages. There are multiple tabs like 3 tabs and while accessing each tab its URL is the same. How do set the different URLs for each UI tab on the page?

Environment

• Liferay DXP 7.2

Resolution

• In order to provide the URL either to the specific or each UI tabs, there is an attribute url. Like, URL to which all the tabs are linked when clicked or set each tab's URL individually using the url[number] attribute.
• Note: url0, url1, url2, and henceforth which is deprecated as of 7.0.0 and replaced by the attribute urls. Please go through the Tabs taglib docs for the full list of attributes and you can use it as per the business needs.
• Liferay UI Tabs and Sections, This official document has the example code snippet and procedures of the tabs describes how to organize content into individual sections. 

Additional Information

Please Note: Please choose to follow your appropriate discretion in the use of this information as these are not documented by Liferay. 

• Unofficial document:
  • https://proliferay.com/liferay-ui-tabs/
  • https://www.marconapolitano.it/en/liferay/14-let-s-use-liferay-tabs.html