Theia: Branding: Theia should has favicon icon

Created on 23 Nov 2018  路  6Comments  路  Source: eclipse-theia/theia

Branding: Theia should has favicon icon.

design enhancement

Most helpful comment

For anyone that is desperate for a favicon, here's a little command you can run to add a favicon to your theia web ide:

cd your_theia_folder/lib && wget https://raw.githubusercontent.com/theia-ide/theia-apps/master/theia-electron/resources/icon.ico && sed -i 's/<meta charset/<link rel="icon" href=".\/icon.ico" type="image\/x-icon">\n  <meta charset=/' index.html 

All 6 comments

Not only that, we need a icon on the left pane just like Gitpod Theia.

@kittaakos can you perhaps share on how gitpod achieved this? The only way I could see updating the icon in the menu-bar was by editing the css (theia-icon) from core.

can you perhaps share on how gitpod achieved this

I do not know.

I was able to test and add a custom favicon to the main application by updating
the frontend-generator.ts. Where we generate the <head></head> portion, I included the following link tag.

  <link rel="icon" href={url} type="image/x-icon">

The only issue I had was getting the image served by the server. When using an external image (such as one hosted already) the icon was displayed correctly.

![Screenshot from 2019-03-12 08-48-20](https://user-images.githubusercontent.com/40359487/54201299-aaf43580-44a3-11e9-8daa-3b82747f9aa6.png)

The next step would be to find out how to properly serve internal icons as a favicon and make it much easier for extenders to update it.

Thank you for opening this issue. Has there been any update on making it easy for extensions to set a favicon?

For anyone that is desperate for a favicon, here's a little command you can run to add a favicon to your theia web ide:

cd your_theia_folder/lib && wget https://raw.githubusercontent.com/theia-ide/theia-apps/master/theia-electron/resources/icon.ico && sed -i 's/<meta charset/<link rel="icon" href=".\/icon.ico" type="image\/x-icon">\n  <meta charset=/' index.html 
Was this page helpful?
0 / 5 - 0 ratings