Mini-Tutorial: Usernews-Überschriften selbst vergrößern (plus Beispieldateien und -Screenshot)

Foren-Suche
Pro-Gamer: Hat den ultimativen GamersGlobal-Rang 30 erreichtPlatin-Gamer: Hat den sehr hohen GamersGlobal-Rang 25 erreichtNews-Redaktion: Hat von der Redaktion weitere Rechte für das News-Redigieren erhaltenDieser User unterstützt GG seit fünf Jahren mit einem Abonnement.Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertGold-Jäger: Hat 75 Erfolge erreicht -- Wahnsinn!Gold-Gamer: Hat den GamersGlobal-Rang 20 erreichtGold-Cutter: Hat 100 Videos gepostetGG-Gründungsfan: Hat in 2009 einmalig 25 Euro gespendetAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertScreenshot-Meister: Hat 5000 Screenshots hochgeladenDebattierer: Hat 5000 EXP durch Comments erhaltenRedigier-Guru: Hat 5000 EXP fürs Verbessern von Beiträgen gesammeltIdol der Massen: Hat mindestens 10.000 Kudos bekommenExtrem-Schreiber: Hat mindestens 1000 News geschriebenDieser User hat an der Weihnachtsfeier 2016 teilgenommen
ChrisL (30 Pro-Gamer, 140399 EXP)
User ist offline. Zuletzt gesehen vor 6 Stunden 13 Minuten Offline
Beigetreten: 29.7.2009
Inhalte: 4242

[Es ist einfach und geht schnell. Wirklich.]
 
 
Hallo zusammen,

in den letzten Tagen habe ich wieder öfter gelesen, dass die User-News seit dem 2015er Relaunch für manch einen untergehen, zu unauffällig beziehungsweise schwierig(er) zu erkennen sind etc. pp. Das ist alles Ansichtssache, weshalb sich darüber auch nur ganz schwer streiten lässt.

Sollte das jemanden aber tatsächlich (massiv) stören, dann kann dagegen etwas getan werden. Es muss nur minimal Zeit investiert werden – und der Wille vorhanden sein, an einem vielleicht unbefriedigendem Umstand etwas ändern zu wollen. Und nö, ich möchte jetzt nicht darüber diskutieren, dass das Aufgabe von GG ist, so etwas anzupassen, weil – ihr wisst schon ... siehe oben – das auch Geschmackssache ist. wink
 
 
Wie ... auch ... immer — legen wir los:

Im Folgenden zwei (von mehreren) Varianten, wie ihr in der Desktop-Version des Firefox-Browsers die Überschriften der User-News auf der Startseite von GG für euer persönliches Surfverhalten anpassen könnt. Beide Vorgehensweisen haben ihre Vor- und Nachteile. Chrome, Internet Explorer oder Safari werden an dieser Stelle nicht behandelt, die Möglichkeiten sind aber vergleichbar.

Im Beispiel wird die Schriftgröße an jene der Top-News angeglichen. Da das Standard-Schwarz bei dieser Größe mMn sehr dominant ist, wird außerdem die Farbe der Überschriften geändert. Zu guter Letzt muss auch die Darstellung der Kommentarzahl angepasst werden.

— Variante über die userContent.css (Firefox)

Wie der Name es schon andeutet, könnt ihr in dieser Datei Änderungen für das Aussehen von Websites hinterlegen, die die ausgelieferten Stile des Website-Betreibers überschreiben (können). Diese Variante dürfte die simpelste sein, da für unsere Änderungen nichts weiter als eine Textdatei benötigt wird.

Spoiler:

— Variante mittels des Addons Greasemonkey (Firefox)

Diese Variante eignet sich eher für jene, die bereits andere Userscripts nutzen, wie zum Beispiel das von nova, mit denen in den Kommentarsträngen der Inhalt des jeweiligen "Vater-Kommentars" angezeigt wird.

Spoiler:

— So sieht das Ergebnis beider Varianten aus

Spoiler:

— Abschließendes

Zu erwähnen ist, dass es natürlich noch andere Addons wie Stylish gibt, mit denen das Beschriebene umgesetzt werden kann. Bei Interesse lassen sich genug Tutorials finden, die ausführlicher und viel besser sind als mein Geschreibsel.

Eine Gewähr, dass sich die Änderungen nicht auch anderweitig auf das Layout auswirken (was aber nicht der Fall sein dürfte) oder dass sich trotz Tests irgendwo Fehler eingeschlichen haben, übernehme ich nicht. Auch beziehen sich die Anpassungen bewusst nur auf die GG-Startseite. Und klar, wer eine bessere Variante in petto hat oder wem ein Fehler aufgefallen ist, der möge sich melden.

CSS ist sehr mächtig und bietet viele, viele Möglichkeiten – das hier Beschriebene ist daher nur ein äußerst geringfügiges Kratzen an der Oberfläche ... Ich teste zum Beispiel gerade für mich selbst, ob mir eine rote Hintergrundfarbe zur Anzeige, dass neue Kommentare hinzugekommen sind, mehr zusagt. smilie

Falls ihr die Änderungen ausprobiert: Viel Erfolg.

Gruß

Chris

____________________________________

GG-Online-Spielereien:  ➜ GEK #1  ➜ GEK #2   |   DU-Community-Projekt:  ➜ Anmeldethread  ➜ Statistiken

Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertBronze-Jäger: Hat Stufe 5 der Jäger-Klasse erreichtLoyalist: Ist seit mindestens einem Jahr bei GG.de dabeiKommentierer: Hat 100 EXP mit Comments verdientVorbild: Hat mindestens 100 Kudos erhaltenSammler: Hat mindestens 50 Spiele in seiner Sammlung
DerMitdemTee (13 Koop-Gamer, 1270 EXP)
User ist offline. Zuletzt gesehen vor 16 Stunden 51 Minuten Offline
Beigetreten: 8.10.2010
Inhalte: 13

Schöne Optimierung! Hab es eben ausprobiert und macht das "Augenfiltern" auf der Startseite auf jeden Fall angenehmer smilie

Dank deinem Tutorial weiß ich nun auch endlich wie ich den Seitenrand auf kleinen Bildschirmen mit ein wenig padding versehen kann. Hat mich schon immer gestört, dass ab 1280px der Inhalt der Seite ohne Abstand an den Browserrand gedrückt wird.

Edit: Hab in dem Fall einigen Elementen einfach 2% padding von links aus gegeben:

Spoiler:

Edit 2: Habe gerade meine Forenänderungen herausgekramt die ich vor ein paar Jahren mal vorgeschlagen hatte. Und tatsächlich funktionieren die mit deiner userContent.css Methode ziemlich gut! Ich musste auf meinem Mac Firefox einige Male neu starten damit die Änderungen wirksam wurden. Cache leeren etc. hat leider nichts bewirkt. Aber ich bin auch laie, also kann ich nicht genau sagen wann und wie die Änderungen übernommen werden.

Ich hoffe ich infiltriere deinen Thread nicht Chris, aber wer die Startseite des GG-Forums etwas aufatmen lassen will, der kann das mit den folgenden (oder ähnlichen) Änderungen versuchen (wahrscheinlich nicht mobiloptimiert bzw. responsiv):

Spoiler:

Sieht dann ungefähr so aus:

Spoiler:
Pro-Gamer: Hat den ultimativen GamersGlobal-Rang 30 erreichtPlatin-Gamer: Hat den sehr hohen GamersGlobal-Rang 25 erreichtNews-Redaktion: Hat von der Redaktion weitere Rechte für das News-Redigieren erhaltenDieser User unterstützt GG seit fünf Jahren mit einem Abonnement.Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertGold-Jäger: Hat 75 Erfolge erreicht -- Wahnsinn!Gold-Gamer: Hat den GamersGlobal-Rang 20 erreichtGold-Cutter: Hat 100 Videos gepostetGG-Gründungsfan: Hat in 2009 einmalig 25 Euro gespendetAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertScreenshot-Meister: Hat 5000 Screenshots hochgeladenDebattierer: Hat 5000 EXP durch Comments erhaltenRedigier-Guru: Hat 5000 EXP fürs Verbessern von Beiträgen gesammeltIdol der Massen: Hat mindestens 10.000 Kudos bekommenExtrem-Schreiber: Hat mindestens 1000 News geschriebenDieser User hat an der Weihnachtsfeier 2016 teilgenommen
ChrisL (30 Pro-Gamer, 140399 EXP)
User ist offline. Zuletzt gesehen vor 6 Stunden 13 Minuten Offline
Beigetreten: 29.7.2009
Inhalte: 4242
DerMitdemTee schrieb:

Ich hoffe ich infiltriere deinen Thread nicht Chris ...

Kein Thema. smilie

DerMitdemTee schrieb:

... musste auf meinem Mac Firefox einige Male neu starten damit die Änderungen wirksam wurden.

Das hat mich irgendann zu sehr genervt, weshalb ich dann doch auf ein Addon umgestiegen bin.

Vor ein paar Monaten hatte ich mir den "Nach oben"-Link, der sich ganz unten auf der Startseite befindet, dahingehend angepasst, dass er auf der rechten Seite fixiert dargestellt wird, sodass ich immer Zugriff auf ihn habe und somit mittels Klick nach, äh, oben gelange. wink Bei Interesse kann ich den Code zur Verfügung stellen.

Getestet hatte ich auch mal einen fixierten Header -- der also beim Nach-unten-Scrollen nicht verschwindet --, aber das hat mich dann doch eher gestört, weshalb ich es wieder verworfen habe.

Am Rande: Nur, um das nochmal deutlich zu machen: Das Anfangsposting bzw. dieser Thread soll nur dazu dienen, um ein wenig zu zeigen, wie man Anpassungen vornehmen kann, durch die der ganz persönliche Geschmack vielleicht eher getroffen wird. Für Kritik am Layout gibt es andere, besser geeignete Stellen.

____________________________________

GG-Online-Spielereien:  ➜ GEK #1  ➜ GEK #2   |   DU-Community-Projekt:  ➜ Anmeldethread  ➜ Statistiken

Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertBronze-Jäger: Hat Stufe 5 der Jäger-Klasse erreichtLoyalist: Ist seit mindestens einem Jahr bei GG.de dabeiKommentierer: Hat 100 EXP mit Comments verdientVorbild: Hat mindestens 100 Kudos erhaltenSammler: Hat mindestens 50 Spiele in seiner Sammlung
DerMitdemTee (13 Koop-Gamer, 1270 EXP)
User ist offline. Zuletzt gesehen vor 16 Stunden 51 Minuten Offline
Beigetreten: 8.10.2010
Inhalte: 13

Sorry. Was Kritik am Layout angeht, hätte ich meinen ersten Abschnitt vielleicht etwas freundlicher/neutraler formulieren können. Ich hab natürlich meine Änderungen aus dem selben Grund hier geteilt. Um jemandem der die Seite etwas für sich selber aufmischen will ein css snippet zu geben.

Aber zum Rest: Also für mich wäre der nach Oben link definitiv hilfreich, also nur her damit smilie. Optionen zu haben ist immer gut, auch für alle die hier reinschauen. Ist ja nichts anderes als Usern bei phpBB mehrere Themes zur Auswahl zu geben (das nur als Beispiel). Manche freunden sich dann spontan mit Buttonset 1 an, andere mit Buttonset 2.

Achja:

ChrisL schrieb:

Das hat mich irgendann zu sehr genervt, weshalb ich dann doch auf ein Addon umgestiegen bin.

Ist Greasemonkey also etwas schneller im aktualisieren? Ich mag es ja eigentlich gerne selber an CSS und HTML dateien herum zu friemeln, aber wenn Greasemonkey direkt aktualisiert, dann steige ich eventuell auch um.

Pro-Gamer: Hat den ultimativen GamersGlobal-Rang 30 erreichtPlatin-Gamer: Hat den sehr hohen GamersGlobal-Rang 25 erreichtNews-Redaktion: Hat von der Redaktion weitere Rechte für das News-Redigieren erhaltenDieser User unterstützt GG seit fünf Jahren mit einem Abonnement.Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertGold-Jäger: Hat 75 Erfolge erreicht -- Wahnsinn!Gold-Gamer: Hat den GamersGlobal-Rang 20 erreichtGold-Cutter: Hat 100 Videos gepostetGG-Gründungsfan: Hat in 2009 einmalig 25 Euro gespendetAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertScreenshot-Meister: Hat 5000 Screenshots hochgeladenDebattierer: Hat 5000 EXP durch Comments erhaltenRedigier-Guru: Hat 5000 EXP fürs Verbessern von Beiträgen gesammeltIdol der Massen: Hat mindestens 10.000 Kudos bekommenExtrem-Schreiber: Hat mindestens 1000 News geschriebenDieser User hat an der Weihnachtsfeier 2016 teilgenommen
ChrisL (30 Pro-Gamer, 140399 EXP)
User ist offline. Zuletzt gesehen vor 6 Stunden 13 Minuten Offline
Beigetreten: 29.7.2009
Inhalte: 4242
DerMitdemTee schrieb:

Sorry. Was Kritik am Layout angeht, hätte ich meinen ersten Abschnitt vielleicht etwas freundlicher/neutraler formulieren können.

War gar nicht auf dich bezogen, sondern als ganz allgemeiner Hinweis gedacht. smilie

DerMitdemTee schrieb:

Ist Greasemonkey also etwas schneller im aktualisieren?

Jepp, schneller in dem Sinne, dass du den Browser (im meinen Fall Firefox auf Win 10) nicht neu starten musst, was bei mehreren geöffneten Tabs echt störend ist. Änderungen an einem Greasemonkey-Userscript werden in der Regel direkt umgesetzt (wie du es ja schon geschrieben hast), nachdem die betreffende Seite neu geladen wurde.

DerMitdemTee schrieb:

Ich mag es ja eigentlich gerne selber an CSS und HTML dateien herum zu friemeln ...

Ja, ich auch. Aber ob nun in einer echten CSS- oder in einer JS-Datei mit CSS-Anweisungen ist zumindest in dem Fall egal. smilie

Wegen des Top-Links melde ich mich später nochmal, gerade bissel wenig Zeit.
 
 
➜ Edit:

Nachfolgend die CSS-Anweisungen, durch die der ursprünglich am Ende der Seite angezeigte Top-Link dauerhaft auf der rechten Seite dargestellt wird:

Spoiler:

Den Code nutze ich seit mehreren Jahren; es ist daher nicht ausgeschlossen, dass es inzwischen auch anders umzusetzen geht. Die Position der Box muss wahrscheinlich an die eigene Browser-Größe angepasst werden; Hintergrundfarbe, Hover-Effekt usw. können natürlich nach Belieben verändert werden.

Und noch ein Hinweis: Der Original-Text-Link, der sich am Seitenende über dem Impressum-Link befindet, wird nicht mehr angezeigt, da er ja entsprechend angepasst wurde (nur, falls sich jemand wundern sollte).

Hier noch das Ergebnis (siehe rechte Seite zwischen den Bildern):

Spoiler:

Inzwischen möchte ich diesen Top-Link nicht mehr missen ... wink

____________________________________

GG-Online-Spielereien:  ➜ GEK #1  ➜ GEK #2   |   DU-Community-Projekt:  ➜ Anmeldethread  ➜ Statistiken

Platin-Gamer: Hat den sehr hohen GamersGlobal-Rang 25 erreichtNews-Redaktion: Hat von der Redaktion weitere Rechte für das News-Redigieren erhaltenDieser User unterstützt GG seit sechs Jahren mit einem Abonnement.Alter Haudegen: Ist seit mindestens 5 Jahren bei GG.de registriertGold-Jäger: Hat 75 Erfolge erreicht -- Wahnsinn!Gold-Gamer: Hat den GamersGlobal-Rang 20 erreichtGG-Gründungsfan: Hat in 2009 einmalig 25 Euro gespendetAlter Haudegen: Ist seit mindestens 3 Jahren bei GG.de registriertMeister-Poster: Sammelte 5000 EXP durch ForumspostsDebattierer: Hat 5000 EXP durch Comments erhaltenRedigier-Guru: Hat 5000 EXP fürs Verbessern von Beiträgen gesammeltSilber-Jäger: Hat Stufe 10 der Jäger-Klasse erreichtSilber-Archivar: Hat Stufe 10 der Archivar-Klasse erreichtDieser User hat uns an Weihnachten 2013 mit einer Spende von 10 Euro unterstützt.Dieser User hat uns an Weihnachten 2012 mit einer Spende von 12 Euro unterstützt.Dieser User hat uns an Weihnachten 2011 mit einer Spende von 11 Euro unterstützt.
John of Gaunt (Community-Moderator, 59349 EXP)
...
User ist offline. Zuletzt gesehen vor 5 Stunden 2 Minuten Offline
Beigetreten: 4.11.2009
Inhalte: 732

Schöne Sache! Mal gucken, ob ich mir das die Tage in den FF packe.

____________________________________

Offizieller Community-Moderator von GamersGlobal.de

Kommentar hinzufügen

Neuen Kommentar abgeben
(Antworten auf andere Comments bitte per "Antwort"-Knopf.)