Board-Style - nachträglich anpassen

[Vera]

Hallo,

durch die Forumsumstellung, die mir sehr große Probleme bereitet, bin ich froh eine Art Ausweg gefunden zu haben und möchte Euch hier einige wichtige Links und Tips gebündelt zusammenstellen.

Mit Hilfe eines Browser-Addons (Greasymonkey für FireFox u. Opera) lassen sich individuell editierbare UserScripts einbinden, mit denen sich Erscheinung und Funktionen von InternetSeiten beeinflussen lassen. Diese MEIN.user.js Scripts installieren sich ihrem @Namen nach unter:
Windows: \AppData\Roaming\Mozilla\Firefox\Profiles\0yzh9x2p.default\gm_scripts
Unix: /home/user/.mozilla/firefox/wom2gf5k.default/gm_scripts
können direkt editiert werden und die Ergebnisse zeigen sich sofort mit dem folgenden Reload der entsprechenden Homepage. Ebenso unmittelbar lassen sich diese Scripts auch deaktivieren oder löschen.

Im Forum finden sich schon einige hilfreiche Scripts:
Code ausblenden ~ [Greasemonkey] [subsilver2] PBB Optimizer ~ I would like the search form to defaults to TOPICS again.

Im Netz:
The weblog about Greasemonkey ~ über Greasemonkey ~
Dive Into Greasemonkey: Tutorium DE ~ Tutorial EN & DLs


Um Euch einen Eindruck und indirekte Tips zur Style-Anpassung zu geben hier meine ersten zwei bunten Scripts:
(Hinweis: weniger gemacht, um schön durchdesignt zu sein, als Hinweise zu geben
(kopieren & speichern als ???.user.js, drop auf Browser mit installiertem Addon)

für SubSilverPlus (Subsilver2)

Code: Alles auswählen

// ==UserScript==
// @name           PB Forum Styler2
// @namespace      veras~Styler2
// @description    adjust CSS styles of PB forum
// @include        http://www.purebasic.fr/german/*
// 
// ??? include        http://www.purebasic.fr/english/*
// ??? include        http://purebasic.com/english/*
// ??? include        http://www.purebasic.fr/french/*
// ??? include        http://forums.purebasic.fr/german/*
// 
// anwendbar für SubSilverPlus / SubSilver2
// Hinweis: erster Kommentarteil zeigt jeweils die Orginalwerte an
// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

addGlobalStyle('body { ' +
'background-color: #afcafc; ! important;' + // FFFFFF   Haupt - Hintergrund
'color: #741e55; ! important;' + // 323D4F  globale Textfarbe
'font-size: 62.5%; ! important;' + // 62.5%    globale Schrift-Größe vergrößern / verkleinern
'}'+
'.codecontent { ' +
'font-size: 1.0em; ! important;' + //  0.85em   Code-Schrift-Größe vergrößern / verkleinern
'}'+
'#wrapmain { ' +
'background-color: #eaeaeb; ! important;' + // F7F8FC   innerer Seiten - Hintergrund
'}'+
'#wrapheader { ' +
'background-image: none; ! important;' + // Bild abwählen, da es die Farbe überdeckt
'}'+
'th { ' +
'background-color: #385651; ! important;' + // 006699   Tabellen - Kopf 
'background-image: none; ! important;' + // Bild abwählen, da es die Farbe überdeckt
'}'+
'.tablebg { ' +
'background-color: #8ad3c6; ! important;' + // FFFFFF   zeigt sich nur als Trennlinien
'border : 3px solid #385651; ! important;' + // 1px a3bad5  Tabellen - Rahmen
'}'+
'.catdiv { ' +
'background-color: #8ad3c6; ! important;' + // white ...   Hintergrund leerer Zellen, u.a. ???
'background-image: none; ! important;' + // Bild abwählen, da es die Farbe überdeckt
'}'+
'.cat { ' +
'background-color: #8ad3c6; ! important;' + // C7D0D7   Rubrik Hintergrund
'background-image: none; ! important;' + // Bild abwählen, da es die Farbe überdeckt
'}'+
'.row1 { ' +
'background-color: #ffd734; ! important;' + // EAEDF4   Topic Spalte (1-2) & Posting Hintergrund
'}'+
'.row2 { ' +
'background-color: #ffdf5e; ! important;' + // EAEDF4   Inhalt Spalten (3-5) & Posting Hintergrund
'}'+
'.row3 { ' +
'background-color: #8ad3c6; ! important;' + // CEDCEC   Rubrik Hintergrund (Unterforen)
'}'+
'.spacer { ' +
'background-color: #385651; ! important;' + // CEDCEC   Extra - Zeile Posting-Abstand
'}'+
'a:link { ' +
'color: #398813; ! important;' + // allg. Linkfarbe, diese färbt auch die User
'font-weight: bold; ! important;' + // hinzugefügt, um die Userlinks hervorzuheben
'}'+
'a.forumlink { ' +
'color: #004f76; ! important;' + // 006699   Topic Links der Haupt-Übersicht
'}'+
'a.topictitle { ' +
'color: #004f76; ! important;' + // hinzugefügt, um klassische TopiclinkFarbe zu erhalten  
'}'+
'a.topictitle:visited { ' +
'color: #004f76; ! important;' + // 5493B4   (try 7f888c  eb888c)
'font-weight: normal; ! important;' + // bold   geändert, da deutlicher als blasse Färbung 
'}'
);

für ProSilver (& Avas wieder nach rechts verlagert)

Code: Alles auswählen

// ==UserScript==
// @name           PB Forum Styler1
// @namespace      veras~Styler1
// @description    adjust CSS styles of PB forum
// @include        http://www.purebasic.fr/german/*
// @include        http://www.purebasic.fr/english/*
// ??? include        http://www.purebasic.fr/french/*
// work with ProSilver
// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

addGlobalStyle('html, body { ' +
'background-color: #efefef; ! important;' + // f2f6f8
'}'+
'a:link { ' +
'color: #387051; ! important;' +  // to color user-names
'font-weight: bold; ! important;' +  // to highlight user-names
'}'+
'ul.forums { ' +
'background-color: #ffdf5e; ! important;' +  // Topic-row color
'background-image: none ; ! important;' +  //  to deselect image, as it overlayed the color
'}'+
'li.row:hover { ' +
'background-color: #ffee91; ! important;' +  // use same color as 'ul.forums' to stop hovereffekt
'}'+
'.headerbar { ' +
'background-color: #2a82b7; ! important;' +  // ebebeb  top-table with BP-logo
// 'background-image: none ; ! important;' +  // 
'}'+
'.navbar { ' +
'background-color: #b8d7ea; ! important;' +  // b8d7ea
'}'+
'.forabg { ' +
'background-color: #387051; ! important;' +  // Table - bordering  on main-overview 
'background-image: none ; ! important;' +  // disable imgage to display color
'}'+
'.forumbg { ' +
'background-color: #387051; ! important;' +  // 12A3EB   Table - bordering on topic-overviews
'background-image: none ; ! important;' +  // disable imgage to display color
'}'+
'ul.topiclist li { ' +
'color: #741e55; ! important;' +  //   added color of topic-describtion 
'}'+
'.postbody { ' +
'float: right; ! important;' +  // left  move ava+user-info to the left side again
'}'+
'.bg1 { ' +
'background-color: #ffdf5e; ! important;' +  // f7f7f7  posting background
'}'+
'.bg2 { ' +
'background-color: #ffee91; ! important;' +  // f2f2f2   posting background
'}'
);

für Spass & Erleichterung ~ ~ Vera

[helpy]

Mit Greasemonkey ist einiges möglich!

Wer jedoch nur das Stylesheet geringfügig ändern möchte, kann das auch mit Stylish machen (Beispiel: Im prosilver Style die Profiles links anzeigen).

cu, guido

[bobobo]

nicht roamingfähiger frickelkram

[edel]

Das ganze funktioniert auch mit Google Chrome. Chrome einfach mit --enable-user-scripts starten und die Scripte nach "AppData\Local\Google\Chrome\User Data\Default\User Scripts\" kopieren.

[Falko]

nicht roamingfähiger frickelkram

+1

[bobobo]

funktioniert mit meinem lieblingsbrowser (lynx) auch gar nicht

[Falko]

Warum postet ihr die Userscripts nicht gleich hier hin?

http://userscripts.org/

Gruß Falko

[Little John]

nicht roamingfähiger frickelkram

Na ja, für "Gespenster-Roaming" (durch Wände gehen und so) ist's glaub ich auch nicht gedacht.

SCNR, Little John

//edit: Um Missverständnisse zu vermeiden: Dies ist eine völlig sinnfreie Albernheit ohne jeden Zweck (in Anspielung auf den Avatar von bo*3).

[Vera]

@helpy @edel
Danke für Eure konstruktiven Hinweise. So kann man sich vorab über die verschiedenen Methoden erkundigen und dann eine individuell passende aussuchen.
Ich habe mir erlaubt Eure Hinweise auch im englischen Forum weiter zu geben, und hoffe, dass es o.k. ist.


Anmerkung um weiteres Missverständis zu verhindern:
dieser Thread war nicht dazu gedacht, um irgendjemanden zu veranlassen, sich ein 'exotisches' Styling aufzubauen, um dann ggf. orientierungslos zu werden, wenn es an einem fremden Rechner nicht verfügbar ist, sondern, um mit möglichen individuellen Unannehmlichkeit umgehen zu können, bis diese vielleicht in den endgültigen Style-Variationen behoben sein werden.
Ebenso sind die oben geposteten Scripte nur Beispiele, die nicht durchkonzipiert und damit auch nicht zur Weitergabe via userscripts.org geeignet sind.

Zudem würd' ich mit freuen, wenn die ein oder andere spezielle Lösung hier mit allen geteilt werden könnte.

Grüße ~ Vera

[edel]

Hier mal ein kurzes Script um Mr. Green endlich loszuwerden

Code: Alles auswählen

// ==UserScript==
// @name              	
// @description      	
// @include      	*viewtopic.php*

// ==/UserScript== 

var len = document.getElementsByTagName("img").length;

for (var i = 0;i < len;i ++)
{
	var node = document.getElementsByTagName("img")[i];
	
	if (node.src.match(/.*?mrgreen\.gif/))
	{
		node.parentNode.removeChild(node);
	}
}