Gelegentlich kommt’s ja vor, dass man an gewissen Blogs nicht mehr interessiert ist. Da ist es dann etwas lästig, wenn man deren Beiträge immer noch auf Planet Switzerland anschauen muss. Jetzt gibt es für dieses Problem endlich eine Lösung. chregu hat nämlich jedem Blogeintrag die ID des Blogs verpasst, und zwar so:
<div class="blog236786 box listView odd">
Jetzt kann man mit einem einfachen Benutzerstylesheet sämtliche Beiträge dieses Blogs bequem per CSS ausblenden. Benutzerstylesheets kann man auf verschiedene Weise integrieren; in Firefox macht man es am einfachsten mit der Stylish-Extension.
Wenn man dann z.B. den faden Metablogger nicht mehr lesen will, schaut man auf Planet Switzerland kurz nach der ID und gibt dann folgendes CSS ein:
.blog193033 {display:none !important;}
Und wenn man genug hat vom peinlichen Tagebuchgesülze auf Mattias:blog, setzt man halt noch einen drauf:
.blog193033, .blog4065 {display:none !important;}
Andererseits gibt’s ja auch Blogs, die man aufgrund ihrer Herzensgüte besonders schätzt. Diese Beiträge möchte man gerne besonders schnell sehen. Da bietet sich z.B. das hier an:
div.blog8383 div {
background-color:teal !important;
}
Es kann auch sein, dass man einen neuen Beitrag des Lieblings-Bloggers sehnlichst erwartet, weil er sich durch konsequente Recherchentiefe und Wahrheitsliebe einen Ehrenplatz in unserer internen Blograngliste erobert hat. Den möchte man vielleicht mit einem diskreten roten Ausrufezeichen markieren:
.blog179335 div.col1:before {
content:"!" !important;
color:red !important;
font-size:12px !important;
font-weight:bold !important;
}
Ihr seht: Der Möglichkeiten sind viele! Man muss sich auch keineswegs auf die Beiträge beschränken, sondern kann die Site ganz nach eigenem Belieben verändern, z.B. ein Header-Bild einfügen. Da empfiehlt es sich natürlich, die Änderungen nur für Blogug durchzuführen. Zu diesem Zweck verwendet man die freundlicherweise von Blogug verwendete spezifische ID des BODY Elements: <body id="blogug-ch">
body#blogug-ch #header {
background-image:url("http://www.linkelink.nl/images/wallpaper_final_fantasy_x_07_1280.jpg") !important;
position:absolute !important;
top:0px !important;
left:0px !important;
width:100% !important;
}
body#blogug-ch #nav li a:link, body#blogug-ch #nav li a:visited, body#blogug-ch #nav li a:hover {
color:white !important;
}
body#blogug-ch #nav li a:hover {
background-image:url("http://www.linkelink.nl/images/wallpaper_final_fantasy_x_07_1280.jpg") !important;
color:white !important;
}
Auf diese Weise lässt sich selbstverständlich jede Site den individuellen Vorlieben anpassen. Hier ein paar Links:
- Meine erste intensive Beschäftigung mit Benutzerstylesheets hat mir Eric Meyers Artikel The CSS Anarchist’s Cookbook beschert (deutsche Übersetzung: Kochbuch für CSS-Anarchisten).
- Benutzerstylesheets für Safari sind hier erklärt, wo auch gleich del.icio.us gestylt wird: Styling del.icio.us
- Es gibt sogar eine Website, die sich ganz diesem Thema widmet: userstyles.org.
- Stylish-Extension für Firefox
4 Comments
und wer versteckt sich hinter blog8383 und blog179335?
@chm: Ausprobieren, dann siehst Du’s früher oder später :-).
:-)
diese antwort habe ich erwartet. bin eben zu faul um nachzusehen…
@chm
Auswendig lernen!