Userscript und Userstyle für Spiegel Online
22.08.2009 in: Browser, CSS, Javascript und Webdesign • 6 Kommentare
Letzte Änderung: 03.06.2010, 12:46 Uhr.
Der Spiegel hat sein Layout neulich renoviert. Im Prinzip eine gute Sache. Aber leider greift nun mein altes Userstylesheet nicht mehr. Zudem blinken Platzhalter für die Werbung in leuchtendem Grün – das finde ich fast genauso lästig wie die »Originale«.
Also habe auch ich renoviert. Zunächst das Userstylesheet:
/* Spiegel online */
*
{
text-decoration: none !important;
line-height: 1.5 !important;
min-width: none !important;
}
body,
.spArticleContent
{
width: auto !important;
margin: 0 !important;
float: none !important;
}
#spArticleColumn,
#spTeaserColumn
{
font: 16px/1.5 Georgia !important;
}
h1, h2, h3, h4
{
font-family: sans-serif !important;
}
#spArticleColumn *
{
height: auto !important;
}
#spArticleColumn object,
#spArticleColumn embed
{/* Videos */
height: 385px !important;
}
#spSmallTeaserColumn,
#spArticleFunctions
{
font: 13px/1.4 sans-serif !important;
}
#spArticleColumn a:link,
#spTeaserColumn a:link
{
color: #009 !important;
}
#spArticleColumn a:visited,
#spTeaserColumn a:visited
{
color: #900 !important;
}
a:link,
a:visited
{
text-decoration: underline !important;
}
#spSponsoredBy,
#spColumnAd,
#spFooter,
.spTop,
#spSocialBookmark,
.spMInline,
.spArticleCredit
{
display: none !important;
}
Und dann habe ich mir ein kleines Userscript geschrieben, das den Blinktext verhindert:
// ==UserScript==
// @name Werbung auf Spiegel Online blocken
// @namespace spon
// @include http://www.spiegel.de*
// ==/UserScript==
window.opera.defineMagicFunction(
'OAS_RICH',
function ()
{
return '';
}
);
Download Script und Stylesheet.
Beides habe ich nur in Opera getestet; insbesondere das Script müßte für Greasemonkey umgeschrieben werden, wenn es auch in Firefox funktionieren soll. Wer hat Lust dazu?
Vorher:
Nachher:
Bitte betrachtet diese Schnipsel so wie ich: Als kleine Provisorien ohne Anspruch auf allgemeine Zustimmung. Für mich haben sie meistens die Funktion eines mentalen Fingerknirschens, wenn ich längere Zeit – wie jetzt – fast nur mit Programmieren beschäftigt bin.
Euch mögen sie anregen oder belustigen. Wie ihr wollt.
Schöne Lösung für Opera. Opera-Nutzer werden sich über diesen Blogbeitrag mit dem Script und Stylesheet bestimmt freuen.
Als Firefox-Nutzer setze ich das Addon Adblock Plus zum Blockieren von Werbung ein. Damit ist für mich nicht nur die Spiegelseite werbefrei. ;-)
@Dieter: Stimmt, in Firefox braucht man dazu ein zusätzliches Plugin. Hatte ich ganz vergessen. ☺
Es gibt auch ein Plugin, mit dem man einigermaßen bequem seitenspezifische Stylesheets verwalten kann. Ich habe das irgendwann mal ausprobiert, konnte aber nicht herausfinden, wie man da vernünftig mit
@importarbeitet.Naja, AdBlock hält alle Seiten so gut wie Werbefrei, insofern ist es schon sinnvoll ein zusätzliches Plugin zu benutzen, anstatt bei jeder Seite aufwändig suchen zu müssen, wie die Elemente heißen.
Aber ein Userstylesheet existiert auch im Firefox und ist im Prinzip genau wie das von Opera. Dazu braucht man kein Plugin - im gegensatz zu Userscripts
@Struppi: Natürlich ist das Plugin sinnvoll; soweit ich sehe, arbeitet es wie Operas eingebauter Werbeblocker. Im Userstylesheet entferne ich nur noch die umgebenden Container, damit nicht allzuviele Lücken entstehen.
Wie funktionieren denn seitenspezifische Userstylesheets in Firefox ohne Plugin? Ich kenne @moz-document, aber kann man sich auch aus mehreren Stylesheets ein spezifisches zusammenstecken?
Ich benutze hier ein Userstylesheet-Framework (darüber will ich schon lange mal bloggen), das eben auf der Kombination mehrerer kleiner CSS-Dateien beruht. Als ich das vor einiger Zeit mal in Firefox probiert habe, hat das nicht so recht funktioniert; jetzt fehlt mir die Zeit dafür …
Also mit mehreren Dateien habe ich es nicht nicht probiert, aber bei Firefox kann man im Profilordner (heißt normal so ähnlich wie
x64mgqah.default) im Ordner chrome eine Datei mit dem NamenuserContent.csserstellen, deren Inhalt dann auf alle Seiten angewendet wird. Man kann auch Regeln nur für bestimmte Seiten erstellen. Ein paar Beispiele zu Verwendung der userContent.css.danke für diese lösung!
ansonsten benutze ich wie ein vorposter von mir schon geschrieben hat auch das adblock plugin, wenn ich mit dem firefox surfe.