Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#1 20. August 2014 07:00

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

[GELÖST] Darstellung von Spalten formatieren

Ich komm' nicht mehr weiter ...  mad

Ich möchte mehrere {content}-Elemente (zwei Spalten, darunter ein zusammenhängender Block über die gesamte Breite und darunter wieder zwei Spalten) - abhängig davon, ob sie befüllt sind oder nicht - darstellen. Zusätzlich gibt es noch eine Sidebar, in der z.B. News dargestellt werden (können). Bei den meisten {content}-Elementen klappt die Darstellung auch problemlos. Lediglich wenn die erste der beiden oberen Spalten (nicht Sidebar !) nicht befüllt ist, gibt es Probleme, da dann trotz alledem der Hintergrund der Überschrift dargestellt wird, was unschön aussieht. Das untere Bild zeigt ein Beispiel, bei dem lediglich der Block in der Mitte einen Text enthält. Demzufolge sollte der obere Balken nicht dargestellt werden, da das zugehörige {content}-Element (= linke Spalte) nicht befüllt ist : 2014-08-20_071407.jpg
Mein Code sieht folgendermaßen aus:

{* Start Container *}
                       <div class="container">

{* Definition der Spalten und des unteren Blocks. Durch wahlweise (Nicht-)Befüllung kann gesteuert werden, ob das entsprechende {content}-Element angezeigt werden soll oder nicht. *}
                       {content block='Überschrift links' oneline=true wysiwyg=false assign='Ueberschrift_links'}
                       {content block='Spalte links' assign='Spalte_links'}
                       {content block='Überschrift mitte' oneline=true wysiwyg=false assign='Ueberschrift_mitte'}
                       {content assign='Spalte_mitte'}
                       {content block='Überschrift rechts' oneline=true wysiwyg=false assign='Ueberschrift_rechts'}
                       {content block='Spalte rechts' assign='Spalte_rechts'}
                       {content block='Überschrift unten' oneline=true wysiwyg=false assign='Ueberschrift_unten'}
                       {content block='Block unten' assign='Block_unten'}
                       {content block='Überschrift unten mitte' oneline=true wysiwyg=false assign='Ueberschrift_unten_mitte'}
                       {content block='Spalte unten mitte' assign='Spalte_unten_mitte'}
                       {content block='Überschrift unten rechts' oneline=true wysiwyg=false assign='Ueberschrift_unten_rechts'}
                       {content block='Spalte unten rechts' assign='Spalte_unten_rechts'}

{* Start Sidebar *}
                       <aside>
{* falls es sich um die Startseite handelt ($page_alias = 'start'), dann wird der 'News'-Block eingeblendet, ansonsten eine "normale" Sidebar *}
                       {if $page_alias == 'start'}
                          <div class="inside">

{* Start News, stylesheet  "Module: News" *}
                             {cms_module module="news"}

                             <div id="news">
                                 <h2>Nachrichten</h2>
                                 {news number='5' detailpage='news'}
                             </div>
{* Ende News *}
                          </div>

{* falls die Sidebar nicht leer ist, wird sie angezeigt *}
                       {elseif $Spalte_links != ''}
                          <div class="inside">
                             <article class="col-3">
                                <h3>{$Ueberschrift_links}</h3>
                     {* "truncate less" bewirkt, dass die Spaltenbreite reduziert (= 250px) dargestellt wird *}
                                <div class="truncate less">
                                   {$Spalte_links}
                                </div>
                             </article>
                          </div>

                       {/if}
                       </aside>

{* Ende Sidebar *}

{* Start Inhalt; zwei Spalten nebeneinander und/oder ein Block darunter sowie zwei weitere Spalten darunter können wahlweise befüllt und somit ausgewählt werden *}

                       <section id="content">
                          <div class="wrapper indent">

{* falls die Spalte nicht leer ist, wird sie angezeigt *}
                             {if $Spalte_mitte != ''}
                                <article class="col-1">
                                   <h3>{$Ueberschrift_mitte}</h3>
                                   <div class="truncate">
                                      {$Spalte_mitte}
                                   </div>
                                </article>
                             {/if}

{* falls die Spalte nicht leer ist, wird sie angezeigt *}
                             {if $Spalte_rechts != ''}
                                <article class="col-2">
                                   <h3>{$Ueberschrift_rechts}</h3>
                                   <div class="truncate">
                                      {$Spalte_rechts}
                                   </div>
                                </article>
                             {/if}
                          </div>

{* falls es sich bei der aktuellen Seite um die Datenschutzrichtline handelt ($page_alias = 'datenschutz'), dann wird der Text ungekürzt ausgegeben, ansonsten gekürzt *}
                          {if $page_alias == 'datenschutz'}
                             <h3>{$Ueberschrift_unten}</h3>
                             {$Block_unten}
                                                         
{* falls der Block nicht leer ist, wird er angezeigt *}
                          {elseif $Block_unten != ''}
                             <article class="col-0">
                                <h3>{$Ueberschrift_unten}</h3>
                        {* 'truncate more' umfasst den gesamten Block (= beide Spalten) *}
                                <div class="truncate more">
                                   {$Block_unten}
                                </div>
                             </article>
                          {/if}

{* falls die Spalte nicht leer ist, wird sie angezeigt *}
                          {if $Spalte_unten_mitte != ''}
                             <article class="col-1">
                                <h3>{$Ueberschrift_unten_mitte}</h3>
                                <div class="truncate">
                                   {$Spalte_unten_mitte}
                                </div>
                             </article>
                          {/if}

{* falls die Spalte nicht leer ist, wird sie angezeigt *}
                          {if $Spalte_unten_rechts != ''}
                             <article class="col-2">
                                <h3>{$Ueberschrift_unten_rechts}</h3>
                                <div class="truncate">
                                   {$Spalte_unten_rechts}
                                </div>
                             </article>
                           {/if}
                        </section>
{* Ende Inhalt *}

                        <div class="clear"></div>
                     </div>
{* Ende Container *}

Die Crux an der Sache ist, das die rechte der beiden Spalten korrekterweise nicht dargestellt wird, wenn das entsprechende {content}-Element nicht befüllt ist. Auch die beiden unteren Spalten werden - falls sie nicht befüllt sind - nicht dargestellt (daraus schließe ich, dass es nicht am Stylesheet liegen kann, da sonst auch die linke der beiden unteren Spalten fehlerhaft dargestellt werden müsste). Nur die linke, d.h. erste der beiden oberen Spalten wird offensichtlich immer (inkorrekterweise) dargestellt. sad

Beitrag geändert von Dancer62 (25. August 2014 09:02)


Man ist so alt, wie man sich fühlt...

Offline

#2 27. August 2014 07:02

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Darstellung von Spalten formatieren

Mittlerweile habe ich das Problem soweit einkreisen können, dass ich nunmehr weiß, dass die Hintergrundfarbe der (leeren) Überschrift <h3> immer dargestellt wird.

                      <section id="content">
                          <div class="wrapper indent">

{* falls die Spalte nicht leer ist, wird sie angezeigt *}
                             {if $Spalte_mitte != ''}
                                <article class="col-1">
                                   <h3>{$Ueberschrift_mitte}</h3>
                                   <div class="truncate">
                                      {$Spalte_mitte}
                                   </div>
                                </article>
                             {/if}
                       .
                       .
                       .
                          </div>
                      </section>

Allerdings verstehe ich nicht, warum sie - trotz {if}-Anweisung - überhaupt dargestellt wird, da der Inhalt von '$Spalte_mitte' leer ist (oder liegt es daran, dass '$Spalte_mitte' das ursprüngliche {content}-Element ist ?).
In meinem Stylesheet habe ich u.a. folgende Deklarationen (in dieser Reihenfolge):

#main {
     margin:0 auto;
     position:relative;
     width:980px;
     font-size:.75em;
}

     section#content {
          float:left;
          width:675px;
          padding-top:44px;
     }

.col-1,
.col-2,
.col-3 {
     float:left;
}

.wrapper {
     width:100%;
     overflow:hidden;
}

.container {
     width:100%;
     padding-bottom:38px;
}

a.article {
    width: 400px;
    background-color: #f0f0f0;
    margin: 10px;
    padding:5px;
}

h3 {
     font-size:18px;
     line-height:1.2em;
     color:#fff;
     background-repeat:repeat-x;
     background-position:0 0;
     background-image:url([[root_url]]/<mein_Verzeichnis>/<mein_theme>/<mein_Bild>.gif);
     padding:12px 0 7px 15px;
     margin-bottom:23px;
}

#content .col-1 {
     width:316px;
     margin-right:43px;
}

#content .col-2 {
     width:316px;
}

#content .indent {
     padding-bottom:39px;
}

(Da ich das Stylesheet lediglich "übernommen" habe, kann ich leider nicht allzu viel zu Struktur und Intention sagen).
Ich hoffe, dass ich mein Problem einigermaßen verständlich rüberbringen konnte. Ich erwarte keine 'ad hoc'-Problemlösung, aber eine Hilfestellung, in welche Richtung ich mich orientieren muss, wäre schon hilfreich  hmm ...

Beitrag geändert von Dancer62 (27. August 2014 07:04)


Man ist so alt, wie man sich fühlt...

Offline

#3 27. August 2014 07:41

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.391

Re: [GELÖST] Darstellung von Spalten formatieren

Was steht denn im HTML Code im Browser an dieser Stelle?
(Oder bearbeite den Inhalt mal im Backend, aber schalte dabei den WYSIWYG Editor ab.)
Ist {$Spalte_mitte} wirklich leer?
Oder enthält es vielleicht noch Leerzeichen, Kommentare, leere Absätze, Zeilenumrüche, Leere <span>-Elemente ... ?
In solchen Fällen würde ich eher so prüfen:

{if $Spalte_mitte|strip_tags|trim != ''}
    ...
{/if}

Damit wird sichergestellt, dass es wirklich nichts zum Anzeigen gibt.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12.2 unter PHP 7:
cmsms-1.12.2-php7.2-diff.tar.gz (nur die geänderten Dateien)
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)

Offline

#4 27. August 2014 10:03

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 6.999
Webseite

Re: [GELÖST] Darstellung von Spalten formatieren

NaN schrieb:

(Oder bearbeite den Inhalt mal im Backend, aber schalte dabei den WYSIWYG Editor ab.)

Genau!

Zudem kann es sein, dass das System dir aufgrund der Voreinstellung (siehe Seiten-Administration > Seitenvoreinstellungen) einen Text in den Block injiziert, der aufgrund dessen, dass er als HTML Kommentar gesetzt ist, im Editor nicht angezeigt wird.

Offline

#5 27. August 2014 18:03

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Darstellung von Spalten formatieren

Danke Ihr beiden !!!

Genau das war es !!! Zum Einen hatte ich in den Seiten-Vorgaben den Inhaltsblock mit HTML vorausgefüllt und zum anderen habe ich mit NaN's Erweiterung jetzt sichergestellt, dass tatsächlich nichts mehr im {content}-Element steht.

Damit muss ich "nur noch" alle Seiten darauf überprüfen, ob sie diesen HTML-Code auch enthalten sad .

Allerdings habe ich jetzt bei der Bearbeitung der Seite ein anderes Problem festgestellt: beim Versuch, die (Inhalts-)Seite zu speichern, bekomme ich die Fehlermeldung "Kein Wert für Inhalte vorgegeben!". Kann ich irgendetwas eintragen, was aber wiederum nicht die o.g. Auswertung negativ beeinflusst oder gibt es noch andere Möglichkeiten ?

Nachtrag: durch NaN's zusätzliche Abfrage wird der HTML-Code offensichtlich ignoriert, daher muss ich jetzt nicht alles "sauber" haben...

Auf alle Fälle sieht die Seite jetzt erstmal so aus, wie ich mir das vorgestellt habe.

Beitrag geändert von Dancer62 (27. August 2014 18:14)


Man ist so alt, wie man sich fühlt...

Offline

#6 27. August 2014 18:17

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.391

Re: [GELÖST] Darstellung von Spalten formatieren

Ah... Der Standard Inhaltsblock...  Der darf ja dummerweise garnicht leer sein roll
Dann gib den Inhalten lieber allen als Standard Inhalt einen HTML Kommentar vor.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12.2 unter PHP 7:
cmsms-1.12.2-php7.2-diff.tar.gz (nur die geänderten Dateien)
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)

Offline

#7 27. August 2014 18:57

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 6.999
Webseite

Re: [GELÖST] Darstellung von Spalten formatieren

Könntest in den Standard-Inhaltsblock (={content} - muss zwingend vorhanden sein) einen unsichtbaren html Tag einsetzen, der durch NaN's Abfrage gefiltert wird.

Offline

#8 28. August 2014 05:47

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Darstellung von Spalten formatieren

Ja - ich habe jetzt einen Kommentar als Vorgabe reingesetzt ( {* Inhalt *} lol ). Sollte hoffentlich funktionieren...


Man ist so alt, wie man sich fühlt...

Offline