Webseite schmaler machen, Hilfe dabei

Platos

Hallo,

Ich versuche auf dieser Webseite (für mich) unnötige Spalten zu entfernen (die 2 ganz rechts): https://www.forum-3dcenter.org/vbulletin/index.php

Das Ding ist: Ich finde nichts, womit ich die ganzen Spalten löschen kann.

Daraus ergeben sich für mich 2 Fragen:

1. Seht ihr eine Möglichkeit, die ganzen Spalten zu löschen? Also das ist ja so ne Art Tabelle. Ich finde aber nichts, wie ich quasi 2 Spalten davon löschen kann.

2. Wenn es so nicht geht, muss ich wohl jede Zelle einzeln löschen. Wenn ich mittels Entwicklerwerkzeuge die einzelne zelle auswähle und links dann "knoten Löschen" wähle, löscht sich dieser. Aber wie kriege ich das nun hin mittels CSS ? Also was muss ich schreiben, dass sich der Knoten löscht?

Und vor allem: muss ich dann jeden Knoten einzeln löschen oder kann ich das irgendwie kombinieren?

Sorry für die Anfängerfragen, aber ich komme gerade nicht weiter.

Edit: Also ich habe jetzt mit den Entwicklerwerkzeugen mal alle Knoten dieser 2 Zeilen gelöscht und dann passt sich alles ideal an (also die Spalten verschwinden und alles passt sich der Breite an).

Die Frage wäre also wirklich: Wie lösche ich alle Knoten mittels CSS und wie schreibe ich das möglichst einfach (also so, dass ich nicht hundert mal für jede Zelle den ganzen Code wiederholen muss) ?

Denn es ist eine riesen Arbeit sonst: Weil es geht nicht nur um diese Seite. Weil jedes Unterforum da auf der Seite hat wieder diese 2 Spalten. Also z.B dieses hier: https://www.forum-3dcenter.org/vbulletin/forumdisplay.php?f=43

2002Andreas

Zitat von Platos

unnötige Spalten zu entfernen (die 2 ganz rechts):

Meinst du das so?

Wenn ja, dann teste bitte mal:

CSS

@-moz-document url("https://www.forum-3dcenter.org/vbulletin/index.php") {

tr:nth-child(n+1) > td:nth-child(4),
tr:nth-child(n+1) > td:nth-child(5) {
  display: none !important;
}
}

@-moz-document domain("forum-3dcenter.org") {
td.thead:nth-child(5),
#threadbits_forum_43 > tr:nth-child(n+1) > td:nth-child(6) {
  display: none !important;
}
}

Alles anzeigen

.DeJaVu

Zitat von Platos

Seht ihr eine Möglichkeit

Inspector -> "Untersuchen"

What are browser developer tools? - Learn web development | MDN

Every modern web browser includes a powerful suite of developer tools. These tools do a range of things, from inspecting currently-loaded HTML, CSS and…

developer.mozilla.org

bzw

Page Inspector — Firefox Source Docs documentation

Zitat von Platos

unnötige Spalten zu entfernen (die 2 ganz rechts)

userChrome.css

CSS

@-moz-document domain("forum-3dcenter.org") {
.content-corner .page div table:nth-of-type(3) td:nth-of-type(4),
.content-corner .page div table:nth-of-type(3) td:nth-of-type(5)
{
    display: none !important;
}
}

So auch in Stylus zu importieren.

"Element", nicht "Knoten"

2002Andreas

Zitat von .DeJaVu

So auch in Stylus zu importieren.

Das passt dann aber nicht auf den Unterseiten

Platos

Ja, danke, genau so meine ich das. Inzwischen habe ich herausgefunden, wie es geht (deins ist besser...):

Code

td.thead:nth-child(5) {
display: none;
}

#collapseobj_forumbit_40 > tr:nth-child(1) > td:nth-child(4), tr:nth-child(2) > td:nth-child(4), tr:nth-child(3) > td:nth-child(4), tr:nth-child(4) > td:nth-child(4), tr:nth-child(5) > td:nth-child(4), tr:nth-child(6) > td:nth-child(4), tr:nth-child(7) > td:nth-child(4), tr:nth-child(8) > td:nth-child(4), tr:nth-child(9) > td:nth-child(4), tr:nth-child(10) > td:nth-child(4), tr:nth-child(11) > td:nth-child(4), tr:nth-child(12) > td:nth-child(4) {
display: none;
}

#collapseobj_forumbit_1 > tr:nth-child(1) > td:nth-child(5), tr:nth-child(13) > td:nth-child(5),#collapseobj_forumbit_1 > tr:nth-child(14) > td:nth-child(5) {
display: none;
}

#collapseobj_forumbit_15 > tr:nth-child(1) > td:nth-child(5) {
display: none;
}

#collapseobj_forumbit_121 > tr:nth-child(1) > td:nth-child(5) {
display: none;
}

#collapseobj_forumbit_29 > tr:nth-child(1) > td:nth-child(5) {
display: none;
}

#collapseobj_forumbit_5 > tr:nth-child(1) > td:nth-child(5) {
display: none;
}

Alles anzeigen

Kannst du mir erklären, warum du niemals

Code

#collapseobj_forumbit_5

und ähnliches verwenden musst? Also damit ich es verstehe.

Edit: Ja, auf den Unterseiten passt es nicht, wenn ich die ganze domain nehme. Aber Schritt für Schritt

2002Andreas

Zitat von Platos

Inzwischen habe ich herausgefunden, wie es geht

Zitat von Platos

Kannst du mir erklären

Ich suche immer nach dem kürzesten Text, manchmal funktioniert es dann nämlich auch

Freut mich wenn es jetzt so ist, wie du es gerne wolltest.

Zitat von Platos

auf den Unterseiten passt es nicht

Darum habe ich es in meinem Code auch getrennt.

Platos

Naja also es hat geklappt, aber würdest du mir erklären, wie man das code-mässig macht? Also was bewirkt das, wenn du diesen Teil weg lässt:

Code

#collapseobj_forumbit_5

Also das und mit anderen Zahlen wie der 5. Bedeutet dein code, dass dieser auf alle angewendet wird ? Der Code von dir funktioniert nämlich, wenn ich ihn nur auf diese eine Seite (die Hauptseite) beschränke. Die Unterforen muss ich dann noch alle schauen, wie die gehen.

2002Andreas

Zitat von Platos

Die Unterforen muss ich dann noch alle schauen, wie die gehen.

Sieht hier damit so aus:

Ich habe noch etwas verändert in dem Code:

CSS

@-moz-document url("https://www.forum-3dcenter.org/vbulletin/index.php") {

tr:nth-child(n+1) > td:nth-child(4),
tr:nth-child(n+1) > td:nth-child(5) {
  display: none !important;
}
}

@-moz-document domain("forum-3dcenter.org") {
td.thead:nth-child(5),
tr:nth-child(n+1) > td:nth-child(6) {
  display: none !important;
}
}

Alles anzeigen

Platos

Edit: Und hat jemand ne Ahnung, wie ich bei Stylus verschiedene Teile des Skripts auf verschiedene Webseiten beziehen kann? Also ich meine das da:

Code

@-moz-document url("https://www.forum-3dcenter.org/vbulletin/index.php")

Weil das übernimmt es mir nie bei Stylus. Der Teil wird dann einfach raus gelöscht und bei Stylus wählt man ja normalerweise unten aus, für welche Webseite man das haben will. Aber dann kann ich für das ganze Skriipt eben nur die selbe Webseite verwenden.

Wenn ich jetzt aber in einem Skript gewisse Teile des Codes nur für bestimmte Webseiten nutzen will, wie geht das mit Stylus ?

Ich möchte es mit Stylus verwenden, weil ich das sehr bequem ein- und ausschalten kann (also nicht bei Firefox selbst).

Edit 2: Post #9 kann man ignorieren. Ich habe ein Copy-paste fehler gemacht. Geht wunderbar bei Stylus.

Und danke. ich werde es mir ansehen dein neuer Code. Funktioniert soweit gut. Ich werde gleich berichten.

2002Andreas

Zitat von Platos

Geht wunderbar bei Stylus.

Ergänzend dazu:

Platos

Danke nochmals für die Hilfe.

Ich glaube, jetzt klappt alles. Und ja, bei Stylus wird das automatisch "umgewandelt" (habe am Anfang nur einen Copy-Paste Fehler gemacht). Habe jetzt auch gesehen, dass man da auf "Hinzufügen" klicken kann.

Habe jetzt den Code von dir nochmals erweitert auf:

CSS

@-moz-document url("https://www.forum-3dcenter.org/vbulletin/index.php"), url(https://www.forum-3dcenter.org/vbulletin/) {

tr:nth-child(n+1) > td:nth-child(4),
tr:nth-child(n+1) > td:nth-child(5) {
  display: none !important;
}
}

@-moz-document domain("forum-3dcenter.org") {
td.thead:nth-child(4), td.thead:nth-child(5),
tr:nth-child(n+1) > td:nth-child(5), tr:nth-child(n+1) > td:nth-child(6) {
  display: none !important;
}
}

Alles anzeigen

So wird auch in den Unterforen die "Antworten" Spalte rausgelöscht.

Edit: Habe den Code noch aktualisiert. Es braucht die beiden url. Die mit index.php ruft man auf, wenn man sich angemeldet hat. Wenn man aber von der Hauptseite ins Forum wechselt, ist es die 2. URL.

2002Andreas

Zitat von Platos

So wird auch in den Unterforen die "Antworten" Spalte rausgelöscht.

.DeJaVu

Zitat von 2002Andreas

Das passt dann aber nicht auf den Unterseiten

hmm, dein CSS ist sehr allgemein, ich denke gerne spezifischer.

Wegen #5, den CSS-Pfad zu kopieren, ist suboptimal, weil das nur für die jeweilige Seite gilt. Etwas CSS-Kenntnisse und dann wird es leichter.

Allerdings bin ich nur als Gast unterwegs und mit meinem CSS sehe ich auch in Unterforen als auch in Threads rechts das wichtigste. "Letzter Beitrag" halte ich für wichtig, wie auch in diesem Forum.

Ohne Anmeldung sehe ich da momentan keinen Grund, weiter zu investieren, sorry.

Platos

Naja, es macht aber die Sache wesentlich einfacher und schneller. Und man kann ja eben mit verschiedenen Webseiten arbeiten.

Aber es geht ja jetzt mit dem Code aus #11 sowohl angemeldet als auch als Gast. Habe es ausprobiert.

Letzter Beitrag halte ich auch für wichtig (das brauche ich schlieslich, um direkt zum letzten Beitrag zu springen). Das funktioniert mit dem Code aus #11 aber auch alles.

2002Andreas

Zitat von Platos

sowohl angemeldet als auch als Gast.

Sehr schön, denn das ist nicht überall so.

Zitat von Platos

Das funktioniert mit dem Code aus #11 aber auch alles.

Nur das zählt

Platos

Ich hätte noch eine letzte Frage (ich stelle sie gleich hier, weils grad auch um Stylus ging):

Wie kann ich mit

Code

@-moz-document

alle URLs beginnend mit "URL" mit einbeziehen? Also ich will (bei ner anderen Sache), dass sich der ganze Code auf Webseiten bezieht, die mit einer bestimmten URL beginnen. Also z.B alle URLs, die mit "HTTPS://TESTEST.COM/" beginnen.

Geht das?

Edit: Habe es rausgefunden. Es geht damit:

Code

@-moz-document url-prefix ()

Wobei dann in der Klammer die URL steht.

Will man mehrere Links nutzen, muss man es so machen:

Code

@-moz-document url(), url()

Bzw. mit "url-prefix" oder "domain"

.DeJaVu

von eben für die Spalten

CSS

@-moz-document domain("forum-3dcenter.org") {
.content-corner .page div table:not(#threadslist):nth-of-type(3) td:nth-of-type(4),
.content-corner .page div table:not(#threadslist):nth-of-type(3) td:nth-of-type(5),
form#inlinemodform tbody > tr td.alt1:nth-of-type(5),
form#inlinemodform tbody > tr td.alt2:nth-of-type(6),
table#threadslist tbody tr td.thead:nth-of-type(4),
table#threadslist tbody tr td.thead:nth-of-type(5)
{
    display: none !important;
}

}

Alles anzeigen

Stylus zeigt das so beim Export an, innerhalb Stylus hast du unterm CSS die Bereiche zu definieren, 5 als Auswahl, die entsprechend zu moz-document beim Export werden, und beim Import auch so erkannt werden. So zB auch @-moz-document regexp()

Doku dazu

@document - CSS: Cascading Style Sheets | MDN

The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style…

developer.mozilla.org

(ist ein veralteter Artikel, wird evtl auch gelöscht, oder umgeleitet, aber da steht auch, was was bewirkt)

(fällt unter die "at rules"

At-rules - CSS: Cascading Style Sheets | MDN

At-rules are CSS statements that instruct CSS how to behave. They begin with an at sign, '@' (U+0040 COMMERCIAL AT), followed by an identifier and includes…

developer.mozilla.org

Webseite schmaler machen, Hilfe dabei

Ähnliche Themen

FF Profil auf anderen Rechner portieren?

Firefox mit Startpage Abstürze und kurzeitig schwarzer Bildschirm

Datenschutz & Sicherheitseinstellungen - Ausnahmen

Menüleiste schmaler machen

Lesezeichen Weltkugel ändern.

Clipping Mask funktioniert nicht in Firefox aber in jedem anderen Browser