Na semana passada, publicamos um guia rápido sobre como criar atalhos de aplicativos da Web no ChromeOS para sites que não oferecem um PWA. Essa é uma ótima maneira de ter uma experiência semelhante a um aplicativo para seus sites favoritos e mantê-los contidos em sua própria janela. No entanto, às vezes, o ícone que é criado automaticamente para ele, que vem do favicon do site, não é o ideal e às vezes é totalmente feio. Quando isso acontece, você, infelizmente, fica preso a um ícone que não gosta na gaveta ou prateleira de aplicativos do seu Chromebook. Não precisa ser assim.
Por exemplo, eu uso bastante o Whatsapp, mas o ícone é cercado por um quadrado, que é então envolvido em um círculo como os ícones de aplicativos do ChromeOS fazem. Isso resulta, na minha opinião, em um ícone extremamente estranho e feio. Se você criou um atalho para um site e não está satisfeito com o ícone que foi criado para ele, continue lendo para obter uma solução.
Ícone do aplicativo original para WhatsApp Web na gaveta de aplicativos
Como alterar o ícone do site
Encontrei essa solução há alguns anos em Reddit e o tenho usado desde então. Envolve criar um bookmarklet e executá-lo para alterar temporariamente o ícone de atalho que está armazenado em cache no seu navegador e, em seguida, criar o atalho novamente antes de atualizar a página. Depois de atualizar essa página, o ícone do site volta ao original, no entanto, o atalho que você criou manterá o novo ícone personalizado. Vamos seguir as etapas.
Copie o código abaixo para sua área de transferência. Este será o código javascript para o seu bookmarklet.javascript:(function() { var links=document.querySelectorAll(‘link[rel*=icon]’); var href=prompt(‘Digite o URL do seu novo ícone de prateleira’); href && links.forEach((link)=> link.href=href); })();Abra o Gerenciador de favoritos do Chrome e crie um novo favorito. Dê o título que quiser, talvez algo como “Mudança de ícone” e cole o código que você copiou como URL. Clique em Salvar.Encontre a imagem que deseja usar como seu novo ícone e copie a endereço da imagem. Eu recomendo usar um site como Flaticon ou Iconfinder. No exemplo abaixo, estou copiando o URL da imagem para o ícone do Whatsapp que quero usar.Abra uma nova guia e navegue até o site para o qual deseja criar um atalho com seu ícone preferido. Quando estiver no site, execute o bookmarklet que você criou na etapa 2. O bookmarklet solicitará que você insira o novo URL do ícone da estante. Digite o endereço da imagem que você copiou anteriormente e pressione OK.Você notará que o favicon do site mudou e permanecerá assim até o página é atualizada. Neste momento, você pode continuar criando (ou recriando) o atalho do site seguindo estas instruções.Novo aplicativo (personalizado) ícone para WhatsApp Web na gaveta de aplicativos
Depois de recriar o atalho do site, ele assumirá o novo ícone que você definiu e permanecerá assim, a menos que você exclua o atalho ou powerwash. Observe que, embora isso funcione para a maioria dos sites que experimentei, pode haver momentos em que o ícone do site não será alterado, como é o caso de aplicativos ou sites do Google que aplicam seu próprio ícone. Embora não seja uma solução real para esse problema, é uma solução alternativa aceitável até que o Google nos forneça uma maneira de personalizar ícones de aplicativos no ChromeOS.
