0

UPDATE: I changed the image displaying on my page to an encoded version, instead of referencing the external image. I was able to put my image into a Base64 converter, and then copy and paste the string version of the image into the file (represented by ~~~ in my code below). This worked fine. Is there a similar method for encoding the icon?

Problem: I have a HTML Application file (.hta) that I've created. To make the user experience more customized I would like to change the icon for the taskbar (and maybe the actual file when looking at it in the file explorer or on SharePoint). The reason I want to encode the image instead of using a file is because when I try to use a network file, it takes a 'long' time to open the .hta file and I know this will annoy my end users. It is a basic site with links to open template files that we use frequently, the purpose is to open a copy of the most recent template so we make sure everyone is using the most current templates and knows where all of the tools we use are located. I've researched this quite a bit and I can't seem to find a solution that works for me.

What I've Tried:

  • I've tried the "trick" where I use the Command Prompt to copy the .ico file to the .hta file. This does change the icon but displays a bunch of nonsensical text at the top of my page above all of my content. If someone has a solution for removing this, that works. Unless this is not a stable solution...
  • I've also tried converting my image to Base64 and using that when declaring the ICON in < HTA:APPLICATION ... />, similar to encoding for < img >, but it didn't work for me. When I tried, nothing happened.

Additional Comments: I'm OK with any solution really, as long as the image is encoded and it is stable.

Basic Structure of Working File (UPDATED):

<!DOCTYPE html>
<html>
<HTA:APPLICATION ID = "oMyApp" APPLICATIONNAME = "MyApp" ICON = "path" BORDER = "thick" CAPTION = "yes" SHOWINTASKBAR = "yes" SINGLEINSTANCE = "yes" SYSMENU = "yes" WINDOWSTATE = "maximize" />

<head>
<title> My App </title>
<link rel = "icon" href = "path">
<link rel = "sytlesheet" type = "text/css" href = "StyleSheet.css">
</head>

<body> <div class = "content">

<div class = "Title">
<img src = "data:image/png;base64,~~~" alt = "icon" />
<strong> My App </strong>
</div>

<div class = "main">

<div class = "column">
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<br><br>
</div>

<div class = "column">
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<br><br>
</div>

<div class = "column">
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<br><br>
</div>

<div class = "column">
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<div class = "box">
<a href = "path to file"> File Name </a> <br>
<strong> Instructions </strong> <br>
<em> Description of File </em>
</div>
<br><br>
</div>
</div>

<div class = "Footer">
<em> Comment to Users </em>
</div>
</div> </body>
</html>

Please Help

britnysarver
  • 1
  • 1
  • 3
  • 1
    HTAs have to run in IE7 compatibility mode in order for the `` element to be used by the HTA runtime, but IE7 compatibility mode doesn't support `data:` URIs. You **can** use `data:` URis if you run your HTA in Internet Explorer 11 mode, but then your `` element will be ignored - which means you can't use any custom icon at all, which kinda defeats the point of it. – Dai May 14 '20 at 21:49
  • 1
    FWIW, non-trivial HTA applications have always required multiple files on-disk. That said, your explanation that using a network-share causes a "slow" load time doesn't make sense - network-shares tend to be 100mbps+ low-latency connections, and a tiny 16x16 image won't take any time at all to load - if it is, then something is seriously wrong with your network. – Dai May 15 '20 at 09:05
  • I've never heard of this "trick" with the Command Prompt that you're referring to - can you explain further? – Dai May 15 '20 at 09:06
  • Dai - It might be because there are so many of us remoting in at this time since the majority are working from home, I'm not sure. But I also thought it would just be cleaner and easier if it was embedded, plus then I wouldn't run the risk of someone accidentally moving or deleting the icon file. The "trick" I found in this post, https://stackoverflow.com/questions/175994/can-i-embed-an-icon-to-a-hta-file. I also saw it a few other places. – britnysarver May 16 '20 at 23:30
  • @Dai - The "trick" I was talking about is also described [here](http://www.john-am.com/2010/07/building-a-self-contained-hta-with-embedded-images-and-icons/#comment-655). I wish this would work, because it seems like a 'simple' yet effective solution. I just can't have the nonsensical text/characters at the top of my page. Also, if it helps my computer has IE11. – britnysarver May 18 '20 at 13:19

0 Answers0