<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Hyperlink within expression of pop-up in AGOL in ArcGIS Online Questions</title>
    <link>https://community.esri.com/t5/arcgis-online-questions/hyperlink-within-expression-of-pop-up-in-agol/m-p/602678#M30101</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Hello,&lt;/P&gt;&lt;P&gt;We have a scenario where we want one of the results in the pop-up to show up as a hyperlink, but only if it hits a certain domain in that layer. If you see the screenshot below, you'll notice "Fiber Service Available." This layer has an expression set up to display different messages depending on the domain. We want a hyperlink here but only if fiber is available. We don't want the message to be a hyperlink if it is different from "Fiber Service Available". I attempted to insert HTML code to create a url into the expression arcade window but I got an 'invalid token' message. This suggests to me that HTML and Arcade don't go together (correct me if I'm wrong). Another thing that complicates this is that the HTML window (for the custom attribute display)&amp;nbsp;is already set up to display the icon&amp;nbsp;&lt;IMG class="image-3 jive-image" src="https://community.esri.com/legacyfs/online/441781_pastedImage_3.png" /&gt; next to the message. Is there a way that I can modify my expression to generate a hyperlink if "Fiber Service is Available" but to not have a hyperlink if any other message displays?&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-1 jive-image" src="https://community.esri.com/legacyfs/online/441779_pastedImage_1.png" /&gt;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-2 jive-image" src="https://community.esri.com/legacyfs/online/441780_pastedImage_2.png" /&gt;&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Wed, 10 Apr 2019 22:13:05 GMT</pubDate>
    <dc:creator>AdamBakiera</dc:creator>
    <dc:date>2019-04-10T22:13:05Z</dc:date>
    <item>
      <title>Hyperlink within expression of pop-up in AGOL</title>
      <link>https://community.esri.com/t5/arcgis-online-questions/hyperlink-within-expression-of-pop-up-in-agol/m-p/602678#M30101</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Hello,&lt;/P&gt;&lt;P&gt;We have a scenario where we want one of the results in the pop-up to show up as a hyperlink, but only if it hits a certain domain in that layer. If you see the screenshot below, you'll notice "Fiber Service Available." This layer has an expression set up to display different messages depending on the domain. We want a hyperlink here but only if fiber is available. We don't want the message to be a hyperlink if it is different from "Fiber Service Available". I attempted to insert HTML code to create a url into the expression arcade window but I got an 'invalid token' message. This suggests to me that HTML and Arcade don't go together (correct me if I'm wrong). Another thing that complicates this is that the HTML window (for the custom attribute display)&amp;nbsp;is already set up to display the icon&amp;nbsp;&lt;IMG class="image-3 jive-image" src="https://community.esri.com/legacyfs/online/441781_pastedImage_3.png" /&gt; next to the message. Is there a way that I can modify my expression to generate a hyperlink if "Fiber Service is Available" but to not have a hyperlink if any other message displays?&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-1 jive-image" src="https://community.esri.com/legacyfs/online/441779_pastedImage_1.png" /&gt;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-2 jive-image" src="https://community.esri.com/legacyfs/online/441780_pastedImage_2.png" /&gt;&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Wed, 10 Apr 2019 22:13:05 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-online-questions/hyperlink-within-expression-of-pop-up-in-agol/m-p/602678#M30101</guid>
      <dc:creator>AdamBakiera</dc:creator>
      <dc:date>2019-04-10T22:13:05Z</dc:date>
    </item>
    <item>
      <title>Re: Hyperlink within expression of pop-up in AGOL</title>
      <link>https://community.esri.com/t5/arcgis-online-questions/hyperlink-within-expression-of-pop-up-in-agol/m-p/602679#M30102</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;Hi&amp;nbsp;&lt;A href="https://community.esri.com/migrated-users/330374" target="_blank"&gt;Adam Bakiera&lt;/A&gt;&amp;nbsp;,&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I know that this question is a bit old, but I wanted to share how you could solve this.&lt;/P&gt;&lt;P&gt;There are many ways to create&amp;nbsp;a nice pop-up and show or hide content according to values in the attribute table.&lt;/P&gt;&lt;P&gt;This is a simplified result of what I did including just two services, but the same can be used to include all the services:&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-1 jive-image" height="211" src="https://community.esri.com/legacyfs/online/448659_pastedImage_2.png" width="267" /&gt;&amp;nbsp;&lt;IMG class="image-2 jive-image" height="208" src="https://community.esri.com/legacyfs/online/448660_pastedImage_3.png" width="264" /&gt;&lt;/P&gt;&lt;P&gt;&lt;IMG class="image-3 jive-image" height="210" src="https://community.esri.com/legacyfs/online/448667_pastedImage_4.png" width="266" /&gt;&amp;nbsp;&amp;nbsp;&lt;IMG class="jive-image image-4" height="207" src="https://community.esri.com/legacyfs/online/448668_pastedImage_5.png" width="261" /&gt;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;To obtain this result, you will need 3 expressions per service and create the html for the pop-up like this:&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;img&lt;/SPAN&gt; &lt;SPAN class="attr-name token"&gt;src&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="punctuation token"&gt;=&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;{expression/expr0}&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;/&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt; {expression/expr1} &lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;a&lt;/SPAN&gt; &lt;SPAN class="attr-name token"&gt;href&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="punctuation token"&gt;=&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;https://www.gvec.net/internet-plans/sign-up/&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="style-attr language-css token"&gt;&lt;SPAN class="attr-name token"&gt; &lt;SPAN class="attr-name token"&gt;style&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;="&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="selector token"&gt;display:&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;expression/expr2&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt; (&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;b&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;sign-up&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;/&lt;/SPAN&gt;b&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;)&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;/&lt;/SPAN&gt;a&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;
&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;br&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;/&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;br&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;/&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;
&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;img&lt;/SPAN&gt; &lt;SPAN class="attr-name token"&gt;src&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="punctuation token"&gt;=&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;{expression/expr3}&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;/&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt; {expression/expr4} &lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;a&lt;/SPAN&gt; &lt;SPAN class="attr-name token"&gt;href&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="punctuation token"&gt;=&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;https://www.gvec.net/internet-plans/sign-up/&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="style-attr language-css token"&gt;&lt;SPAN class="attr-name token"&gt; &lt;SPAN class="attr-name token"&gt;style&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;="&lt;/SPAN&gt;&lt;SPAN class="attr-value token"&gt;&lt;SPAN class="selector token"&gt;display:&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;expression/expr5&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;"&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt; (&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;&lt;/SPAN&gt;b&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;sign-up&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;/&lt;/SPAN&gt;b&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;)&lt;SPAN class="token tag"&gt;&lt;SPAN class="token tag"&gt;&lt;SPAN class="punctuation token"&gt;&amp;lt;/&lt;/SPAN&gt;a&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;&amp;gt;&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The first expression per service is to choose the image to use. I used the original image and a grey scale version to indicate the availability of the service. The expression looks like this and will be used to indicate the source of the image (I used some pasted image in a draft document on GeoNet):&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="keyword token"&gt;var&lt;/SPAN&gt; base_url &lt;SPAN class="operator token"&gt;=&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"https://community.esri.com/servlet/JiveServlet/showImage/"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="keyword token"&gt;var&lt;/SPAN&gt; imgs_fiber &lt;SPAN class="operator token"&gt;=&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="string token"&gt;"102-13494-2-448650/pastedImage_1.png"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;,&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"102-13494-1-448633/pastedImage_1.png"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="keyword token"&gt;if&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;(&lt;/SPAN&gt;$feature&lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="string token"&gt;"fiber_acti"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt; &lt;SPAN class="operator token"&gt;==&lt;/SPAN&gt; &lt;SPAN class="number token"&gt;1&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;)&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; base_url &lt;SPAN class="operator token"&gt;+&lt;/SPAN&gt; imgs_fiber&lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="number token"&gt;1&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt; &lt;SPAN class="keyword token"&gt;else&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; base_url &lt;SPAN class="operator token"&gt;+&lt;/SPAN&gt; imgs_fiber&lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="number token"&gt;0&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt;&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The second expression is used to define the text in a very simple way:&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="keyword token"&gt;if&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;(&lt;/SPAN&gt;$feature&lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="string token"&gt;"fiber_acti"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt; &lt;SPAN class="operator token"&gt;==&lt;/SPAN&gt; &lt;SPAN class="number token"&gt;1&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;)&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"Fiber Service Available"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt; &lt;SPAN class="keyword token"&gt;else&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"Fiber Service Not Available"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt;&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;The last expression is to configure the style display of the anchor (link) whith one of two values "none" (hide) or "inline" (show):&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="keyword token"&gt;if&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;(&lt;/SPAN&gt;$feature&lt;SPAN class="punctuation token"&gt;[&lt;/SPAN&gt;&lt;SPAN class="string token"&gt;"fiber_acti"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;]&lt;/SPAN&gt; &lt;SPAN class="operator token"&gt;==&lt;/SPAN&gt; &lt;SPAN class="number token"&gt;1&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;)&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"inline"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt; &lt;SPAN class="keyword token"&gt;else&lt;/SPAN&gt; &lt;SPAN class="punctuation token"&gt;{&lt;/SPAN&gt;
    &lt;SPAN class="keyword token"&gt;return&lt;/SPAN&gt; &lt;SPAN class="string token"&gt;"none"&lt;/SPAN&gt;&lt;SPAN class="punctuation token"&gt;;&lt;/SPAN&gt;
&lt;SPAN class="punctuation token"&gt;}&lt;/SPAN&gt;&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;And this should be repeated for each service to ontain the effect.&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Sun, 12 Dec 2021 01:50:49 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-online-questions/hyperlink-within-expression-of-pop-up-in-agol/m-p/602679#M30102</guid>
      <dc:creator>XanderBakker</dc:creator>
      <dc:date>2021-12-12T01:50:49Z</dc:date>
    </item>
  </channel>
</rss>

