Mudando a cor da barra de navegação do Chrome para Mobile

Mudando a cor da barra de navegação do Chrome para Mobile

Olá pessoal, hoje abordarei sobre desenvolvimento web, o tema de hoje é um recurso muito bacana, que eu já utilizo a algum tempo em meus projetos, são pouquíssimos sites no Brasil que já estão utilizando o recurso de mudar a cor da barra de navegação do chrome para mobile, confira como é exibido um site que não utiliza o recurso.

A barra de navegação do Google Chrome é branca por dentro e cinza por fora

Agora confira como é exibido um site com o novo recurso liberado, note que a barra de navegação do google chrome muda de cor.

Gostou? Então vamos botar a mão no código!

Mas nem tudo são flores, antes de iniciar, devo lembrar que esse recurso por enquanto só funciona a partir da versão 39 do Chrome para Android da versão Lollipop e posteriormente qualquer versão superior que venha a ser lançada.

Acredite é super simples fazer essa implementação, você só precisará acrescentar uma linha de código. Sim, você leu certo, somente uma linha de código.

Ferramentas para começar

  • Ter acesso ao FTP do site  ( FilleZila  ou WebFTP do seu Servidor de Hospedagem)


Vou mostrar como funciona esse exemplos para as seguintes plataformas:

  • Sites em HTML
  • Sites em Wordpress
  • Sites em Joomla

 

Aplicando em sites HTML

Obs: dentro de content =" #COLOCAR O CODIGO HEXADECIMAL DA IDENTIDADE VISUAL DA SUA MARCA/ SITE"


Site que informa todos os códigos das cores em Hexadecimal:

 

Agora confira o resultado:



Aplicando em sites Joomla

Após entrar na página de administração do Joomla, siga as instruções abaixo:
Extensões > Gerenciador de Temas > Temas >Editar Página Principal do Tema  

Confira o passo a passo

  1. Abra o painel de Administração do Joomla;
  2. Vá em Extensões;
  3. Selecione a Opção Gerenciador de  Temas;
  4. Escolhe a opção Tema;
  5. Selecione o tema que você esta utilizando;
  6.  No Item Arquivos principais do Tema clique sobre  Editar página principal do Tema;

 

Aplicando em sites Wordpress

  1. Acesse o FTP do site  pelo  FilleZila  ou WebFTP do seu Servidor de Hospedagem.
  2. Procure pela pasta Themes  (Normalmente fica dentro de wp-content/themes/);
  3. Selecione a pasta do template que o site esta utilizando
  4.  Procure pela página head-meta.php ou header.php (Pode variar dependendo do tema);

E ai gostou da dica? super fácil né?

Lembrando que só funciona em chrome com a versão Lollipop, acredito que em 2016 o numero de distribuição do Lollipop deve aumentar consideravelmente e quem sabe essa tendencia não se espalhe para outros sistemas operacionais como IOS e WP.

Se gostou deixe seu comentário, compartilhe com os amigos, quaisquer duvidas, fico a disposição.

Entre para ver ou adicionar um comentário

Outros artigos de Irlen Menezes

  • Bomba: Instagram irá abandonar seu algoritmo por ordem cronológica

    Bomba: Instagram irá abandonar seu algoritmo por ordem cronológica

    O instagram acabou de anunciar oficialmente através de seu blog para negócios, sobre a mudança que irá acontecer dentro…

  • Novidade: Instagram permite administrar mais de um perfil

    Novidade: Instagram permite administrar mais de um perfil

    Olá pessoal, depois de muitos anos, finalmente o instagram liberou o recurso que oferece a possibilidade de gerenciar…

  • Você pratica a dieta da informação?

    Você pratica a dieta da informação?

    Olá colegas do LinkedIn, não gosto de fazer textos longos, porém esse eu prometo que será diferente. Acredito que serão…

  • O cliente que não volta mais

    O cliente que não volta mais

    Anos atrás, Sam Walton, fundador da maior rede de varejo do mundo, a Wal-Mart, abriu um programa de treinamento para…

  • Facebook começou a testar o Lead Ads

    Facebook começou a testar o Lead Ads

    Olá amigos, o Facebook anunciou recentemente mais uma excelente opção para os anunciantes, eles estão testando anúncios…

  • Novidades de Junho para o Instagram

    Novidades de Junho para o Instagram

    Olá pessoal, faz um tempo que não posto novidades sobre o instagram, mas tenho boas notícias para quem usa a…

  • Vi o SPAM, Gostei? Cliquei!

    Vi o SPAM, Gostei? Cliquei!

    Olá colegas do linkedin, esses dias me deparei com um spam bem interessante, que me chamou bastante atenção e me fez…

    2 comentários
  • Curso Online Gratuito de Web Metrics & Google Analytics

    Curso Online Gratuito de Web Metrics & Google Analytics

    Olá colegas de linkedin, gostaria de compartilhar com vocês, esta ótima oportunidade para quem pretende aprender um…

    1 comentário
  • O Botícario vs Malafaia

    O Botícario vs Malafaia

    Entenda o caso Ao mostrar casais gays trocando presentes no Dia dos Namorados, uma campanha da marca de cosméticos O…

  • Como encontrar conteúdo de qualidade com Linkedin

    Como encontrar conteúdo de qualidade com Linkedin

    É muito simples, porém poucas pessoas conhecem o recurso chamado tópico dentro da plataforma do Linkedin. O que é um…

    2 comentários

Outras pessoas também visualizaram

Conferir tópicos