forum.mozilo.de das Supportforummozilo Forum
Willkommen Gast. Bitte einloggen oder registrieren. Haben Sie Ihre Aktivierungs E-Mail übersehen?

Einloggen mit Benutzername, Passwort und Sitzungslänge

Autor Thema: Erweiterung des Syntaxelementes "Bild"  (Gelesen 3225 mal)

0 Mitglieder und 1 Gast betrachten dieses Thema.

 

Offline Werner

  • Mitglied
  • *
  • Beiträge: 55
  • Mozilo-Lehrling und Nichtprogrammierer
    • Profil anzeigen
    • Modern Gospel & POP
Erweiterung des Syntaxelementes "Bild"
« am: 05. Januar 2016, 05:37:58 »
Neben den Galerien müssen bei mir Bilder, um eine übersichtliche Optik zu erhalten, mal die eine oder andere Größe haben.

Schön wäre, wenn man nur ein Bild hochladen müsste, die Größe aber in z.B. Pixel zusätzlich mitgäbe.

bisherige Syntax
[bild|@=Inner Wheel:Sonorities_Konzertkarte1.png=@]

gewünschte Syntax mit z.B. Breite (700 Pixel) und Höhe (323 Pixel)
[bild|700x323|@=Inner Wheel:Sonorities_Konzertkarte1.png=@]

Derzeit muss ich die Bilder mehrfach hochladen und, wenn es nicht passt, noch einmal scalieren und wieder hochladen, es endlich passt.

Das wäre ein "nice to have".

Viele Grüße
Werner
Werner (Warweg)
 

 

Offline maiemi

  • Betatester
  • Mitglied
  • ***
  • Beiträge: 355
    • Profil anzeigen
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #1 am: 05. Januar 2016, 22:49:30 »
Hallo Werner,
Du könntest Dir bis auf Weiteres behelfen, indem Du ein eigenes Syntaxelement anlegst.
Die HTML Syntax ist, wie hier und hier beschrieben.
« Letzte Änderung: 05. Januar 2016, 22:51:05 von maiemi »

denkt Euch selber eine Signatur aus :-)
 

 

Offline Paul

  • Mitglied
  • *
  • Beiträge: 68
    • Profil anzeigen
    • SKYWALK-WEBDESIGN
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #2 am: 08. Januar 2016, 12:56:35 »
Auf jeden Fall scheint mit die Mitgabe von Breite und Höhe eher kontraproduktiv. dann muss ich ja jedes Mal einen Rechner bemühen, um die Proportionen zu erhalten und Verzerrungen zu Vermeiden.
Website: BPGS.DE
 

 

Offline Werner

  • Mitglied
  • *
  • Beiträge: 55
  • Mozilo-Lehrling und Nichtprogrammierer
    • Profil anzeigen
    • Modern Gospel & POP
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #3 am: 08. Januar 2016, 15:34:23 »
Du hasr Recht, Paul, wenn Du beide Werte nimmst.

Ich meinte, dass beide Maximalwerte sind.

Also:
  • Bild berechnen
  • prop. Scalieren auf Höhe
  • Bild prüfen, wenn passt, o.k. wenn nicht passt bei beiden max. Werten --> prop. scalieren auf Breite

Viele Grüße
Werner
Werner (Warweg)
 

 

Offline maiemi

  • Betatester
  • Mitglied
  • ***
  • Beiträge: 355
    • Profil anzeigen
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #4 am: 09. Januar 2016, 13:21:30 »
Es reicht, wenn nur ein Wert (der, welcher Dir "wichtiger" ist) mitgegeben wird. Ausserdem müssen das nicht absolute Angaben (Pixel, Zentimeter) sein, sondern es kann auch Prozent angegeben werden.
Natürlich gehört ein wenig "Gehirnschmalz" in die Gestaltung des Templates / Layouts der Website, damit eventuelle Größenänderungen die Website noch gut aussehen lassen. Stichwort "Floating Layout". Das ganze mit CSS realisiert und man ist auf der sicheren Seite.....

denkt Euch selber eine Signatur aus :-)
 

 

Offline supercat

  • Mitglied
  • *
  • Beiträge: 142
    • Profil anzeigen
    • http://www.motourist.de
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #5 am: 20. Januar 2016, 10:35:42 »
Ich will mal kurz den Einwurf von "maiemi" aufgreifen. Das Layout einer Seite soll diese strukturieren. Darum verstehe ich nicht, weshalb ein bunter Reigen verschiedener Bildergrößen die Optik übersichtlicher machen soll? Das widerspricht eigentlich allen Layout-Regeln. Wenn es denn aber unbedingt sein muss, würde ich auch entsprechende Syntax-Elemente anlegen. Und da reicht es in der Tat, lediglich den wichtigen Wert mitzugeben - sollen die Bilder immer gleich breit oder gleich hoch sein?

Aber selbst wenn jemand ein Plugin für variable Bildergrößen entwickeln würde, ist es doch etwas fummelig, oder? Jedes Mal muss nachgeschaut werden, wie die Maße des Bildes sind und dann müssen diese Maße im Editor eingetragen werden. Da lauert der Fehlerteufel an jeder Ecke - falsche Zahl gemerkt, Zahlendreher...

Einfacher ist wohl, sich ein paar benutzerdefinierte Syntaxelemente anzulegen. ein Beispiel:
bild01 = <div id="bild01"><img src="{VALUE}"></div>
Hier wird ein normales Bild genommen und auf die entsprechende Größe skaliert. Die ist in der "style.css" hinterlegt:
        #bild01 {
                 max-width:30%;
         float:right;
         border:0px solid;
                 color:#000000;
         margin-top:5px;
         margin-left:5px;
                 }
Bei der Verwendung eines reponsivem Designs bitte Prozentangaben nehmen ("em" wäre auch noch in Ordnung). Nur bei festem Layout Pixel-Angaben nehmen. Auf diese Weise musst Du Dir um die Größe des Bildes keinen Kopf machen. Es wird auf die benötigte bzw. gewollte Größe skaliert. Man kann sich ja einen Sack voll Größen anlegen - mit verschiedenen max-width und max-height und float usw.

Achtung: Bei reponsivem Layout verkleinert sich das Bild natürlich, wenn der Browser verkleinert wird - PC zu Mobiltelefon.
 

 

Offline Thorstn

  • Mitglied
  • *
  • Beiträge: 669
    • Profil anzeigen
    • Mensch, Musiker, Webdesigner - Thorsten aus Bochum
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #6 am: 20. Januar 2016, 13:47:33 »
Ich habe mir für ein ähnliches Anliegen (geht sowohl um Bilder als auch um Textabschnitte) ein benutzerdefiniertes Syntaxelement erstellt, welches die Größe des Objektes in der Breite kontrolliert.

Eigene Syntax:
maxwidth = <div style="max-width:{DESCRIPTION};display:inline-block;overflow:hidden;">{VALUE}</div>

Je nach Layout-Einstellungen kann eine zusätzliche Außenabstand-Angabe (z.B. "margin:10px;" ) nötig sein, weil die Bilder sonst neben- oder untereinander "kleben".

In der Inhaltsseite mit einem Bild:
[maxwidth=350px|[bild|@=Kategorie:mein-bild-001.jpg=@]]

Hier kann man statt der Pixel-Angabe auch eine Prozent-Angabe nehmen.

Gruß,
Thorsten

www.mad-it.de - Wir lösen keine Probleme. Wir machen sie.
moziloCMS-Layouts auf mozilo-layouts.thorstn.com
webdesign-ruhr.de - Webdesign aus Bochum
 

 

Offline supercat

  • Mitglied
  • *
  • Beiträge: 142
    • Profil anzeigen
    • http://www.motourist.de
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #7 am: 20. Januar 2016, 17:12:12 »
Das gefällt mir, weil es sehr flexibel ist  Aber wie gesagt: An ein durchdachtes Layout sollte man sich schon halten, sonst kann eine Seite schnell zum bunten Sammelsurium werden  ;)
 

 

wasp

  • Gast
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #8 am: 20. Januar 2016, 22:19:01 »
Hallo!

Erzeuge doch einfach z.B. eine Kategorie "MODULE" mit unsichtbaren Fragmenten und include diese dann.

Eigene Syntaxelemente : (EIGENE) SYNTAXELEMENTE mit HTML, CMS-SYNTAX, PLUGINAUFRUFEN und EIGENEN SYNTAXELEMENTEN funktionieren! (VERSCHACHTELT ...)  :P

danke @ stefanbe  :mrgreen:  / 2.0 / ab ca. rev ?? (am besten aktuelle Version)


« Letzte Änderung: 21. Januar 2016, 10:16:39 von wasp »
 

 

Offline Thorstn

  • Mitglied
  • *
  • Beiträge: 669
    • Profil anzeigen
    • Mensch, Musiker, Webdesigner - Thorsten aus Bochum
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #9 am: 22. Januar 2016, 00:10:34 »
Erzeuge doch einfach z.B. eine Kategorie "MODULE" mit unsichtbaren Fragmenten und include diese dann.

Das heißt was genau?

Du schreibst manchmal sehr rätselhaft  ;)

Gruß,
Thorsten
www.mad-it.de - Wir lösen keine Probleme. Wir machen sie.
moziloCMS-Layouts auf mozilo-layouts.thorstn.com
webdesign-ruhr.de - Webdesign aus Bochum
 

 

wasp

  • Gast
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #10 am: 22. Januar 2016, 08:45:57 »
Hallo thorstn,

Recht hast Du - Passiert mir wenn ich zuviel Information in zu wenig Worte packen will.

Bezugnehmend auf das von supercat beschriebene "bunte Sammelsurium" wollte ich mit dem
Hinweis auf versteckte (Unter-)Module zum includen in die jeweiligen Inhaltsseiten einen
Tipp zum "aufgeräumteren" Bearbeiten geben -

In dem Zusammenhang ist dann auch insbesondere die Erstellung (etwas komplexerer)
eigener Syntaxelemente mit den zahlreichen neuen Möglichkeiten für mich obligatorisch
geworden, um effizienter zu arbeiten (so wie Du es ja bereits auch tust).

Wobei ich jetzt bei erneutem lesen feststelle, das es sich hier wohl um die Optik / das
Erscheinungsbild der Seite dreht - Mein Beitrag also min. halbwegs ins offtopic läuft ...

Ich lasse ihn als Anregung zunächst dennoch stehen.

« Letzte Änderung: 22. Januar 2016, 09:20:32 von wasp »
 

 

Offline glory

  • Mitglied
  • *
  • Beiträge: 313
    • Profil anzeigen
    • Glory of Loves Pomeranian
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #11 am: 22. Januar 2016, 23:35:12 »
Hallo Thorstn,
ich habe deine Syntax mal ausprobiert. Mit Text klappt es super, aber beim Bild nicht. Das Bild wird nicht f
ormatiert und es wird nur abgeschnitten in der Breite, die angegeben ist.

Viele Grüße!
Wer aufhört zu lernen, hört auf zu leben!
 

 

Offline Thorstn

  • Mitglied
  • *
  • Beiträge: 669
    • Profil anzeigen
    • Mensch, Musiker, Webdesigner - Thorsten aus Bochum
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #12 am: 24. Januar 2016, 20:48:39 »
Hallo Glory,

hast Du einen Link zum "angucken"?

Es kommt wohl auch darauf an, welche "normalen" Bild-Einstellungen Du in der style.css hast. Wahrscheinlich hast Du für die Bildgrößen-Angabe kein "max-width" sondern "width" oder gar keine Größen-Vorgabe.

Gruß,
Thorsten
www.mad-it.de - Wir lösen keine Probleme. Wir machen sie.
moziloCMS-Layouts auf mozilo-layouts.thorstn.com
webdesign-ruhr.de - Webdesign aus Bochum
 

 

Offline glory

  • Mitglied
  • *
  • Beiträge: 313
    • Profil anzeigen
    • Glory of Loves Pomeranian
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #13 am: 27. Januar 2016, 02:11:03 »
Hallo Thorstn,
hier ist der Link zu meiner Übrungsseite: http://kirsche-html.bplaced.net/Testbereich/Syntaxelemente2.html?draft=true

In der style.css war erst keine Größenangabe und nun habe ich es so geändert:
/* [bild|...] */
img {border : none;
     max-width: 550px;}

und auf der Inhaltsseite steht es so:
[maxwidth=200px|[bild|@=Welpen:a2_1wo3.jpg=@]]

Trotzdem ist das Bild abgeschnitten.

Viele Grüße!
Wer aufhört zu lernen, hört auf zu leben!
 

 

Offline Thorstn

  • Mitglied
  • *
  • Beiträge: 669
    • Profil anzeigen
    • Mensch, Musiker, Webdesigner - Thorsten aus Bochum
Re: Erweiterung des Syntaxelementes "Bild"
« Antwort #14 am: 27. Januar 2016, 13:17:16 »
Hallo Glory,

es ist etwas schwierig für mich, "meine" Syntax auf alle vorhandenen Layouts anzupassen bzw. es immer gegenzutesten  ;)

Aber probiere es mal damit:

Statt der Angabe
/* [bild|...] */
img {border : none;
     max-width: 550px;}

deklarierst Du 100% für die max-width Angabe
/* [bild|...] */
img {border : none;
     max-width: 100%;}

Gruß,
Thorsten
www.mad-it.de - Wir lösen keine Probleme. Wir machen sie.
moziloCMS-Layouts auf mozilo-layouts.thorstn.com
webdesign-ruhr.de - Webdesign aus Bochum