Skip to content

Firebug 1.9 - Top Erweiterung für Webentwickler mit Neuerungen

Firebug zählt schon lange zu den Top 10 Erweiterungen des Firefox Browsers. Kein anderes Add-on erlaubt es so komfortabel Code oder Webseiten zu untersuchen, daneben können HTML oder CSS angepasst und Seiten auf Geschwindigkeit untersucht werden.

firebug

Es gibt fast Nichts was der kleine Helfer nicht kann, mit der neuen Version 1.9 sind einige Verbesserungen dazu gekommen.

Es gibt eine ausführliche Beschreibung mit Screenshots der Neuerungen. Interessierte können sich zusätzlich durch den Release Log lesen oder das Wiki durchforsten.

Version 1.9 bringt kleine aber praktische Neuerungen mit sich und sollte auch in Zukunft auf keinem Entwickler Rechner fehlen.

Sollte sich Firebug nicht automatisch aktualisieren, kann die Feuerwanze hier heruntergeladen werden.

Einfach eigene Themes für Google Chrome online erstellen

Im Januar hatte ich einen Artikel veröffentlicht, in dem ich euch das Erstellen von Themes für Google Chrome etwas näher bringen wollte. Den Kommentaren dort ist zu entnehmen, dass einige mit der manuellen Themeerstellung so ihre Probleme haben. Meistens hängt an es an der manifest Datei oder beim endgültigen Packen des Themes.

Für diejenigen die einen einfacheren Weg wählen möchten, gibt es inzwischen ein praktisches Online Tool. Sozusagen ein Chrome Theme Creator mit dem ihr einfach euer eigenes Theme zusammen klicken könnt und keine Programmierkenntnisse benötigt. Ich möchte euch heute zeigen wie das Schritt für Schritt funktioniert.

Eigenes Chrome Theme online erstellen

  • Chrome Theme Creator aufrufen und einen Theme Namen vergebene. Wir nennen es "ITrig"
  • Bei Bedarf kann noch eine Beschreibung vergeben werden "ITrig zeigt wies geht"

chrome-theme-creator

  • Der erste Reiter ist nun schon erfolgreich ausgefüllt und wir können auf "Images" wechseln
  • Hier gibt es nun verschiedene Frames, d.h. einzelne Bereiche der Browser Oberfläche, die ihr individuell anpassen könnt. Sobald ihr mit der Maus über einen Framebereich fahrt, wird dieser auf der rechten Seite mit einem roten Rahmen hervorgehoben und ihr wisst was gemeint ist.
    • theme_frame: Bereich hinter den Tabs
    • theme_toolbar: Aktueller Tab samt Toolbar (sollte mindestens 119 Pixel hoch sein)
    • theme_tab_background: Inaktive Tabs
    • theme_ntp_background: Haupthintergrund
    • theme_frame_overlay: Bild das links oben im Eck erscheint
    • theme_button_background: Toolbar Schaltflächen
    • theme_ntp_attribution: Bild das unten "erstellt von" anzeigt
    • theme_window_control_background: Hintergrund für Kontrollschaltflächen wie "vergrößern" oder "schließen"
  • In unserem Fall möchten wir den Hintergrund anpassen, sowie das Bild für "Design von" einbinden
  • Passt ein hochgeladenes Bild nicht, könnt ihr es per Klick wieder löschen. Sollte es von der Größe nicht passen, können diese in meinem alten Artikel nachgelesen werden.

chrome-theme-creator-bilder

  • Nachdem wir nun ein Logo und ein Hintergrundbild eingefügt haben, können wir zum nächsten Reiter "Color" wechseln. Hier können einzelnen Farben weiter angepasst werden.
  • Sobald man einen Bereich ändern möchte, klickt man auf die jeweilige Farbe und kann einen neuen Farbton aus einer Farbauswahl wählen. Zusätzlich werden kleine Infos zum jeweiligen Bereich eingeblendet

chrome-theme-creator-farben

  • Sind alle Farben angepasst kann in den "Tint" Bereich gewechselt werden. Hier handelt es sich um einzelne Farbtöne die in den Bereichen Buttons, Frames, inaktive Frames oder Hintergrund Tab angepasst werden können.

chrome-theme-creator-farbtoene

  • Im letzten Schritt muss das Theme noch gepackt werden. Das kann im Reiter "Pack" erledigt werden. Dort gibt es folgende Optionen
    • Packen und installieren
    • Packen und Theme downloaden
    • Packen und Zip downloaden
    • Zip hochladen

chrome-theme-creator-packen

  • Abschließend kann nun das neue Theme bewundert oder bei Bedarf als ZIP Datei direkt bearbeitet werden. Diese beinhaltet die manifest.json und alle verwendeten Bilder. Der Chrome Theme Creator kann natürlich ebenfalls verwendet werden auch den Upload von Dateien unterstützt.
  • Wer das eben erstellte Theme verwenden möchte, der kann es gerne downloaden

chrome-theme-ITrig

via