Automatische Größenanpassung von verlinkten Grafiken

 
badMoon
Benutzer
Avatar
Geschlecht:
Herkunft: Nettetal / NRW
Alter: 71
Homepage: musikzirkus.eu
Beiträge: 241
Dabei seit: 02 / 2013
Betreff:

Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 21.09.2013 - 13:33 Uhr  ·  #1
Hallo in die Runde,

in unserem Musikforum werden in verschiedenen Threads oft Verlinkungen zu CD-Covern auf Amazon genutzt. Dies ist mit amazon abgesprochen und legal.

Nun hat amazon seit einiger Zeit offensichtlich so große CD-Cover, dass diese in den Threads fast die komplette Breite eines Threads beanspruchen. Ist es möglich, die verlinkten Bilder automatisch auf eine vordefinierte Größe zu bringen, bspw. 300 x 300 px?

Hier einmal ein Beispiellink, damit verständlicher wird, was ich meine:

Beispiellink für große Grafik
cback
Admin
Avatar
Geschlecht:
Herkunft: Saarland
Alter: 39
Homepage: cback.net
Beiträge: 17726
Dabei seit: 12 / 2003
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 23.09.2013 - 12:57 Uhr  ·  #2
Hallo badMoon,

also soweit ich sehe sind die Covergrafiken zwar groß, aber sprengen zumindest Dein Forum nicht. Ein globaler Trick Bilder allgemein per CSS zu limiten käme daher vermutlich für Dich nicht in Frage, da es ja immerhin auch noch Threads gibt, in denen größere Bilder erwünscht wären.

Mein Alternativvorschlag wäre, dass Du im ACP einen neuen BBCode namens [cover]Grafiklink[/cover] anlegst und diesen dann statt dem IMG Tag benutzt um Covergrafiken einzubinden (oder eben Deine User). Das geht auch ganz einfach im CF3:

- gehe ins ACP und klicke dort links auf "Beiträge" und dann auf "BBCodes Verwalten"
- klicke dann auf "BBCode Assistent" (kleiner Doppelpfeil darunter)

Gebe in die Felder dann folgendes ein:
BBCode Tag ohne klammern: cover
Codetext: Covergrafik
Beschreibung: Covergrafik in das Forum einbinden
Vollständiges Erkennungsschema: [cover]{URL}[/cover]
HTML Ersetzungsschema: <img src="{URL}" width="200" alt="" title="" />


Gebe statt der 200 bei width="200" die gewünschte Breite des Bildes an. Alle Bilder werden auf genau diese Größe gepackt.

Sofern Du nur eine Maximalgröße definieren willst und kleinere Bilder nicht hochstrecken möchtest gib stattdessen das hier ein:

<img src="{URL}" style="max-width:200px" alt="" title="" />


in diesem Fall wären die 200 die maximalbreite eines Bildes, kleinere Bilder werden aber nicht ausgedehnt.


Speichere den BBCode und dann sollte es das schon gewesen sein. ;)


LG,
Chris
badMoon
Benutzer
Avatar
Geschlecht:
Herkunft: Nettetal / NRW
Alter: 71
Homepage: musikzirkus.eu
Beiträge: 241
Dabei seit: 02 / 2013
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 23.09.2013 - 18:07 Uhr  ·  #3
cback
Admin
Avatar
Geschlecht:
Herkunft: Saarland
Alter: 39
Homepage: cback.net
Beiträge: 17726
Dabei seit: 12 / 2003
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 24.09.2013 - 13:07 Uhr  ·  #4
badMoon
Benutzer
Avatar
Geschlecht:
Herkunft: Nettetal / NRW
Alter: 71
Homepage: musikzirkus.eu
Beiträge: 241
Dabei seit: 02 / 2013
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 17.05.2025 - 15:57 Uhr  ·  #5
Hallo Chris,

vor 12 Jahren hatte Deine Lösung bestens funktioniert, aktuell klappt das einfach nicht.

Auf der Portalseite sollen die Coverabbildungen mit einer pixelbreite 160 angezeigt werden. Entsprechend Deiner Anleitung habe ich wieder einen bb-Code erstellt. Jetzt wird, sobald ich den Code im Editor benutze, statt des Covers der Code angezeigt. Hat sich seit dem Systemwechsel etwas geändert?

Und, wie muss der Code aussehen, wenn das Cover linksbündig ausgerichtet werden soll?

So habe ich den Code eingegeben, siehe auch den Bildanhang:

BBCode Tag ohne klammern: P_Cover
Codetext: PortCover
Beschreibung: Portalcover
Vollständiges Erkennungsschema: [cover]{URL}[/cover]
HTML Ersetzungsschema: <img src="{URL}" width="160" alt="" title="" />


Schalte ich aus dem Editor in die Vorschau um, sieht das dort so aus:

[P_Cover]https://m.media-amazon.com/images/I/81uw-Md8RNL._SL1500_.jpg[/P_Cover]

Vorab besten Dank und hab ein schönes Wochenende,

LG,
Wolfgang
Der an diesem Beitrag angefügte Anhang ist entweder nur im eingeloggten Zustand sichtbar oder die Berechtigung Deiner Benutzergruppe ist nicht ausreichend.
cback
Admin
Avatar
Geschlecht:
Herkunft: Saarland
Alter: 39
Homepage: cback.net
Beiträge: 17726
Dabei seit: 12 / 2003
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 19.05.2025 - 12:17 Uhr  ·  #6
Hallo Wolfgang,

geändert hat sich da nichts, aber Du hast Fehler in Deiner Syntax.

Zunächst einmal würde ich bei solchen Codes (ohne Plugin-BBCode, der Parameter erwartet) empfehlen, dass Du den BBCode immer ohne Sonderzeichen anlegst. In diesem Fall also dann einfach alles kleingeschrieben:

pcover


Dann hast Du im Feld "Vollständiges Erkennungsschema" immer noch nur cover stehen. Auch dort müsstest Du entsprechend pcover eintragen, und zwar in beiden Fällen, also auch beim schließenden Tag natürlich.


Aktuell greift Dein "älterer" BBCode cover und der neue macht nichts mehr, weil er das selbe Erkennungsschema (cover statt pcover) anwendet.

Das klappt dann natürlich nicht. :)

Viele Grüße,
Chris
badMoon
Benutzer
Avatar
Geschlecht:
Herkunft: Nettetal / NRW
Alter: 71
Homepage: musikzirkus.eu
Beiträge: 241
Dabei seit: 02 / 2013
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 19.05.2025 - 12:25 Uhr  ·  #7
...ich kann gar nicht gemeint sein O-)

Noch eine Nachfrage, ...was muss ich im BBCode angeben bzw. wie lautet die Zeile, damit das Cover immer mit einer Breite von 160 px angezeigt wird?

Thx and have a nice day :-) ,
Wolfgang
cback
Admin
Avatar
Geschlecht:
Herkunft: Saarland
Alter: 39
Homepage: cback.net
Beiträge: 17726
Dabei seit: 12 / 2003
Betreff:

Re: Automatische Größenanpassung von verlinkten Grafiken

 · 
Gepostet: 19.05.2025 - 12:37 Uhr  ·  #8
Hey Wolfgang,

eigentlich hast Du das mit Deinem width="160" im HTML Ersetzungscode schon korrekt gemacht, alternativ geht auch style="width:160px;". Beachte aber, dass bei kleinen Bildschirmen die Responsive Codes das Bild noch etwas verkleinern, sollte 160px auch nicht möglich sein, aber 160px Platz sollte überall sein.

Wenn Du das Bild immer in einer neuen Zeile zeigen möchtest, könntest Du auch noch einen DIV Block drumrum machen:
Code
<div style="uk-text-center uk-display-block uk-margin-small-bottom"><img src="{URL}" style="width:160px;" alt="" title="" /></div>


Wenn Du es links haben möchtest aus dem uk-text-center ein uk-text-left machen.


LG,
Chris
Gewählte Zitate für Mehrfachzitierung:   0

Registrierte in diesem Topic

Aktuell kein registrierter in diesem Bereich

Die Statistik zeigt, wer in den letzten 5 Minuten online war. Erneuerung alle 90 Sekunden.