Creating awesome native applications from websites

So I’ve talked before about what apps I really like in Chrome to make life in the open source world a little easier but I wasn’t 100% satisfied with the “pin them to chrome and reference them from there” solution. If you want your Chrome apps (or really any webpage) to show up as their own icon in the Unity bar (or Docky, like I have) there’s a pretty straight forward way to do it.

1. Navigate to the website (I’ve done this for Evernote, [Google Inbox](inbox.google.com), and now I’m doing it for Feedly) using Chrome.
2. Once you’re there, click the burger menu on the right and navigate to More Tools > Create application shortcuts… which will open a dialogue. I don’t do Desktop so just make the menu icon. Technically you’re done now but not by my standards so…

1. The icon is all messed up, as I’m sure you’ll notice, so we’re going to fix that. This is the same basic procedure for fixing any Docky/application icon issues. Using the terminal navigate to .local/share/applications and do an ls to see everything in there.
2. Find the .desktop entry for your application, it’ll start with chrome-http… so start there. Mine is called chrome-http___feedly.com_i_latest.desktop. Use your editor of choice to open this file up for editing. You shouldn’t need root access.
3. You’re going to add and/or edit the Icon= line to point to a better icon. The hard part is figuring out which icon you want so in a Files window you’re going to navigate to /usr/share/icons/ and if you have Numix installed from my previous post on customizing your desktop you want to go deeper into Numix-Circle/48x48/apps/. Find one that fits. This can be really nice, sometimes I just do Ctrl-F and find the icon that Numix intended to be associated with this app (like Evernote) but sometimes you just have to settle for something close. Poke around, find one you like. Go back to your editor and add the startup class. For me it was easy and Feedly is already an icon so mine was just Icon=feedly, save and close that file.

You’re done! You might need a restart to make sure everything gets all set up but that’s the basic premise as I use it.