RSS

Personalizando o Firefox com o User-chrome

domingo, 29 de junho de 2008

O Firefox possui um arquivo especial de configuração chamado userChrome.css que permite alterar vários aspectos da interface de usuário e para isso basta apenas ter algum conhecimento da linguagem CSS.

O arquivo userChrome fica localizado na pasta do perfil do usuário em uma pasta chamada chrome, nesta pasta existem dois arquivos chamados: userChrome-example.css e userContent-example.css, como o nosso foco é o userChrome eu não entrarei em detalhes sobre o userContent, apenas adianto que ele pode ser utilizado pelo usuário para aplicar estilos personalizados à páginas exibidas pelo navegador.

Para o nosso tutorial abra o userChrome-example com um editor de textos qualquer e salve uma cópia com o nome de userChrome.css, o exemplo já vem com algumas modificações comentadas e é por elas que nós começaremos a modificar o navegador.

Uma bem interessante é a que permite remover a animação que representa o loading dá página, chamada throbber, apesar de não ser um empecilho o espaço ocupado pela mesma será utilizado em futuras modificações. Para remover a tal animação utilize a seguinte regra aplicada ao seletor #throbber-box:

#throbber-box {
display: none !important;
}

Para quem conhece CSS a regra acima é de muito fácil entendimento, ela diz que o elemento com o atributo ID igual a throbber-box terá a propriedade display modificada para none, ou seja, o elemento não será exibido. A propriedade !important indica que esse estilo deve ter uma importância maior do que o estilo padrão do navegador.

Após as alterações reinicie o navegador e veja se a animação continua aparecendo na barra de menus.

Aumentando a área de visualização do seu navegador

Em determinadas resoluções de tela o espaço de visualização, ou viewport area, se torna muito importante, o userChrome permite maximizar esse espaço através da eliminação de barras e opções pouco utilizadas.



A imagem acima mostra o firefox com a barra endereços ao lado da barra de menu e apenas os botões de voltar e atualizar sendo exibidos. Com essa configuração a área de visualização de páginas teve um aumento substancial e me permite navegar em algumas páginas sem ter de apelar para o fullscreen a toda hora.

Abaixo estão as propriedades utilizadas para obter esse resultado no navegador:

A primeira parte exige que você clique em uma área vazia da barra de navegação e selecione a opção personalizar, no modo de personalização é possível redimensionar e arrastar os componentes para outra barra ou retira-los. A primeira coisa a se fazer é arrastar a barra de endereços para o lado da barra de menus. Em seguida retire da barra a caixa de busca e arraste os botões da barra de navegação para o lado da barra de endereços. Após isso vá até o menu exibir e selecione a opção barra de ferramentas, lá desmarque a caixa correspondente a barra de navegação. Pronto o seu espaço já aumentou consideravelmente, mas, para a personalização ficar completa é necessário alterar algumas coisas no userChrome.

Abra o arquivo novamente e adicione as seguintes linhas ao final do mesmo:

/* Essa alteração esconde os menus ajuda e editar da barra de menus */
#helpMenu, #edit-menu {
display: none !important;
}

/* Esconde o botão voltar se não houver uma página anterior no histórico de navegação, caso o botão seja necessário ele volta a aparecer na barra */
#back-button[disabled="true"] {
display: none;
}

/* Esconde o botão avançar se não houver uma próxima página no histórico, caso o botão seja necessário ele volta a aparecer na barra */
#forward-button[disabled="true"] {
display: none;
}

/* Esconde o botão parar caso a página não esteja sendo carregada, quando necessário ele se torna visível novamente */
#stop-button[disabled="true"] {
display: none;
}

/* Esconde o botão home */
#home-button {
display: none;
}

Após isso o reinicie o firefox e ao voltar ele estará como o da imagem de exemplo. Para voltar ao normal, apague ou renomeie o userChrome e abra o dialogo de personalização das barras de ferramentas novamente, lá selecione a opção restaurar as barras ao estado original, pronto seu firefox estará como saiu de fábrica.

O userChrome permite ao usuário alterar de varias maneiras o firefox e torna-lo único ao gosto do usuário.

Fonte: LifeHacker