Jak na soubory userChrome.css a userContent.css v uživatelském profilu

Po představení konfiguračního souboru user.js bych vám rád ukázal další dva konfigurační soubory – userChrome.css a userContent.css.Pojem konfigurační soubor zde ale není úplně přesný. Už přípona souboru naznačuje, že se jedná spíše o soubory formátovací.

Oba soubory patří do podadresáře chrome ve vašem uživatelském profilu. Podobně jako soubor user.js však standardně neexistují a v případě potřeby je musíte vytvořit. Ve stejném podadresáři můžete též nalézt soubory userChrome-example.css a userContent.css-example.css, které jsou takovou krátkou ukázkou možností použití těchto dvou souborů.

Poznámka: Pokud ve vývojové verzi Firefoxu vytvoříte nový uživatelský profil, podadresář chrome se v něm standardně nevytvoří. Musíte jej tedy vytvořit sami.

Nyní k významu obou souborů. Soubor userChrome.css slouží k úpravě uživatelského rozhraní aplikací Mozilla. Díky němu můžete například změnit šířku pole vyhledávání, změnit pořadí lišt či realizovat ledajakou jinou úpravu. Celé rozhraní aplikace je totiž formátováno CSS styly, které lze tímto způsobem upravovat. Jediné, co k tomu potřebujete, je vědět id či class jednotlivých prvků grafického rozhraní. Přehled těch základních naleznete v Knowledge Base MozillaZine. Zbývající můžete zjistit pomocí DOM Inspektoru.

Druhý soubor, userContent.css, slouží k úpravám zobrazovaných webových stránek. Čeho můžete docílit? Přes tento soubor například můžete zakázat blikající prvky na stránce, pohyblivý text či třeba vycentrovat konkrétní stránku.

Příklady

Teorie je jedna věc, důležitá je ovšem praxe. Uvedu ukázky obou souborů. Nejprve userChrome.css:

/* Tento řádek musí být vždy na začátku souboru uveden */
@namespace
url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* Odstranění tlačítka pro zavírání panelů */
tabbrowser .tabs-closebutton-box {display: none;}

/* Chceme lištu se záložkami na více řádků */
#bookmarks-ptf {display:block}
#bookmarks-ptf toolbarseparator {display:inline}

/* Přidání obrázku na pozadí lišt */
menubar, toolbox, toolbar, .tabbrowser-tabs {
  background-image: url("background.gif") !important;
  background-color: none !important; 
}

/* Skrytí volby Odeslat odkaz z místní nabídky nad odkazem */ 
#context-sendlink {
  display: none;
}

A nyní ukázka userContent.css:

/* Zakázání tagu marguee – běžící text */
marquee {
  -moz-binding: none; display: block; height: auto !important;
}

/* Vynucení podtržení všech odkazů na webech */
a {text-decoration: underline !important}

/* Změna kurzoru nad JavaScriptovými odkazy */
a[href^="javascript:"] {
   cursor: move;
}

Kde hledat další informace

Výše jsem uvedl několik ukázek k čemu je dobré tyto soubory využít, ale možností je samozřejmě podstatně více. To už je však nad rámec tohoto úvodu, a proto vás odkáži na celou řadu zajímavých stránek, které se týkají obsahu těchto souborů.

Přečtěte si také:

Komentáře

1. Roj
Na userstyles.org se vubec nevyznam
Nevis, jak zmenit cokliv na konkretni domene? Konkretne mi jde o barvu necitelnych imputu a textarei.
(problem popsan na http://roj.bloguje.cz/212116-stylujeme-formulare.php )
, ale chci si to vyresit sam u sebe.

2. JasnaPaka
Podle mě to půjde přes následující konstrukci:
@-moz-document domain(domena.cz) {...}
Cokoliv dáš dovnitř, bude platné pouze pro tu doménu. Každopáně jsem to nezkoušel.

3. Roj
FUNGUJE!!!!
Jsi uzasny, svkely, bozi.
konkretne toto:
@-moz-document domain(flickr.com) {
input, textarea {color:#000; background-color:#fff;}
}
vyresilo muj problem

4. SlovakSoft
Ak by sa náhodou niekomu nedarilo nastavenie viacriadkového panela záložiek (na konci prvého riadka bude len šípka a ďalšie riadky sa neobjavia), experimentujte s názvymi tých záložiek - skracujte ich alebo predlžujte, prípadne ich myšou presúvajte. On sa ten panel na viacerých riadkoch nakoniec objaví.

5. Duk (www)
Nějak to nechápu :-(

6. VS
Dobrý den, rád bych si zkusil pohrát s tím, že bych u Sunbirdu nastavil, aby se zrušená událost (se statutem Cancelled) zobrazovala přeškrtnutá a zrušené úkoly aby byly také přeškrtnuté (stejně jako splněné) a nezobrazovaly se, pokud zaškrtnu ,,Hide completed tasks``. Z popisu a přečtení materiálů jsem pochopil, že potřebuji DOM inspector, ale mám dojem, že pro Sunbird 0.5 (nějaké RC apod) neexistuje (respektive nenašel jsem ho ani v produktu, ani na stránkách rozšíření). Nemáte, prosím, nějaký tip, kde by se našel?

7. v6ak
Já jsem na mozilla addons našel DOMI pro TB, asi by stačilo změnit GuID a verzi a něco málo overlay.

8. abc
ahoj, pokud chci větší složku lišty záložek, tak mám udělat tohle ? :
otevřít si poznámkový blok, vložit tam tento kod -

@namespace
url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#bookmarks-ptf {display:block}
#bookmarks-ptf toolbarseparator {display:inline}

uložit ho jako userChrome.css, hodit do složky chrome a bude to fungovat jo ?
zkoušel jsem to takhle, ale nic, prosím o radu ! díky

9. v6ak
[8] Možná stačí restart.

10. Ing. Jaromír Zavřel
Dva řádky lišty záložek viz:

http://xmaestro.com...ku=2007120035

/* Double toolbar */
#bookmarks-ptf {
display:block !important;
}
#PersonalToolbar:not([collapsed]) #bookmarks-ptf > toolbarbutton {
visibility: visible !important;
}
#bookmarks-stack {
overflow: visible !important;
}
#bookmarks-stack > .bookmarks-toolbar-overflow-items {
display: none !important;
}

11. Pegu
Ono je jednoduché napsat "vytvořte soubor,vložte do něj atd." ale je nás začátečníků více a já např.nejsem schopen nijak dostat tu stránku Poznámkového bloku do Chrome!Ctrl C,Ctrl V nebo kopírovat/vložit nefunguje.Nevím jak udělat to,aby při kliknutí na userCrome se to neotevřelo jako normální složka ale aby vyjel před Chrome ten poznámkový blok do kterého se ty data mají vložit.Ale ani jinak mi nefunguje kopírování ze stránky Maestro do Chrome(Ctrl C/Ctrl V),potřebné nápisy jsou šedivé!Mám snad blbě nějaké nastavení ve Windows?

Přidat komentář

K tomuto příspěvku není možné přidávat další komentáře.