Inhalt einer Seite kompakter gestalten

Zitat von Zitronella

dass 3 Posts nebeneinander angezeigt werden?

Hallo Zitronella

wenn du magst dann teste bitte mal:

@-moz-document domain("smihub.com") {
    
.content__img-wrap,
.wrap_add,
.content__img {
  max-width: 350px !important;
  padding-left: 5px !important;
}
}

Die Werte musst du dir wenn dann noch anpassen.

Oder auch so:

@-moz-document domain("smihub.com") {

.content__img-wrap {
  max-width: 350px !important;
  padding: 8px !important;   
  height: 850px !important;
}
}

Dann wären die 3 Beiträge immer auf gleicher Höhe nebeneinander.

Je nach Größe/Höhe der Beiträge, bleibt unten ein leerer Bereich im Feld übrig.

Den kannst du mit 850px anpassen, wie es bei dir eben besser aussieht.

Freut mich wenn ich dir damit helfen konnte, war gern geschehen

Zitat von Zitronella

nicht mehr zur Login Seite weiter geleitet wird.

Nach Klick auf einen Beitrag:

Zitat von Zitronella

oben bei dem Kreuz schließen und den Beitrag trotzdem sehen?

Nein, dann lande ich wieder auf der Startseite.

Zitat von Zitronella

Habe mit

https://addons.mozilla.org/de/firefox/addon/redirector/ eine Weiterleitung für Instagram auf Smihub eingerichtet.

Einfach instagram.com zu smihub.com oder muss man das noch genauer machen?

Zitat von Zitronella

sieht bei mir so aus

Danke. Das funktioniert dann anscheinend auch für die einzelnen Beiträge. Ich meine mich nämlich zu erinnern, dass bei denen in Instagram noch ein /p/ wie Posting im Adresspfad erschien, während ich im obigen Beispiel Mozilla ein /c/ entdecke.

Nachtrag einen Tag später: Ich bemerkte dann gestern selbst, dass meine Anfrage keine Rolle spielt, weil SmiHub nicht die originale Zeichenfolge aus der Adresse für die einzelnen Beiträge übernimmt, so dass man die Weiterleitung nur für Konten einrichten kann.

Zitronella , 2002Andreas
Ich kam gestern endlich dazu, mir das mal selbst genauer anzuschauen. Aufbauend auf Andreas’ Code (Beitrag #3) hab ich das Ergebnis, denke ich, verbessert:

.content__item {
	max-width: 350px;
	padding: 5px;
	height: 850px;
	margin: 5px;
	overflow: auto;
}
.content__item.ads { display: none }

Statt overflow: auto könnte man auch overflow: hidden nehmen; das ist einfach eine Frage dessen, was man will. Die letzte Zeile ist natürlich optional. Bei mir mit aktivem uBlock blendet sie nur eine Linie aus, die vom Anzeigenblock übrig bleibt.

Zitat von Zitronella

Danke, wobei ich keinen großen Unterschied sehe, hab ich mal deinen Code genommen.

Es ging vor allem um den Textüberlauf. So etwas fällt natürlich nur dann auf, wenn es viel Text gibt. Ich habe aber selbst bemerkt, dass meine Variante nicht der Weisheit letzter Schluss sein kann, denn der Balken, in dem steht, wie viele Leute einen Daumen hoch gegeben, wie viele kommentiert haben und wie alt das Beitrag ist, dieser Balken wanderte plötzlich beim Scrollen mit hoch und überdeckte Text. Deshalb meine geänderte aktuelle Version mit für mich passenden Werten (mit URL-Präfix statt Domain):

@-moz-document url-prefix("https://smihub.com/v/") {
	.content__item {
		max-width: 350px;
		padding: 5px;
		margin: 5px;
	}
	.content__text {
		height: 450px;
		overflow: auto;
	}
	.content__item.ads { display: none }
}

Vor allem die Höhe muss man sich individuell anpassen. Letzte Zeile immer noch optional. Wenn jetzt aber die Vorschaubilder nicht gleich groß sind, dann hat man wieder versetzte Kacheln, gerade heute bei https://smihub.com/v/tagesspiegel/ zu beobachten.

Ich hab mir auch die Seite mit den Postings angepasst:

@-moz-document url-prefix("https://smihub.com/c/") {
	.col-md-6, .col-sm-10 {
		flex-basis: 75%;
		max-width: 75%;
	}
	.offset-md-3, .offset-sm-1 {
		margin-left: auto;
		margin-right: auto;
	}
}

Ich bin mir über die „richtigen“, für mich optimalen Werte selbst noch nicht sicher, ich hatte es auch schon noch bildschirmfüllender eingestellt. Statt der Prozente, die sich auf die Fensterbreite Containerbreite*) beziehen, kann man auch feste Angaben machen (Vorgabe für beide Eigenschaften ist übrigens nur 50%). Die col- und offset-Selektoren werden bei verschiedenen Fenstergrößen aktiv (@media-Regeln).

*) Die maximale Containerbreite (Selektor .container) muss ich nicht einstellen. Es kann aber bei sehr großen Bildschirmen etwas sein, das man eventuell beeinflussen will.

Zitat von Zitronella

Edit: jetzt gehts mit mehr History, lag wohl an der Seite selbst.

Ja, da hakt es offensichtlich immer wieder mal, auch beim Aufruf einzelner Beiträge. Es muss im Hintergrund ja immer bei Instagram angefragt werden.

Nochmal hierzu:

Zitat von Zitronella

Habe mit

https://addons.mozilla.org/de/firefox/addon/redirector/ eine Weiterleitung für Instagram auf Smihub eingerichtet.

Ich habe ein Userskript gefunden, das die Weiterleitung zu SmiHub auch für Links auf Postings durchführt (was mit dem Redirector nicht gelingen kann wegen der unterschiedlichen Pfade), und zwar vor allem auch für den häufigen Fall, dass sie eingebettet dargestellt werden!

Das Skript findet man bei Greasy Fork unter Bypass Instagram Login Redirects.

Ich nutze Violentmonkey, da manche meiner Scripts mit Tampermonkey nicht funktionierten.

https://addons.mozilla.org/en-US/firefox/addon/violentmonkey/

Zitat von Zitronella

Ich komme wohl doch nicht um Tampermonkey drum rum, oder gibt es was anderes/besseres für Skripte?

Auch ich nutze Violentmonkey, weil ich besser damit klar komme. Teste doch einfach mal beide. Im Detail gibt es durchaus Unterschiede zwischen den bekannten Monkey-Addons, was dazu führen kann, dass eines mit Tampermonkey funktioniert, mit den anderen aber nicht (oder umgekehrt). Bei Violentmonkey wird auf jeden Fall aktiv entwickelt und auch auf so etwas regiert (siehe Aktivität in GitHub). Ich habe kürzlich noch FireMonkey entdeckt, das ich aber wegen anderer Limitierungen nicht nutzen kann.

Zitat von Zitronella

Auf jeden Fall funktioniert es sehr gut und ich habe den Redirector wieder entfernt.

Wenn Du Lesezeichen zu Instagram-Konten besitzt, solltest Du ihn wieder aktivieren. Ich habe bei mir jedenfalls festgestellt., dass dieses Skript dann nicht greift.