WBCE CMS Forum

reini

Mitglied

Designveränderungswünsche beim Template WBCEZon

Hallo,
das Template gefällt mir sehr, jedoch möchte ich - wenn möglich - gerne folgende Änderungen vornehmen:
- die Spalte links (Menü der untergeordneten Seiten) ganz weglassen, dafür den Hauptblock bis an den linken Rand gehen lassen,
- das Logo und den Headerplatz tauschen
- den Platz für "Suche" und das Menü tauschen,
- der Platz für das Modul "Topics" soll rechts bestehen bleiben (rechter Block) .

Ich habe testweise versucht, das  Template entsprechend zu ändern, komme aber mit meinen Kenntnissen nicht wirklich weiter.
Ist mein Ansinnen überhaupt zu verwirklichen und wenn ja, welche Änderungen müssen an welchen Stellen vorgenommen werden.
Für Hilfestellungen wäre ich sehr dankbar!

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Das ist gar nicht so schwer. Das Template basiert ja auf dem Responsee-Grid, alle Bereiche liegen also in einem CSS-Raster und können recht einfach vertauscht oder auch entfernt werden.

Das Ausgangstemplate ist so aufgebaut:

Es liegen also jeweils zwei Bereiche nebeneinander, im Contentbereich mit einer Verschachtelung, sonst würden bei längeren Inhalten diese unter die linke Spalte rutschen.

Es müssen nun also nur die Bereiche im Head und der Navigation umeinander getauscht und im Content die linke Spalte entfernt werden:

- die Spalte links (Menü der untergeordneten Seiten) ganz weglassen, dafür den Hauptblock bis an den linken Rand gehen lassen,

Wir nehmen die äußere Aufteilung in ein Viertel/drei Viertel (3/12 : 9/12) und die darin befindliche linke Spalte raus:
Entferne

<!-- ASIDE NAV -->
<div class="hide-s m-12 l-3">                     
    <div class="aside-nav-noresponsee">
            <?php echo $asidenav; ?>						
    </div>
      <?php if ($block[5]!='') {
	       echo $block[5];
       } ?>
	&nbsp;
</div>
<!-- MAIN CONTENT AND OPTIONAL BLOCKS -->
     <div class="s-12 l-9 maincontent">                  				  

Ändere

       </div>
      </div>
    </div>
  </div>
</section>
<!-- FOOTER -->

zu

      </div>
    </div>
  </div>
</section>
<!-- FOOTER -->

- das Logo und den Headerplatz tauschen

Der ein Viertel (3/12) breite Logo-Bereich wird hinter den drei Viertel (9/12) breiten Bilderbereich gesetzt:
Ändere

<div class="s-12 l-3">
    <a href="<?php echo WB_URL; ?>"><img class="logo center" src="<?php echo $logo; ?>" alt=""></a>
</div>
 <div class="s-12 l-9">
    <div id="header-carousel" class="owl-carousel owl-theme">
        <?php foreach($pics as $pic) {						   
		echo $picPre.$pic.$picPost;
         } ?>				  
    </div>
</div>           

zu

<div class="s-12 l-9">
     <div id="header-carousel" class="owl-carousel owl-theme">
	   <?php foreach($pics as $pic) {						   
		echo $picPre.$pic.$picPost;
	    } ?>			  
     </div>
</div>     
<div class="s-12 l-3">
       <a href="<?php echo WB_URL; ?>"><img class="logo center" src="<?php echo $logo; ?>" alt=""></a>
</div>		

- den Platz für "Suche" und das Menü tauschen,

Ändere

 <?php if (SHOW_SEARCH) { ?>
<div class="hide-s m-12 l-3">                  
	<form class="wbcesuche" name="search" action="<?php echo WB_URL; ?>/search/index.php" method="get">
		<input type="hidden" name="referrer" value="<?php echo defined('REFERRER_ID') ? REFERRER_ID : PAGE_ID; ?>" />
		<input type="text" name="string" class="search" placeholder="<?php echo $TEXT['SEARCH']; ?>" />
		<input type="submit" name="wb_search" value="&#xe090;" />
	</form>
</div>
<?php } ?>
<p class="nav-text">Navigation</p>
<div class="top-nav s-12 m-12 l-9">
  <?php echo $mainnav; ?>
</div>

zu

<p class="nav-text">Navigation</p>
<div class="top-nav s-12 m-12 l-9">
  <?php echo $mainnav; ?>
</div>
<?php if (SHOW_SEARCH) { ?>
<div class="hide-s m-12 l-3">                  
	<form class="wbcesuche" name="search" action="<?php echo WB_URL; ?>/search/index.php" method="get">
		<input type="hidden" name="referrer" value="<?php echo defined('REFERRER_ID') ? REFERRER_ID : PAGE_ID; ?>" />
		<input type="text" name="string" class="search" placeholder="<?php echo $TEXT['SEARCH']; ?>" />
		<input type="submit" name="wb_search" value="&#xe090;" />
	</form>
</div>
<?php } ?>

Das Ergebnis:

Beitrag geändert von florian (26.10.2019 18:35:18)

---

Code allein macht nicht glücklich. Jetzt spenden!

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Rechnen müsste man können. Drei Zwölftel sind natürlich nur ein Viertel und nicht ein Drittel. Angaben oben korrigiert.

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

Hallo florian, ich bin restlos begeistert von Deiner Dokumentation. Sie hat alle meine Fragen beantwortet. Vielen Dank! Jetzt kann ich mich ausgiebig, mit Freude und mit Hintergrundwissen an die Arbeit begeben.
Noch eine kleine Frage: ich möchte in den rechten Block mit dem Modul "Topics" aktuelle Themen aufnehmen. Die Einträge sind aber nicht mit einem Rahmen versehen. Wie kann ich erreichen, dass jeder Eintrag von den anderen durch einen Rahmen abgegrenzt ist (auch zum Menü und dem Hauptblock?

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Die Neueren/Älteren Themen-Links von Topics haben von Haus aus jeweils die Klasse "pnsa_block".
Du kannst im Template-Stylesheet beispielsweise ergänzen:

a.pnsa_block {
border:1px solid #ccc;
margin:0.5em 0;
padding:0.5em;
}

Da käme dann so etwas bei heraus:

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

Vielen Dank für die prompte Antwort, genau so möchte ich es haben, aber ich habe noch nicht den Überblick und bin noch nicht in der Lage, die genaue Einfügestelle zu finden. Kannst Du sie mir aufzeigen?

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Das kannst Du in die /templates/wbcezon/css/wbcezon.css vor

/* --------------------------- pics ------------------------------------ */

einfügen.

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

ich habe die Ergänzung an dem entsprechenden Platz eingefügt (siehe beigefügtes Bild), aber es wird kein Rahmen ausgegeben. Was habe ich falsch gemacht?

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Browsercache geleert?

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

Ja, habe ich.
Auch beim Austausch des Moduls "Topics" durch das Modul "News with Images" kommt kein Rahmen.

Beim Austausch durch das Modul "News" kommt folgende Fehlermeldung:
"Fatal error: Cannot redeclare rm_full_dir() (previously declared in G:\xampp\htdocs\framework\functions.php:38) in G:\xampp\htdocs\framework\functions.php on line 75"

Was mache ich falsch?

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Rahmen um Topics: Ich habe es getestet, bei mir funktioniert das so.
Bitte prüfe, ob Du die Styleanweisung zwischen der letzten geschweiften Klammer und dem Kommentar eingefügt hast (so wie im Screenshot ersichtlich). Du kannst es auch ganz ans Ende setzen oder in die frontend.css in /modules/topics.
Prüfe auch, was bei Topics bei Optionen > Siehe auch, vorherige nächste hinterlegt ist, wenn dort etwas Abweichendes steht, muss die Style-Anweisung entsprechend angepasst werden.

Vielleicht reden wir auch aneinander vorbei und Du meinst gar nicht die Neueren/Älteren Beiträge, sondern einen in der rechten Spalte platzierten Topics-Master?

Dass bei NWI keine Rahmen erscheinen ist klar, da das Modul völlig anderes HTML und CSS generiert.

Fehlermeldung News: Update auf 3.5.12 machen.

Beitrag geändert von florian (29.10.2019 10:44:43)

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

Vielen Dank für Deine Erklärungen, aber egal, welche Veränderungen ich probiere, ich kann keine Veränderungen im Frontend erkennen. Wo/wie kann ich zum Beispiel erreichen, dass der Bereich, der das Modul "Topics" enthält (m. E. der Block 2), zur Abgrenzung im ganzen einen hellgrauen Hintergrund erhält?
Ich bin noch nicht in der Lage, dieses Ansinnen zu realisieren und bitte Die sehr um Unterstützung.

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Wenn sich aus den Änderungen keine sichtbaren Ergebnisse ergeben, läuft etwas grundlegend falsch.
Möglicherweise bearbeitest Du das falsche Template bzw. die Datei im falschen Verzeichnis oder es liegt an XAMPP (damit bin ich noch nie zurecht gekommen)  oder wir reden hier komplett aneinander vorbei.

Anbei das Template mit den Änderungen so wie ich sie verstanden habe, also keine linke Spalte, Hauptspalte über die gesamte Breite, grau abgesetzter rechter Block. Einfach über Erweitrungen > Templates installieren und dann bei den Grund- oder seiteneinstellungen das Template "WBCEZon-reini" auswählen.

---

Code allein macht nicht glücklich. Jetzt spenden!

reini

Mitglied

Re: Designveränderungswünsche beim Template WBCEZon

Guten Morgen!
Ja, genau so habe ich es mir vorgestellt!, velen Dank!
Ich weiß zwar immer noch nicht, warum es bei mir nicht funktioniert hat, aber ich werde es noch herausfinden.

tomno399

Gast

Re: Designveränderungswünsche beim Template WBCEZon

Ich habe mal geschaut, ob ich die rechte Spalte etwas breiter bekomme. Sah dann, dass die Gesamtbreite auf 1140px ausgelegt ist. Nun wäre es für mich einfach, den Wert auf beispielsweise 1280px zu erhöhen, dann wäre auch die rechte Spalte breiter.

Leider funktioniert das nicht so wie "einfach" gedacht. Was muss ich tun?

florian

Administrator

Re: Designveränderungswünsche beim Template WBCEZon

Um die Gesamtbreite zu erhöhen:
in der index.php des Templates

 <body class="size-1140">

ändern zu

 <body class="size-1280">

(oder noch breiter:  <body class="size-1520">. Keine Zwischenschritte, das sind fest definierte Styles!)

Um das Seitenverhältnis zu verändern mit den l-9 / l-3 -Anweisungen im Template rumexperimentieren. Die beiden Werte für Haupt- und Seitenspalte müssen zusammen immer 12 ergeben.

---

Code allein macht nicht glücklich. Jetzt spenden!