Create Hyperlink Button in Power Apps

While working with the Power Apps button hyperlink, sometimes we need to navigate different screens or websites using a button control. Whenever the user clicks or taps the button, it will navigate to the specific websites or screens.

In this Power Apps tutorial, I will explain how to create hyperlink button in Power Apps using different scenarios.

Create Hyperlink Button in Power Apps

Let me explain how to create the Power Apps button hyperlink in two ways. Such as:

  1. Power Apps Button Hyperlink Manually
  2. Power Apps Button Hyperlink from SharePoint List

NOTE:

Whenever you want to give hyperlink to the Power Apps button control, you can use the Power Apps Launch() function and provide a URL as a parameter.

1. Power Apps Button Hyperlink Manually

Let’s take a simple scenario.

In Power Apps, there is a Button control. I now want to add a hyperlink to the button control so that it can be clicked to go to the appropriate website.

Have a look at the below screenshot for the output:

create power apps hyperlink button

To work around this, follow the below-mentioned steps. Such as:

1. On the Power Apps Screen, insert a Button control and set its Text and OnSelect property to the code below:

Text = SpGuides.com

OnSelect = Launch("https://www.spguides.com/")

Where,

  • Launch() = The PowerApps Launch() function works the same way as hyperlinks. It allows you to launch web pages, apps, and other services on your device
  • “https://www.spguides.com/” = Respective Website URL
create a powerapps hyperlink button

2. Once your app is ready, Save, Publish, and Preview the app. Whenever the user clicks on the button control, it will navigate or redirect to the specific website based on the hyperlink address.

See also  How to Create Power Apps Quiz App?

This way, you can work with the Power Apps button hyperlink.

create powerapps hyperlink button

2. Power Apps Create a Hyperlink Button Using a SharePoint List

Next, we will see how to create a Power Apps button hyperlink from the SharePoint list with a simple scenario.

Scenario:

I have a SharePoint Online list named “Digital Platforms” and this list contains the below fields.

Refer to the below table:

Column NameData Type
Platform NameIt is a default single line of text
PlanChoice
PriceCurrency
Website URLHyperlink
powerapps button control hyperlink

In Power Apps, there is a Gallery control; inside this, I have added button control. The button control retrieves the SharePoint list hyperlink field values.

Whenever the user clicks on the specific button control, they are redirected to the respective digital platform, as shown in the screenshot below.

power apps button hyperlink

To achieve it, follow the below steps. Such as:

1. Connect it to the respective SharePoint Online list [Digital Platforms] to the Power Apps Canvas app.

power apps button control hyperlink

2. On the Power Apps Screen -> Insert a Blank Gallery control and set its Items property to the code below.

Items = 'Digital Platforms'

Where,

  • ‘Digital Platforms’ = SharePoint Online List
how to create powerapps hyperlink button

3. Now, add a Button control inside the gallery control and set its OnSelect property as:

OnSelect = Set(varURL, ThisItem.'Website URL');
Launch(varURL)

Where,

  • Set() = This Power Apps Set() function is used to set the global variable
  • varURL = Power Apps Global Variable Name
  • ThisItem.’Website URL’ = SharePoint List Hyperlink Column
how to create power apps hyperlink button

4. Save, Publish, and Preview the app. When the user clicks on a specific button, the app will redirect to the respective digital platform, as shown below.

powerapps button hyperlink

I hope you find this article helpful; this Power Apps tutorial explains in detail information about the Power Apps Button Hyperlink in two ways. Such as:

  1. Power Apps Button Hyperlink Manually
  2. Working with Power Apps Button Hyperlink from SharePoint List
See also  How to Create Empty Collection in Power Apps?

Moreover, you may like some more articles:

>