moziloCMS Supportforum

moziloCMS => Plugins => Thema gestartet von: marusti am 25. September 2014, 09:36:32

Titel: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 25. September 2014, 09:36:32
Hallo,

das Plugin funktioniert soweit sehr gut.  Nur würde ich gerne noch die Spalte komplett ausblenden wenn sie leer ist und den Rest verbreitern.

Bsp:
Inhalt: 800px breit, Spalte rechts: 200px - Wenn Spalte rechts leer ist, soll Inhalt 1000px sein

Ist das mit diesem Plugin möglich?
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 11. Oktober 2014, 14:41:08
da ich es mit dem Plugin nicht hinbekommen habe, habe ich es mit JS gelöst.
Falls es jemanden interessiert, hier der Code

<script>
<!--
$('document').ready(function () {
    if ($('#rechts').html() == "") {
        $('#rechts').hide();
        $('#inhalt').css('width', '100%');
    };
});
-->
</script>
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 13. März 2017, 17:19:19
Hochhol, marusti ich bin ein css nob. Könntest Du mir sagen wo dein Code hin muss? Bzw wie ich das machen muss. Ein anderer Member kann mir das natürlich auch gerne sagen.

Gruß Jochen
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 13. März 2017, 17:24:11
Hallo Jochen,
das gehört in die template.html Datei, am Besten ganz ans Ende vor </body>
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 14. März 2017, 15:58:47
Marusti, danke für die Antwort. Kann der Script einfach in das Template.html kopiert werden? Ich habe das Kopiert, aber es ändert sich nix. Ich nutze das Layout von Thorsten (Grimme) und auf der Startseite die rechte Seite als Info Rand. Auf den weiteren Inhaltsseiten wird der Rand nicht benötigt und es sähe besser aus wenn die Flexbar nicht vorhanden ist.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 14. März 2017, 16:24:23
Du müsstest #rechts und #inhalt an deine div namen anpassen.
Hast du einen Link zu deiner Seite wo man es sich anschauen kann?
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 14. März 2017, 16:49:48
Marusti, siehste da ist der noob in mir. Ich komm natürlich nicht auf sowas. Darum bekomme ich das mit dem moziloGB auch nicht hin. aber das ist ein anderes Thema. Zu dem Link: http://jigangler.de (http://jigangler.de). Ich hoffe ich werde nun nicht verurteilt ::)
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 14. März 2017, 17:03:05
Verurteilt wird hier keiner. Versuch es mal so:

<script>
<!--
$('document').ready(function () {
    if ($('#maincontent-right').html() == "") {
        $('#maincontent-right').hide();
        $('#maincontent-left').css('width', '100%');
    };
});
-->
</script>
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 14. März 2017, 17:16:13
Wenn ich das an die richtige Stelle kopiert habe klappt es leider nicht.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 17:33:56
@marusti & @Jochen:
Das Script wird so nicht funktionieren.
Es ist kein pures JS. Sondern scheint auf einem JS-Framework (wahrscheinlich jQuery) zu basieren.

@Jochen: Beachte, dass im Layout Deiner Site der rechte Inhaltsbereich bei zu schmalen Bildschirmen (kleiner 768px Breite) ausgeblendet wird. Siehe in der Datei mobile.css.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 14. März 2017, 17:36:27
djr war schneller und hat Recht, es ist JQuery und das ist auf der Seite nicht eingebunden.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 14. März 2017, 17:37:59
Ja die mobile.css verstehe ich so oder so noch nicht. Ich dachte weil da mobile dran steht ist die für Smartphone. Aber wenn ich die Seite mit dem Smartphone aufrufe, sehe ich nur den Header. Wenn ich bei dem Smartphone Browser die Desktopversion anforder sehe ich erst die Seiten.

Edit: Also für mich nicht anzuwenden?
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 18:15:35
@Jochen: Die mobile.css kommt bei kleineren Anzeigegrößen zur Geltung. Also auch am PC wenn das Anzeigefenster nur ein Teil des Bildschirms einnimmt.

Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 18:25:46
Zitat von: Jochen am 14. März 2017, 17:37:59Aber wenn ich die Seite mit dem Smartphone aufrufe, sehe ich nur den Header.

Dein HTML hat einen Fehler, der mehrere Darstellungsfehler verursacht.
Das <div id="topheadername"> wird nicht wieder geschlossen.
<div id="topheader">
    <div id="topheadername"><a href="/">Anglerdemo im Fehmarnsund</a>
               
</div>

Richtig ist:
<div id="topheader">
    <div id="topheadername"><a href="/">Anglerdemo im Fehmarnsund</a></div>
               
</div>

Durch den Fehler wird u.a. der Text im Inhaltsbereich zu groß dargestellt. (Dem hast Du wohl durch Textformatierung im Editor entgegengewirkt.)
Behebe den Fehler und auch die "mobile"-Ansicht wird wieder gehen.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 14. März 2017, 18:33:38
@djr, ich möchte nix kaputt machen. Aber bei mir steht

<div id="topheader">
            <div id="topheadername"><a href="{BASE_URL}">Anglerdemo im Fehmarnsund</a>
               
         </div>

Bei a href steht bei mir noch Base_URL. Das kann ruhig weg? Natürlich muss noch das </div> am Ende der Zeile Fehmarnsund

Ok, ich habe es. Und du hast recht. Mobil klappt besser. Danke für die Hilfe
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 18:40:06
Zitat von: Jochen am 14. März 2017, 18:33:38
@djr, ich möchte nix kaputt machen. Aber bei mir steht

<div id="topheader">
            <div id="topheadername"><a href="{BASE_URL}">Anglerdemo im Fehmarnsund</a>
               
         </div>

Bei a href steht bei mir noch Base_URL. Das kann ruhig weg?

nimm:
<div id="topheader">
<div id="topheadername"><a href="{BASE_URL}">Anglerdemo im Fehmarnsund</a></div>
               
</div>

{BASE_URL} wird von mozilo während des Seitenaufbaus ersetzt durch /. (Bzw. in einem andern Kontext als dem Deiner mozilo-Installation wird {BASE_URL} ggf. durch /kontext/ ersetzt.)
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 19:00:09
Zitat von: Jochen am 14. März 2017, 15:58:47...auf der Startseite die rechte Seite als Info Rand. Auf den weiteren Inhaltsseiten wird der Rand nicht benötigt und es sähe besser aus wenn die Flexbar nicht vorhanden ist.

Da hilft auch folgender Tipp: gesonderte CSS für einzelne Inhaltsseiten bzw. Kategorien (http://www.mozilo.de/forum/index.php/topic,1513.msg9513.html)
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 14. März 2017, 19:32:43
@marusti:

Jetzt wo das Thema wiederbelebt wurde:

Zitat von: marusti am 25. September 2014, 09:36:32
... Nur würde ich gerne noch die Spalte komplett ausblenden wenn sie leer ist und den Rest verbreitern.

Bsp:
Inhalt: 800px breit, Spalte rechts: 200px - Wenn Spalte rechts leer ist, soll Inhalt 1000px sein ...

Vorausgesetzt die rechte Spalte sitebar ist komplett leer (auch keine Leerzeichen, Umbrüche, ...):

/* CSS 3 */
.wrap {
  display:flex;
  width: 1000px;
}
.content {
  flex-grow: 1;
}
.sidebar:not(:empty) {
  width: 200px;
}

<div class="wrap">
    <div class="content">lorem ipsum</div>
    <div class="sidebar"></div>
</div>
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 15. März 2017, 08:15:28
Hallo djr, kann ich deinen Code auch bei meinem Layout anwenden? Müsste ich das with:1000px auf meine 960 anpassen? Oder würde das so auch laufen?

Danke für die Hilfe.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 15. März 2017, 09:35:57
Der reine CSS Ansatz gefällt mir noch, werde ich mir auf alle Fälle merken!
Danke djr
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: djr am 15. März 2017, 10:42:39
@Jochen: Du wirst in den seltensten Fällen Code einfach übernehmen können.
Jede Website bildet einen individuellen Kontext und so musst Du Code entsprechend adaptieren.

Ein letzter Tipp für das "zwei Spalten Problem":
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 15. März 2017, 12:23:39
Hallo djr, danke für die Hilfe, aber Spalten mit Benutzerdefinierter-Syntax überschreitet mein Wissen. Wenn ich mal weiter sein sollte könnte ich mal versuchen das zu verstehen. Leider wird das oft nur wenig benötigt und somit vergisst man das alles wieder. das letzte mal habe ich mit Mozilo vor 7 Jahren gearbeitet. Davon ist nicht mehr viel bei mir vorhanden.

Ich scheitere schon daran mir ein News plugin so einzubinden das es an der rechten Seite der Inhaltsseite erscheint. Da ist viel lesearbeit meinerseits gefragt und ich müsste das noch verstehen.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 15. März 2017, 12:37:18
Zitat von: Jochen am 15. März 2017, 12:23:39
Ich scheitere schon daran mir ein News plugin so einzubinden das es an der rechten Seite der Inhaltsseite erscheint. Da ist viel lesearbeit meinerseits gefragt und ich müsste das noch verstehen.
Hallo Jochen, wie hast du denn auf der Startseite den Teil Rechts eingefügt?
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: Jochen am 15. März 2017, 16:59:00
Hallo marusti, in der Beschreibung zum steht das eine versteckte Inhaltsseite mit sb1_ in Bezug auf die Inhaltsseite wo der Text erscheinen soll. Bei mir also sb_1Anglerdemo im Fehmarnsund. In dieser versteckten Seite kann ich den Text einfügen.
Titel: Re: Flexisidebar Plugin - Spalte ausblenden wenn leer
Beitrag von: marusti am 15. März 2017, 17:06:55
Zitat von: Jochen am 15. März 2017, 16:59:00
Hallo marusti, in der Beschreibung zum steht das eine versteckte Inhaltsseite mit sb1_ in Bezug auf die Inhaltsseite wo der Text erscheinen soll. Bei mir also sb_1Anglerdemo im Fehmarnsund. In dieser versteckten Seite kann ich den Text einfügen.
Ja genau so machst du es für das Plugin auch.