Alterando a imagem de plano de fundo do NTP do Chrome

Existe uma maneira de definir ou alterar o plano de fundo da página de novas guias do Chrome sem instalar um tema?

A página newtab não é gerada, é um recurso incorporado ao Chrome que é carregado e processado em tempo de execução. É claro que seria mais fácil modificar a página Nova guia com uma extensão, mas você pode editá-la para tornar suas alterações permanentes (por exemplo, embutidas, mesmo quando executadas no modo mínimo, com todos os plugins e extensões desativados). você teria que fazer isso novamente após cada atualização (embora isso possa ser facilitado de várias maneiras). Se você quiser seguir esse caminho, poderá encontrar a página Nova guia no arquivo CHROME.DLL.

Primeiro feche todas as instâncias do Chrome / Chromium (verifique se nenhuma instância chrome.exeestá presente no Gerenciador de tarefas) e, em seguida, faça uma cópia de backup chrome.dll(o ResHacker faz isso automaticamente, mas você deseja uma cópia sobressalente).

Agora abra chrome.dllem um editor de recursos como o ResHacker . A página está na seção binária ( BINDATA ), no recurso 523 - o número pode mudar, mas procure a sequência bookmarkbarattached:bookmarkbarattached;. (Por algum motivo, não há <title>New Page</title>elemento na página, ele é adicionado em tempo de execução, mesmo sendo uma sequência estática e sem conteúdo dinâmico.)

Neste ponto, você pode fazer as alterações que desejar. Você pode adicionar elementos, scripts, estilos etc.

Além do óbvio (edição de arquivos binários compilados e necessidade de reeditar após atualizações), uma ressalva é que você não pode vincular a arquivos locais (o que faz sentido, pois o navegador não é um servidor da web). A página Nova guia está "localizada" no URL chrome://newtab/, portanto, quaisquer URIs relativos serão relativos a isso). Obviamente, você pode usar URIs absolutos como http://foobar.org/images/blah.jpgou chrome://theme/css/newtab.css.

Quando terminar, compile o script (se o editor de recursos tiver esse botão) e salve-o. Agora execute o Chrome e sua página Nova guia deve ser brilhante e nova.

Abaixo, editei a página Nova guia e joguei uma imagem no canto inferior direito que alterna entre dois arquivos gráficos quando você clica nela (era originalmente um link simples para a minha página inicial, mas “imaginei” mostrar que você pode fazer alterações significativas na página Nova guia). Também defino o estilo do bodyelemento como um arquivo gráfico no meu site, para que eu possa alterá-lo facilmente, alterando o arquivo em vez de reeditar o arquivo DLL. Obviamente, ainda mais fácil seria simplesmente adicionar uma folha de estilos externa à página para que quaisquer alterações possam ser feitas em um arquivo de texto sem reeditar o arquivo DLL.

Não diretamente, você pode personalizar usando a Discagem rápida

Se você não estiver satisfeito com a alteração da cor da Discagem rápida, poderá definir uma imagem de plano de fundo para realmente mudar a aparência. Qualquer imagem funciona, mas atualmente precisa ser hospedada online. O desenvolvedor observa que em breve estará adicionando suporte para imagens de segundo plano locais, portanto, fique de olho em futuras atualizações.

FONTE

^{Eu ia substituir minha resposta antiga por essa nova e atualizada que é completamente diferente, mas aparentemente a antiga ainda é válida para versões mais recentes do Chrome, então achei que a adicionaria como uma resposta separada.}

Algumas versões anteriores, o Chrome foi alterado para que tudo no navegador seja uma página da web. Depois de implementar uma folha de estilo do usuário, tornou-se possível alterar praticamente tudo no navegador, incluindo seu próprio cromo.

Você pode realmente alterar o plano de fundo da página da nova guia sem nenhum tema e facilmente também. Na verdade, você pode personalizar a maior parte da página da nova guia e outras partes do Chrome. A única limitação é que você deve usar CSS para fazer isso (não é possível substituir o conteúdo no momento).

O procedimento geral para personalizar o Chrome é simples:

1. Abra o diretório de dados do usuário
2. Abra a User StyleSheetspasta
3. Abra o arquivo Custom.cssem um editor de texto
4. Digite seu CSS
5. Salve o arquivo
6. Observe os resultados

Se você deseja alterar o plano de fundo da página da nova guia, pode usar algo como isto:

/*Change NTP background*/ html[themegravity] {background:url(http://upload.wikimedia.org/wikipedia/commons/2/2c/IntP_Brick.png) !important;}

É uma linha única e simples, mas tem alguns aspectos importantes:

• Começa com um comentário (sempre bom, especialmente quando o arquivo começa a crescer com todas as suas personalizações).
• Ele cria uma regra CSS para o htmlelemento com um themegravityatributo. Eu escolhi isso porque na versão que estou usando, essa era a melhor maneira de restringir a regra CSS apenas ao plano de fundo do NTP. Infelizmente, isso pode variar ou mudar de versão para versão, então você pode ter que experimentar as ferramentas de desenvolvimento ( F12) para encontrar um bom seletor de CSS que funcione.
• A regra define a imagem de plano de fundo para uma textura lado a lado na loja WikiMedia.
• Ele usa o !importantmodificador para garantir que a regra seja usada e não substituída pelas próprias folhas de estilo internas do Chrome.

Você pode usar qualquer imagem válida para o plano de fundo (qualquer coisa que funcione em uma página da Web comum). Isso oferece grande flexibilidade, pois as opções válidas incluem:

• Imagens hospedadas externamente
• Imagens locais no disco rígido do sistema
• Recursos incorporados no Chrome
• Fluxos de dados de imagem codificados em Base64

Obviamente, você deve ter cuidado com as imagens hospedadas externamente para evitar malware e por motivos de desempenho (é necessário fazer o download), mas uma imagem externa tem o benefício de poder atribuir uma imagem a um host em que a imagem é alterada dinamicamente . Por exemplo, se houvesse um URL como o http://coolpics.com/dailypic.jpgque muda todos os dias, a configuração forneceria um novo plano de fundo todos os dias ! ʘ◡ʘE você só precisava usar uma única linha que nunca muda. Muito legal né?

Como eu disse antes, o fundo não é a única coisa que você pode mudar, você pode mudar quase tudo. Tudo o que você precisa fazer é escolher os seletores CSS corretos o suficiente para atingir o elemento sem afetar outras páginas da web. Isso pode ser um pouco complicado, mas certamente factível, especialmente porque o Chrome suporta CSS3. E a melhor parte é que as alterações são feitas instantaneamente quando você salva a folha de estilo, para que você não precise se preocupar em instalar nada , o que facilita o teste. (Não esqueça de usar o !importantmodificador.)

Por exemplo, você pode ativar isso:

nessa monstruosidade:

Este exemplo pode não ser bonito, mas demonstra o que pode ser feito com apenas um pouco de CSS. Abaixo está o CSS que eu usei para fazer essa amostra feia; inclui uma variedade de hacks e ajustes que mostram os diferentes tipos de seletores e imagens que você pode usar. Os seletores que escolhi trabalham para a versão do Chrome que estou usando no momento, sem afetar outras páginas da web em que estive.

/*Customize the Chrome New Tab Page*/
/*Change background to tiling texture*/                          html[themegravity] {background:url(http://upload.wikimedia.org/wikipedia/commons/2/2c/IntP_Brick.png) !important;}
/*Set the webstore icon to an emoji and change text to red*/     span#chrome-web-store-title {background:url(chrome://theme/IDR_PROFILE_AVATAR_14) no-repeat bottom right !important; color:#f00;}
/*Change the Chrome logo to the built-in conflicts icon*/        div#logo-img {margin-left:-70px !important; padding-left:20px !important; width:20px; height:63px; background:url(data:image/png;base64,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) !important;}
/*Hide normal Chrome logo*/                                      div#logo-img img {display: none !important;}
/*Change bar at bottom to reddish fade*/                         html[themegravity] div#footer {background-image:-webkit-linear-gradient( rgba(255, 192, 192, 1.0), rgba(200, 255, 200, 0.5)) !important;}
/*Change color of most-visited items to yellow and make bold*/   a.most-visited span.title {color:#ff8 !important; font-weight:bold !important;}
/*Give thumbnails a thick, dotted, green border*/                span.thumbnail-wrapper {border:dotted #0f0 5px !important;}

As possibilidades são ilimitadas (ok, não literalmente, mas ainda bastante vastas).