Javascript - create desktop link programmatically - javascript

Is there a way to programmatically create a desktop link for my webpage?

Not from Javascript, but there is a trick to let the users do it. It is more of an interaction design technique rather than programming technique but I'll write it maybe someone googles this question and finds it useful.
Make an icon on your page with a text under it. Then ask the user to drag this icon to their desktop. The icon should be embedded in an anchor tag <a> with the href attribute pointing to your website. The text under the icon should be the same as the <title> tag of your page. The browsers make an icon when the user drags an anchor link from a page to a folder, desktop or bookmark bar. The text that the browsers assign this shortcut or link is usually the <title> of the page. Remember that the icon should be set as the background of the element so that the browser doesn't save the image instead of making a new link. It would be even better if this icon is the same as the favicon of your website.
To demonstrate this technique here is some code:
<p>You can make a shortcut to www.mysite.com by dragging this icon to your desktop or bookmark bar: </p>
<a href="https://www.example.com">
<div id="icon" style="background-image:url('favicon.png');width:32px;height:32px;"></div>
<div id="title">www.example.com</div>
</a>
Like a native app:
In Chrome users can go to Menu > More tools > Create application shortcut... and create a borderless shortcut to your site that looks like an app. Something similar can be done in Android, iOS and also Firefox on Android.

This is not possible with browser scripts such as JavaScript. It is a security feature. I'm sure you can appreciate why people would not want webpages to be able to access your local file system.
Imagine that instead of drowning in popup windows, we would be drowning in files created by spammy/scammy webpages. I'm not saying that your site is spammy or scammy, just trying to put this into perspective :)
You could quite easily create a sort of tutorial for your users on how to create a shortcut or add your page to their bookmarks taking into consideration that users may be using different browsers, but if you cover the major browsers, Chrome, Firefox and IE, I'm sure your users will have no problem following your instructions.

From JavaScript, running on a webpage?
No.

Related

Intend Chrome via html a tag href

When a link is clicked on Instagram, it opens on Instagram built-in browser.
In my page, I have some links that I want they open in Chrome if a user clicks on them.
Is there any way to do it?
For example, we can intend WhatsApp via tag like this: whatsapp://send?text=${message}
I'm looking for a solutation to indent Chrome if is its support.
To my knowledge, Chrome doesn't have their own URI but only the one it uses in its own browser for settings, etc: chrome://settings. If you need Chrome for something to work properly, I'd personally suggest looking into how the Instagram browser is built and dedicate your code to it - the use of Chrome is no longer needed then and stays in the environment of Instagram.

Preventing iOS mobile browsers from forcing open apps when clicking links?

I have a website which contains links to external websites, for example amazon product links. The links work just fine, but when I test my website on mobile (iOS in this case), I noticed that clicking the links in the mobile browsers would force open the Amazon app rather than just opening a new tab.
The links in my html are as follows:
I want to have these links open in the browser only, not in their respective apps. Is there any way in to prevent this behavior using html / javascript? Thanks!
No, you can't.
The reason is: you should not be able to impose your choice on the user. Maybe the user prefers the app? That's why iOS 9 introduced the app switcher on the top left hand corner if you switch apps.
Also, let's look from the other side of things if you are the app developer: If you go so far as to build an app and allow universal links (or generally deep links), you obviously would like the user to use that feature and rather open the site in the app. But again, you cannot force the user into opening that link in the app. That's a good thing, because it all depends on what the user wants to do and how he wants to do it.
Having the user choose is the best way to handle this from a UX point of view.

How to ink to another .html page within Chrome extension/app?

I am building a chrome app for a client that will run in kiosk mode to display in their stores. Right now I have an index.html page that links to about 30 other pages. However, when I click on a link in the app I get an error...
Can't open same-window link to "chrome-extension://leghflngpfmomcflabikghiemaajadne/poweredge"; try target="_blank".
So I tried target="_blank" and that tries to open it in a new chrome window.. no good. I've been reading a little bit about using webview and sandboxing pages but they both open the pages in a new window and it just doesn't look good.
Is there a better way to do this? Right now my only idea is to place all of the content on the index.html page and turn on/off sections of the content with jQuery. I'd love to keep all of the pages separate though, just for my own sanity.
Thanks!
Navigation is disabled for the Chrome Apps platform. In theory you are supposed to make single-page apps - so your turn on/off approach is the "intended" one.
No-one stops you from having several windows though - suppose you have an options page, it wouldn't be strange to open it separately (via chrome.app.window.create)
As stdob mentions in comments, a workaround may be possible by using <webview> with a partition blessed to show local resources. It's not clear though if it will allow access to apps APIs.

Run HTML page in Windows window like exe

I have an HTML quiz (it is designed in html+css, but calculated and animated in JavaScript). Therefore, it opens in browser by default (quiz.html). I want to make it open in for example Windows window or something different. Is it possible. Or some portable browser, and set up HTML file to open by it. How?
The problem is that browser environment (bookmarks, forward, refresh buttons) is visible, and I don't want that. I want it to open in its specific environment, because it will be placed on 20 computers with different browsers etc... I can install anything on those machines. Or is it maybe possible to set up my quiz.html file to open in some other unpopular browser with no so many buttons and details?
Like said in comment, you might try to open your page in a pop.
http://www.w3schools.com/jsref/met_win_open.asp
http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_open
With the following code, I manage to get a popup without anything but the page and the address bar (on Firefox Potable).
window.open("http://www.w3schools.com","width=200,height=100",'directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no');
You would still have the adress bar in Firefox, but this can be remove following this post:
Open new popup window without address bars in firefox & IE
If restricting your users to IE is ok then you want an HTML Application (*.HTA) which allows the hosting of HTML/Script in a standalone non-browser window which would seem to be ideal for your purposes.
MSDN ref.

show browser preferences & Page Setup using javascript

Is there a way to use javascript to activate the preferences dialog, so that a user can change a proxy address if they need to & also be able to click on an anchor link and have the Page Setup Dialog open, so that they can choose the page orientation for printing.
The reason for this, is becuase I am trying to use mozilla Prism to deploy a web application, but I have hidden the Navigation Bar & Status Bar(which contains the Prism's button for setting these preferences). I want Prism to be just a frame.
I have not posted in Prism discussion forums, becuase maybe there is standard javascript way of opening up these dialogs, can you(anyone) share how if it is possible. A firefox workaround will be enough, since prism is based on Firefox. Thanks.

Categories

Resources