Menu Chiudi

Migliorare la grafica dei controlli form di Firefox

Questa è una piccola modifica a Firefox che ho sempre pensato di mettere in pratica, ma non ho mai ritenuto così importante, anche sperando che prima o poi venga risolta “upstream”. Ecco di cosa parlo:

ff_senza.png

Prima, ma chi ha disegnato questi controlli?…

ff_con.png
…e dopo! (crediti per le foto in calce)

Le informazioni per fare questa modifica sono disponibili in rete da tanto tempo, ma per qualche strano motivo non è facile trovarle con google, per cui ho pensato di usare pollycoke :) e qualche keyword ad hoc per dare un po’ di visibilità alla cosa.

Questa modifica, come avrete capito, migliora l’aspetto grafico di check box, radio buttons, pulsanti e in genere i controlli dei form delle pagine html visualizzate con Firefox. Non modificheremo alcuna delle funzionalità del browser.

I comandi da dare da terminale sono questi:

$: wget http://users.tkk.fi/~otsaloma/art/firefox-form-widgets.tar.gz
$: tar -xvzf firefox-form-widgets.tar.gz
$: sudo cp /usr/lib/mozilla-firefox/res/forms.css /usr/lib/mozilla-firefox/res/forms.css.bak
$: cat firefox-form-widgets/res/forms-extra.css | sudo tee --append /usr/lib/mozilla-firefox/res/forms.css > /dev/null
$: sudo cp -r firefox-form-widgets/res/form-widgets /usr/lib/mozilla-firefox/res
$: rm -rf firefox-form-widgets*

Beh, tutto molto bello, ma sappiate che in realtà stiamo sostituendo una implementazione sbagliata originale con un’altra implementazione sbagliata non originale :(

Il problema è che il team di Firefox non usa i controlli standard GTK per disegnare questi campi, preferendo – come fatto notare altrove – mescolare toolkit in nome della compatibilità multipiattaforma. Non so se con le nuove versioni alpha di Firefox, e con il supporto a cairo, si sia finalmente sistemato questo anacronismo, spero proprio di sì ma non ho voglia di provare una versione alpha di FF al giorno :>

NB: In ogni caso, i comandi sono stati segnalati da “trend65” sul forum di ubuntu-it e successivamente ripresi e pubblicizzati dal buon Aldolat (che ha appena traslocato su un dominio tutto suo, complimenti!), che è anche l’autore delle immagini mostrate in apertura.

70 commenti

  1. Pingback:io, me e michele ^ Some cool Ubuntu Linux tips

  2. claudio

    io le ho installate, ma sputtanano tutto.
    provate a trovare un sito che usa un background su un pulsante di submit ad esempio… vedrete che cagata ne esce fuori.

    purtroppo uso firefox per lavoro, e per testare il design dei siti non posso permettermi di avere orpelli del genere. devo tenermi lo schifo originale :(

  3. nicosaturno

    @hronir
    posso consigliarti di usare QtCurve (se non lo conosci già), così puoi avere i programmi in GTK e in QT praticamente identici (ed è anche un buonissimo style per kde)

  4. LoPissicologo

    Siccome non mi piace andare a scrivere file del sistema (che al primo upgrade se ne vanno a farsi benedire) consiglio di copiare la cartella form-widgets nella cartella ~/.mozilla/firefox/cartella_profilo.default/chrome e di aggiungere il contenuto del file forms-extra.css al file ~/.mozilla/firefox/cartella_profilo.default/chrome/UserContent.css

    Così le impostazioni sono solo per il vostro utente e sopravviveranno ai futuri aggiornamenti.

  5. Pingback:BlogFactory » Blog Archive » Migliorare il CSS di Firefox

  6. d1s4st3r

    Veramente carino tutto ciò, il look di molte pagine è magicamente cambiato in meglio. Devo però far notare che se un sito applica particolari stili CSS alle proprie form, essi vanno bellamente a farsi benedire (poichè il CSS di default del browser ha priorità su tutto).
    Quindi, per come la vedo io… davvero niente male, ma forse è meglio tornare alle impostazioni originarie… :-D

  7. izzy

    felipe sei diventato ufficialmente il mio idolo, erano mesi che bestemmiavo sui form guardando quanto erano brutti :D

  8. Blavkaste

    @hronir e altri utenti KDE
    Uso KDE e ho installato gtk-qt-engine. I controlli dentro firefox non saranno disegnati con le Qt, ma sicuramente meglio della schifezza simil-qindows di prima..

  9. HsC

    Io lo uso da un po’, però credo che sia meglio che ci mettano una pezza ufficiale. Come al solito firefox su linux è parecchio bistrattato, eppure siamo stati i primi ad usare firebird prima e firefox poi.

  10. Lashbg

    piuttosto che queste inutili migliorie grafiche dovrebbe correggere la miriede di bug che sta uscendo fuori in firefox, alcuni degni solo di ie (vedi controlli sbagliati su autocompletamento password……)

    Ciao

  11. felipe

    @tutti:
    Grazie, effettivamente avevo ragione di pensare che questa chicca non era abbastanza visibile… aspettando che l’integrazione di FF con GNOME/GTK venga migliorata

    @mani:
    Certo :)

  12. Pingback:Miglioriamo la grafica dei pulsanti con firefox at Beacher’s Corner

  13. pikkio

    E’ molto meglio in molti casi, tuttavia alcune volte questo trucchetto scombina non poco i layout delle pagine (i controlli sono più spaziosi degli originali).

  14. batta

    ma vi sembra normale: firefox con due finestre, ammetto aperte da circa 4 ore e sono stati aperti 4 tab su una finestra per 3 ore circa, ma ora mangia tra i 58 e 78 mb.
    Mah non lo capisco più tanto firefox solo per aprirlo 20 mb mi sembrano un po’ troppi.
    Batta

  15. Dario L

    GRANDE, ma perchè stì tecnici danno così poca importanza a questi particolari importanti? mah….. GRAZIE POLLYC

  16. kar

    Scusate, ma dopo questa modifica a me tutti gli “option” ed i “check” non si vedono piu’. (Tipo Il web / pagine italiane)
    Come posso tornare indietro ?
    Grazie, kar

  17. luca89

    Semplice nota di stile, questo comando sarebbe più semplice in un’altra maniera:
    cat firefox-form-widgets/res/forms-extra.css | sudo tee –append /usr/lib/mozilla-firefox/res/forms.css > /dev/null

    sudo cat firefox-form-widgets/res/forms-extra.css >> /usr/lib/mozilla-firefox/res/forms.css

    Per il resto, grazie per la segnalazione e anch’io spero che firefox venga meglio integrato con l’ambiente linux.

  18. Pingback:Make Firefox look better « Works for me

  19. michele

    domanda da niubbo (ma non tanto): ho notato che modificando il css migliorano decisamente le form, ma le combobox restano sempre grigie. Ho creato una pagina (per lavoro) che imposta il bgcolor delle combo a giallo (per favore, non commentate il colore… ;) )
    Qualcuno sa darmi qualche consiglio per continuare a gestire il colore delle combo?
    Denghiu! ;)

  20. michele

    Ok, ce l’ho fatta da solo…
    ecco come: alla riga 549 del file forms.css ho eliminato la voce “select”;
    sotto, sempre nello stesso file, ho commentato le righe 627 e 628.

    Grazie comunque! ;)

  21. Davide

    Segnalo che funziona anche su Iceweasel, ovviamente cambiando /usr/lib/mozilla-firefox/res/forms.css con /usr/lib/iceweasel/res/forms.css

    ;)

  22. enry

    Sto usando debian etch dopo qualche accorgimento ho cambiato la grafica di icewesel

    $: wget http://users.tkk.fi/~otsaloma/art/firefox-form-widgets.tar.gz
    $: tar -xvzf firefox-form-widgets.tar.gz
    $: sudo cp /usr/lib/iceweasel/res/forms.css /usr/lib/iceweasel/res/forms.css.bak
    $: cat firefox-form-widgets/res/forms-extra.css | sudo tee –append /usr/lib/iceweasel/res/forms.css > /dev/null
    $: sudo cp -r firefox-form-widgets/res/form-widgets /usr/lib/iceweasel/res
    $: rm -rf firefox-form-widgets*

    ma mentre su ubuntu epiphany si aggiornava automaticamente alla nuova grafica qui no

    help!

  23. Pingback:Migliorare (di più) la grafica dei controlli form di Firefox « Il blog di Andrea Lazzarotto

  24. Pingback:Grafica dei controlli in Firefox « Flynux

  25. Pingback:Swiftweasel + aspetto controlli + lingua ita « ILLuSioN…Chapter 22

  26. NinoRapis

    volevo migliorare l’aspetto del mio FireFox su Kubuntu 7.04.
    nel forum internazionale di ubuntu ho trovato:
    http://ubuntuforums.org/showpost.php?p=2206886&postcount=1
    . siccome sono ancora agli inizi dopo aver scaricato il file: firefox_widgets_2.4.tar.bz2 sul desktop non so più come proseguire. Ho letto il README ma non ho capito granchè , ho provato entrando nella cartella e digitando ./install -i da shell ma non è successo nulla!
    potreste aiutarmi?
    grazie

  27. Pingback:Fedora 7 « Frafra blog

  28. Pingback:Os-Blog » Blog Archive » Migliorare le widget di firefox in archlinux

  29. thehuge

    Come già detto da altri questa modifica crea alcuni problemi.
    Rende inutile la gestione delle regole css per tutti gli elementi dei form.

    Chiunque abbia un minimo di esperienza nell’utilizzo dei css saprà sicuramente che la compatibilità tra browser (in particolare IE) è una rogna. Questa modifica dimezza il vantaggio che Firefox ha (in ambito di rispetto degli standard W3C) rispetto ad IE.

    Evitatela, pleaze…

  30. gianni

    nel caso vogliate ottenere lo stesso effetto in seguito ad upgrade a Gutsy (tribe 5 al momento):

    wget http://users.tkk.fi/~otsaloma/art/firefox-form-widgets.tar.gz
    tar -xvzf firefox-form-widgets.tar.gz
    sudo cp /usr/share/firefox/res/forms.css /usr/share/firefox/res/forms.css.bak
    cat firefox-form-widgets/res/forms-extra.css | sudo tee –append /usr/share/firefox/res/forms.css > /dev/null
    sudo cp -r firefox-form-widgets/res/form-widgets /usr/share/firefox/res/
    rm -rf firefox-form-widgets*

    Sara’ cambiata la directory in cui vengono installati i file di supporto per firefox.

  31. Pingback:migliorare l’aspetto di Firefox anche in backtrack2! « <back|track~blog

  32. Savvatore

    ciao felipe non sapendo come mandarti una mail mi sembra meglio scrivere qua

    utilizzando lo stesso file da scaricare ecco le modifiche per GUSTY GIBBON

    cd ~/Desktop

    tar -xvzf firefox-form-widgets-mod.tar.gz

    sudo cp /usr/share/firefox/res/forms.css /usr/share/firefox/res/forms.css.backup

    cat firefox-form-widgets/res/forms-extra.css | sudo tee –append /usr/share/firefox/res/forms.css > /dev/null

    sudo cp -r firefox-form-widgets/res/form-widgets /usr/share/firefox/res

    rm -rf firefox-form-widgets*

  33. Savvatore

    felipe aspetto di sapere come inviare a te queste cose

    ciao cumpari catanisi!

    ho notato che su alcuni pc quella soluzione non risulta ottimale con controlli troppo grandi quindi

    scaricate widget 2.7 http://informatix.netsons.org/downloads/firefox_widgets_2.7.tar.bz2

    scompattatelo entate dentro la cartella e con un doppio clic su graphic_installer scegliere esegui

    apparirà una gui in cui dovrete selezionare solo dove nel pc risiede la cartella firefox

    che in gusty è in usr/share/firefox

    riavviare firefox e il tutto si risolve

Rispondi

%d blogger hanno fatto clic su Mi Piace per questo:
Vai alla barra degli strumenti