Ergebnis 1 bis 20 von 20

Thema: Bilduntertitel an Bildgröße anpassen (umbrechen bei Bedarf) (Gelöst)

  1. #1
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard Bilduntertitel an Bildgröße anpassen (umbrechen bei Bedarf) (Gelöst)

    Hallo Typolight Fans,

    Auf http://www.computino.de/anleitung/ty...-anpassen.html kann man eine kurze Anleitung lesen wie man Bildunterschriften Dynamisch macht. Bisher hat das bei mir auch wunderbar mit ce_image.tpl und ce_image_fullsize.tpl geklappt. Irgendwie hänge ich aber jetzt an ce_gallery_fullsize.tpl ... Ich weiß nicht wie und wo ich den Codeschnipsel dort platzieren soll. Weiß jemand Rat?
    Geändert von TheGeek (09.03.2010 um 17:15 Uhr)
    Life would be easier if I had the source code!

  2. #2
    Contao-Urgestein Avatar von Sebastian
    Registriert seit
    19.06.2009.
    Ort
    Stuttgart
    Beiträge
    3.361

    Standard

    HI

    da ich dieses Problem auch mit TL 2.8 RC2 hatte hat Leo nun eine Variable eingebaut, mit der man die Bildunterschrift auch begrenzen kann. Außerdem ist in der neuen TL-Version nur noch ein derartiges Template vorhanden.

    Sebastian

  3. #3
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard

    Gibt es keine Lösung für 2.7? Ich möchte bei einer Produktiven Umgebung ungern auf ein RC umsteigen. Kann ich nicht irgendwie das ce_gallery_fullsize.tpl Template anpassen?
    Life would be easier if I had the source code!

  4. #4
    Contao-Urgestein Avatar von Sebastian
    Registriert seit
    19.06.2009.
    Ort
    Stuttgart
    Beiträge
    3.361

    Standard

    HI

    auf der Website steht doch geschrieben, dass es dort auch funktioniert. Was ist denn das Problem, und warum sollte es da nicht funktionieren?

    Sebastian

  5. #5
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard

    Irgendwie hänge ich aber jetzt an ce_gallery_fullsize.tpl ... Ich weiß nicht wie und wo ich den Codeschnipsel dort platzieren soll.
    EDIT:

    Okay jetzt klappt es. Anbei mal das komplette Template:

    PHP-Code:
    <div class="<?php echo $this->class?> block"<?php echo $this->cssID?><?php if ($this->style): ?> style="<?php echo $this->style?>"<?php endif; ?>>
    <?php if ($this->headline): ?>

    <<?php echo $this->hl?>><?php echo $this->headline?></<?php echo $this->hl?>>
    <?php endif; ?>

    <table cellspacing="0" cellpadding="0" summary="Image gallery">
    <tbody>
    <?php foreach ($this->body as $class=>$row): ?>
    <tr class="<?php echo $class?>">
    <?php foreach ($row as $col): ?>
    <?php 
    if ($col['hasImage']): ?>
        
        <?php 
        
    // Breite des Bildes rausfinden, auch image_container beschneiden
        
    $width preg_match('/^ width="([0-9]+)".*/'$col['imgSize'], $found);
        
    $width $found[1];
        
    $width $width 2;
        
    ?>
        
      <td class="<?php echo $col['class']; ?>" style="width:<?php echo $col['colWidth']; ?>;"><div class="image_container"<?php if ($col['margin']): ?> style="<?php echo $col['margin']; ?>"<?php endif; ?>><a href="<?php echo $col['href']; ?>" rel="lightbox[<?php echo $this->lightboxId?>]" title="<?php echo $col['alt']; ?>"><img src="<?php echo $col['src']; ?>"<?php echo $col['imgSize']; ?> alt="<?php echo $col['alt']; ?>" /></a><?php if ($col['caption']): ?><div style="width:<?php echo  $width;?>px" class="gal_caption"><?php echo $col['caption']; ?></div><?php endif; ?></div></td>
    <?php else: ?>
      <td class="<?php echo $col['class']; ?> empty">&nbsp;</td>
    <?php endif; ?>
    <?php 
    endforeach; ?>
    </tr>
    <?php endforeach; ?>
    </tbody>
    </table>
    <?php echo $this->pagination?>

    </div>
    Neu sind die Zeilen:

    PHP-Code:
    <?php 
        
    // Breite des Bildes rausfinden, auch image_container beschneiden
        
    $width preg_match('/^ width="([0-9]+)".*/'$col['imgSize'], $found);
        
    $width $found[1];
        
    $width $width 2;
        
    ?>
    und

    PHP-Code:
    <div style="width:<?php echo  $width;?>px" class="gal_caption">
    Ich habe bewusst die klasse gal_caption gewählt. Somit kann ich Galerie Bilder separat stylen. zb so:

    HTML-Code:
    .gal_caption
    {
     background-color: black;
     color: #fff;
     font-size:95%;
     margin-left: 5px;
     margin-top:-6px;
     padding-bottom:2px;
     padding-left:2px;
     padding-right:2px;
     text-align:center;
     -moz-border-radius-bottomleft:10px;
     -moz-border-radius-bottomright:10px;
     -webkit-border-bottom-left-radius:10px;
     border-bottom-left-radius:10px;
     -webkit-border-bottom-right-radius:10px;
     border-bottom-right-radius:10px;
    }
    Das war es auch schon ...
    Geändert von TheGeek (19.01.2010 um 07:53 Uhr)
    Life would be easier if I had the source code!

  6. #6
    Contao-Urgestein Avatar von Sebastian
    Registriert seit
    19.06.2009.
    Ort
    Stuttgart
    Beiträge
    3.361

    Standard

    HI

    na das ist doch fein. Und ab TL 2.8 wird es dann einfacher, weil die Zahl der Templates drastisch reduziert worden ist.

    Sebastian

  7. #7
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard

    Jetzt muss ich doch mal fragen ... Ich hab das System auf 2.8.1 geupdatet. Die Templates werden ja jetzt nicht mehr benutzt. Wie und wo stelle ich jetzt die dynamischen Bildunterschriften ein?
    Life would be easier if I had the source code!

  8. #8
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard

    Bin ich wirklich der einzige der dieses Problem hat? Eigentlich müsste das doch Standardmäßig so sein das die Bildunterschriften an die Breite angepasst werden. Ich meine so sieht es einfach nur beschissen aus:



    Wie kann ich die Bildunterschriften (Caption) dynamisch machen (Typolight 2.8.1) ?
    Life would be easier if I had the source code!

  9. #9
    Contao-Nutzer Avatar von detlevp
    Registriert seit
    14.09.2009.
    Ort
    Berlin
    Beiträge
    51

    Standard

    Hallo TheGeek,

    Zitat Zitat von TheGeek Beitrag anzeigen
    Bin ich wirklich der einzige der dieses Problem hat?
    nein, Du bist mit Sicherheit nicht der Einzige, der das Problem hat, ich auch. Und auch ich habe keine Lösung parat, leider.

    Gruß Detlev

  10. #10
    Contao-Urgestein Avatar von Sebastian
    Registriert seit
    19.06.2009.
    Ort
    Stuttgart
    Beiträge
    3.361

    Standard

    HI

    die Frage ist doch eher, warum ist das so schmal. Die Bildunterschrift steht im Standardtemplate in einem Absatz (<p>), das ist ein Blockelement, und somit so breit wie das Elternelement.

    Es liegt also an deinem CSS, dass die Bildunterschrift so schmal ist. Aber ohne Link wird es schwer.

    Sebastian

  11. #11
    Contao-Nutzer Avatar von TheGeek
    Registriert seit
    21.06.2009.
    Beiträge
    97

    Standard

    Soo nun gehts.

    Zwei Dinge hab ich verändert. Einmal die Klasse .ce_gallery .caption und die Klasse .ce_text .caption habe ich an meine Bedürfnisse angepasst. So sah die Caption in der Galerie schon mal vernünftig aus. Fehlten jetzt nur noch die ce_text Sachen.
    Zweitens habe ich das template ce_text.tpl in zeile 22 ein bisschen angepasst:
    PHP-Code:
    <div class="caption" style="width:<?php echo substr($this->imgSize83); ?>px;"><?php echo $this->caption?></div>
    Wenn das auch noch besser geht nehme ich Kritik gerne entgegen. Aber sonst läuft es erst einmal.
    Life would be easier if I had the source code!

  12. #12
    Contao-Nutzer Avatar von flexx
    Registriert seit
    08.02.2010.
    Beiträge
    121

    Standard

    Zitat Zitat von Sebastian Beitrag anzeigen
    HI

    da ich dieses Problem auch mit TL 2.8 RC2 hatte hat Leo nun eine Variable eingebaut, mit der man die Bildunterschrift auch begrenzen kann. Außerdem ist in der neuen TL-Version nur noch ein derartiges Template vorhanden.

    Sebastian
    O.K. Ich habe 2.8.
    Wie und wo setze ich die Variable denn ein wenn ich möchte dass die Bildunterschrift nur so breit ist wie das Bild selbst. Ich hätte gerne, dass die Bildunterschrift einen Zeilenumbruch erzwingt wenn die Unterschrift breiter als das Bild ist.
    Kannst Du mir das anhand eines Beispiels erläutern?
    Geändert von flexx (15.04.2010 um 06:48 Uhr)
    Wer Rechtschreibfehler findet darf sie behalten...

  13. #13
    Administrator Avatar von Nina
    Registriert seit
    04.06.2009.
    Ort
    Hamburg
    Beiträge
    4.755
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Da ich es auch gerade eingesetzt habe:

    Ab der 2.8 reicht das, um die Caption auf die Breite des Bildes zu begrenzen:
    PHP-Code:
    <div class="caption" style="width:<?php echo $this->arrSize[0]; ?>px;">

  14. #14
    Contao-Nutzer Avatar von flexx
    Registriert seit
    08.02.2010.
    Beiträge
    121

    Standard

    Aha. Und die Zeile ersetze ich wo? Muss ich die in allen .tpl Dateien einbinden die Bilder darstellen?
    Wer Rechtschreibfehler findet darf sie behalten...

  15. #15
    Contao-Urgestein Avatar von tblumrich
    Registriert seit
    25.06.2009.
    Ort
    Feldberger Seenlandschaft
    Beiträge
    2.225
    Partner-ID
    7979
    User beschenken
    Wunschliste

    Standard

    Zitat Zitat von flexx Beitrag anzeigen
    Aha. Und die Zeile ersetze ich wo? Muss ich die in allen .tpl Dateien einbinden die Bilder darstellen?
    Das würde mich auch interessieren.
    Sollte das nicht standardmäßig im Core eingebaut sein?

    Aber feine Lösung.

    Gruß
    Thomas
    blucomp | Webdesign & Onlinelösungen

  16. #16
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.292
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Zitat Zitat von tblumrich Beitrag anzeigen
    Das würde mich auch interessieren.
    Sollte das nicht standardmäßig im Core eingebaut sein?

    Aber feine Lösung.

    Gruß
    Thomas
    Dann stellt doch mal nen Feature Request ;-)
    Dafür gibts ja das Ticket System -> http://https://contao.org/

    Ich kann gut verstehen, das es nicht gerade freude macht so viele Templates erst mal anzupassen (überhaupt schon rausfinden wo die das alles drinn ist *g*).

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  17. #17
    Contao-Urgestein Avatar von tblumrich
    Registriert seit
    25.06.2009.
    Ort
    Feldberger Seenlandschaft
    Beiträge
    2.225
    Partner-ID
    7979
    User beschenken
    Wunschliste

    Standard

    Zitat Zitat von MacKP Beitrag anzeigen
    Dann stellt doch mal nen Feature Request ;-)
    Dafür gibts ja das Ticket System -> http://https://contao.org/

    Ich kann gut verstehen, das es nicht gerade freude macht so viele Templates erst mal anzupassen (überhaupt schon rausfinden wo die das alles drinn ist *g*).

    Viele Grüße
    Ja, schon klar.
    Mir gings primär aber auch darum, wo im System das überhaupt hin muss...

    Gruß
    blucomp | Webdesign & Onlinelösungen

  18. #18
    Contao-Nutzer Avatar von flexx
    Registriert seit
    08.02.2010.
    Beiträge
    121

    Standard

    Ja. Genau. Schließe mich da an.
    Ich würde mir die Arbeit ja machen wenn ich wüsste wo...
    Wer Rechtschreibfehler findet darf sie behalten...

  19. #19
    Wandelndes Contao-Lexikon Avatar von BugBuster
    Registriert seit
    15.06.2009.
    Ort
    Berlin
    Beiträge
    10.513
    User beschenken
    Wunschliste

    Standard

    also von Ninas Beispiel ausgehend nach
    Code:
    <div class="caption"
    gesucht finde ich:
    Code:
    system/modules/calendar/templates/event_full.tpl
    system/modules/faq/templates/mod_faqreader.tpl
    system/modules/frontend/templates/ce_hyperlink_image.tpl
    system/modules/frontend/templates/ce_text.tpl
    system/modules/frontend/templates/ce_image.tpl
    system/modules/frontend/templates/mod_random_image.tpl
    system/modules/frontend/templates/ce_accordion.tpl
    system/modules/frontend/templates/gallery_default.tpl
    system/modules/news/templates/news_latest.tpl
    system/modules/news/templates/news_full.tpl
    Ob das nun wirklich alles Bilduntertitel sind, müsste nun noch geprüft werden.
    Grüße, BugBuster
    "view source" is your guide.
    Danke an alle Amazon Wunschlisten Erfüller

  20. #20
    Contao-Nutzer
    Registriert seit
    16.08.2009.
    Beiträge
    51

    Standard

    Hallo zusammen,
    so ganz gelöst ist das Problem noch nicht.
    Was mache ich, wenn ich der Bildunterschrift eine Hintergrundfarbe zugewiesen habe und rechts und/oder links ein padding zuweise?
    Dieses wird ja zur Bildbreite addiert, somit ist die Bildunterschrift wieder breiter als das Bild.
    Hat jemand hierfür einen Lösungsansatz?

    umsteiger

    Doch gelöst: Einfach in das <div ="caption"> noch ein <p> einfügen und dieses mit padding formatieren. Warum diese Begrenzung der Breite der Bildunterschrift allerdings nicht standardmäßig eingebaut ist, ist mir ein Rätsel. Denn Bildunterschriften, die breiter als das Bild sind, sehen in 99% der Fälle sehr bescheiden aus.
    Geändert von umsteiger (28.07.2010 um 18:19 Uhr)

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Ähnliche Themen

  1. Antworten: 2
    Letzter Beitrag: 10.03.2011, 16:27
  2. Navigation umbrechen lassen
    Von hajo808 im Forum Layout / Templates / Holy Grail
    Antworten: 2
    Letzter Beitrag: 07.05.2010, 19:03
  3. gelöst: Bildgröße nicht einstellbar
    Von Rastafanda im Forum Bilder/Dateien
    Antworten: 7
    Letzter Beitrag: 13.01.2010, 20:37
  4. Formulare Checkboxen umbrechen
    Von Tholke im Forum Formulare
    Antworten: 1
    Letzter Beitrag: 03.12.2009, 14:34
  5. Slimbox + Bildgröße anpassen
    Von astrotiger im Forum Bilder/Dateien
    Antworten: 1
    Letzter Beitrag: 24.08.2009, 15:58

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •