WBCE CMS Forum

WBCE CMS – Way Better Content Editing.

Du bist nicht angemeldet.

#1 13.12.2016 10:29:54

stefanek
Developer

Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Das folgende ist aus meiner privaten Kommunikation, die ich vor einiger Zeit an Chio geschickt habe.
Ich schreib es hier hin, da es auch für andere Interessant ist und auch, damit das nicht in meiner PM Box vermodert.
Und da auch immer wieder über fehlende Standards gesprochen wird...

~~ Beginn ursprünglicher Nachricht  (Code etwas angepasst inzwischen) ~~

Templates und deren Blocks (Layout-Blöcke)

Arbeite grade an einem Template für einen Kunden und ich war es wieder mal leid, die häßlichen page_contents mit ob_start abzufragen.
Man verliert schnell den Überblick welche Variablen man für welchen Block vergeben hat usw.
Dieses kleine Snippet habe ich mir dann am Anfang der index.php platziert:

// put page_content() contents into array $block
// it will correspond with $block array in the info.php 
require_once __DIR__.'/info.php';
foreach($block as $k=>$v){
	ob_start(); page_content($k); $block[$k] = ob_get_clean();
}

Im Template dann:

<?php if(!empty($block[3])){
	echo $block[3];
}?>

Oder einfachste/kürzeste Variante, falls man drauf steht:

<?php echo(!empty($block[3]) ? $block[3] : '' ); ?>

Das nette ist, man kann immer mit der info.php vergleichen und weiß, was in welchem $block[nummer] sich befindet.
Und das snippet ist kurz genug, dass man sich nicht das Template unnötig zumüllt.

~~  Ende der ursprünglichen Nachricht ~~

Vergleich das mal mit jedem beliebigen Multi-Block Template und Du wirst sehen, wieviel Übersicht Du mit dieser vorgeschlagenen Methode in das Template reinbekommen kannst.

Update

09.01.2017

Nachtrag:

Interessant ist natürlich auch, dass diese Variante (zumindest momentan) 100% kompatibel mit den WebsiteBaker.org Templates ist.

Wenn das auch nicht mein primäres Augenmerk ist, so ist es dennoch nicht völlig egal.

Primär beschäftigt mich die Einfachheit und schnelle Nachvollziehbarkeit des Codes auch (oder grade) für User, die wenig PHP Hintergrundwissen  haben.
Auch wenn man nicht unbedingt den Code des Templates gleich sieht, irgendwann beginnt für den User der Moment, wo er das Template hier oder da "tweaken" oder "customizen" will.
Wenn er dann vor einer Code-Wand wie dieser hier steht...
https://github.com/WBCE/WebsiteBaker_Co … p#L81-L105

<?php
ob_start();
page_content(1);
$main = ob_get_contents();
ob_end_clean();
ob_start();
page_content(2);
$fulltop = ob_get_contents();
ob_end_clean();
ob_start();
page_content(3);
$left = ob_get_contents();
ob_end_clean();
ob_start();
page_content(4);
$right = ob_get_contents();
ob_end_clean();
ob_start();
page_content(5);
$fullbottom = ob_get_contents();
ob_end_clean();
ob_start();
page_content(6);
$hero = ob_get_contents();
ob_end_clean();

... könnte es die Lernkurve ziemlich erschweren und den Lernmut blockieren.

Dieser Verbesserungsanstoß ist also darauf ausgerichtet es dem User zu vereinfachen und das ganze transparenter zu halten.



have fun,
Christian

Beitrag geändert von stefanek (09.01.2017 09:46:35)


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#2 13.12.2016 10:33:18

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Ach so, es ist nicht üblich Fremde Inhalte öffentlich zu teilen, deswegen sag ich nur, dass Chio's Reaktion darauf positiv war.

;-)

Christian


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#3 13.12.2016 10:33:53

florian
Administrator

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

thumb_up


Code allein macht nicht glücklich. Jetzt spenden!

Offline

#4 13.12.2016 10:56:48

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Habe das Schnippsel von diesem:

[== Undefiniert ==]
// put page_content() contents into array $block
// it will correspond with $block array in the info.php 
require_once __DIR__.'/info.php';
$blocks = array();	
foreach($block as $key=>$val){
	ob_start();		
	page_content($key); // main content
	$blocks[$key] = ''.ob_get_contents();
	ob_end_clean();
}
$block = $blocks;

auf dieses reduziert.

require_once __DIR__.'/info.php';
foreach($block as $k=>$v){
	ob_start(); page_content($k); $block[$k] = ob_get_clean();
}

Ein bisschen Zen schadet nicht. ;-)
(So lasse ich es auch ins Template)

Christian

Beitrag geändert von stefanek (14.12.2016 01:37:30)


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

Liked by:

sillar

#5 09.01.2017 09:48:15

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Kleiner Nachtrag im Öffnungspost.

Christian


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#6 09.01.2017 10:15:54

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

[Vorab: dieser Post ist nur für jene, die wirklich über die Kompatibilität ihrer Addons (in diesem Falle Templates) besorgt sind.]

Mehr über Kompatibilität zu WB.org.

Bei WebsiteBaker weiß man nicht genau, wie es um die Kompatibilität bestellt sein wird, sollte eine folgende Version von WebsiteBaker kommen.
Dennoch, einige Informationen sickern durch und so sollen wohl "irgendwan" die info.php Dateien abgeschafft werden.
Ob es nur für Module oder sämtliche Addons gelten soll, weiß ich nicht.

Wie dem aber auch sei, es gibt eine Lösung -- in Kombination mit der obigen Empfehlung (aber auch ohne) -- wie man sich für die Zukunft absichern kann, zumindest teilweise.



Hier die Empfehlung:

1) erstelle eine neue PHP Datein innerhalb des Template-Ordners, benenne sie "info_details.php" (oder wie auch immer)
2) Öffne die info.php Deines Templates und schneide die $block und $menu arrays heraus und füge sie in die neu erstellte info_details.php ein
3) in der info.php füge ganz unten ein
require info_details.php

Das war's dann erstmal.

Sollte WebsiteBaker die info.php irgendwann endgültig abschaffen, muss man natürlich trotzdem wieder Hand anlegen und das Array dann an deren neue Lösung anpassen.
(Je nachdem, was es dann sein wird.)

Was wichtiger ist, hier würden die Templates weiterhin laufen.

Dieser Anstoß stellt sozusagen eine Weiche für eine möglicherweise nötige Weiche dar.
Grade dann, wenn der Verbesserungsanstoß aus dem Öffnungs-Post umgesetzt wird, empfehle ich dieses Vorgehen (wenn Kompatibilität angestrebt wird), denn es kann sogar sein, dass das $block Array komplett wegfällt. (Oder: weiß man's?)

Have fun,
Christian

Beitrag geändert von stefanek (09.01.2017 10:19:47)


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#7 09.01.2017 10:17:59

florian
Administrator

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Das Modul Topics bietet bekanntlich die Möglichkeit, bestimmte Inhalte in einem zweiten Block anzuzeigen.
Um Templates, die nach dem oben vorgestellten Schema die Blöcke erfassen, dafür vorzubereiten, muss nach der foreach-Schleife noch eingefügt werden:

if(defined('TOPIC_BLOCK2') AND TOPIC_BLOCK2 != '') { 
		 	$block[2] = TOPIC_BLOCK2;
		}

Das mit WBCE 1.x mit ausgelieferte Frontend-Template "WBCE" ist nicht als Einsteigertemplate gedacht gewesen, war zugegebenermaßen schnell von mir Universaldilettanten zusammengeklappert und wird in WBCE 1.2 nicht mehr enthalten sein.


Code allein macht nicht glücklich. Jetzt spenden!

Offline

Liked by:

stefanek

#8 09.01.2017 10:48:48

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

florian schrieb:

Das Modul Topics bietet bekanntlich die Möglichkeit, bestimmte Inhalte in einem zweiten Block anzuzeigen.
Um Templates, die nach dem oben vorgestellten Schema die Blöcke erfassen, dafür vorzubereiten, muss nach der foreach-Schleife noch eingefügt werden:

if(defined('TOPIC_BLOCK2') AND TOPIC_BLOCK2 != '') { 
		 	$block[2] = TOPIC_BLOCK2;
		}

Guter Hinweis, Florian.

florian schrieb:

Das mit WBCE 1.x mit ausgelieferte Frontend-Template "WBCE" ist nicht als Einsteigertemplate gedacht gewesen, war zugegebenermaßen schnell von mir Universaldilettanten zusammengeklappert und wird in WBCE 1.2 nicht mehr enthalten sein.

Ich weiß über die downside der Copy&Paste Programmierung bescheid ;-)

Es liegt mir fern, jemandem absichtlich auf die Füße zu treten.
Dieses Template habe ich nur als Beispiel genommen, weil es auf GitHub zugänglich ist.

"Das mit WBCE 1.x mit ausgelieferte Frontend-Template "WBCE" ist nicht als Einsteigertemplate gedacht gewesen"
Verstehe, auf der anderen Seite ist der Einstieg auch in komplexere Template-Strukturen einfacher, wenn sie nachvollziehbarer programmiert sind.

Gruß,
Christian


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#9 09.01.2017 11:02:18

grindbatzn
Gast

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Ja. Die Sache mit dem Block 2

In neueren Versionen wird auch ein MODULES_BLOCK2 definiert.

define("TOPIC_BLOCK2", $topic_block2); //define always to prevent from double-Topics
if (!defined("MODULES_BLOCK2")) {define("MODULES_BLOCK2", $topic_block2); }

zb auch Bakery könnte das nutzen, oder eben andere Module.
Voraussetzung ist, dass Block 1 VOR Block 2 geholt wird, sonst ist die Konstante noch nicht vorhanden.

Ich bin aber unschlüssig, wie die empfohlene Verwendung ist.
Bei Topics-Seiten ist am besten: Block 2 ersetzen. Ansonsten wäre Anhängen besser.

#10 09.01.2017 11:12:23

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

//In neueren Versionen wird auch ein MODULES_BLOCK2 definiert.
define("TOPIC_BLOCK2", $topic_block2); //define always to prevent from double-Topics
if (!defined("MODULES_BLOCK2")) {define("MODULES_BLOCK2", $topic_block2); }

Das ist ein Ausschnitt aus wo?
Aus Topics?
Und das wäre eine Empfehlung auch für andere Module wie Bakery etc.?
Oder kannst Du ggfs weiter ausführen?

In der Regel ist das, um es auch für andere zu erläutern, egal welche Werte ihr den bestehenden Array-Keys übergibt.

Man könnte auch sowas machen:

if(!empty( $block[2])) { 
   $block[2] = "Lorem Ipsum dolor sit amet";
}

Oder eine Datei inkludieren und deren Inhalt da rein stopfen.

Beitrag geändert von stefanek (09.01.2017 11:16:38)


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#11 09.01.2017 13:40:06

grindbatzn
Gast

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Ich bin gerade dabei, ein "Schweinderl das alles macht"-Template zu machen.
Da steht mal drin, was ich weiß. Dann können wird drüber reden, was und wie Best Practice ist.

#12 09.01.2017 15:51:16

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Bei dem Öffnungspost geht es mir darum, den User auf einfache Weise an eine der Mechaniken von Templates, nämlich Layout-Blöcke, heranzuführen.

Wenn Du da weitere taugliche Sachen hast, die in diese Richtung gehen, schaue ich es mir gerne an.


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

#13 03.09.2017 13:29:42

stefanek
Developer

Re: Ein Verbesserungsanstoß für Templates mit mehreren Layout-Blöcken

Wie ich sehe ist die oben von mir vorgestellte Methode in die Profi-Liga Templates eingeflossen.

Ich habe mir die beiden Templates Hortal und Vertal auf GitHub angeschaut und es ist mir noch eine weitere Sache aufgefallen, die man verbessern kann.

Es hat mit dieser Zeile (wie auch den Folgenden) zu tun:
https://github.com/WBCE/WBCE_CMS/blob/m … ex.php#L18
Also mit dem refreshstring.

Das Problem ist, dass die CSS Dateien immer neu geladen werden und nie aus dem Cache.
Auch wenn sich an den CSS Files nichts geändert hat, werden sie jedes Mal auf's neue vom Server geladen.

Kommentiert man die Zeile 18 aus, wird das CSS hingegen nur dann neu geladen, wenn der User eingeloggt ist.
Das resultiert dann darin, dass der Admin der die CSS Files dann geändert hat zwar auch die neuen CSS Änderungen sieht, aber ein Besucher der öfter auf die Seite kommt nicht unbedingt (er hat die alte CSS wahrscheinlich noch im Cache und diese wird geladen).

Ich habe vor mehreren Jahren eine Funktion geschrieben, die den Browser veranlasst immer die neueste CSS herunterzuladen, indem die Funktion zuerst auf dem Server schaut, ob es eine neuere Version als die im Cache vorhanden ist. (Durch Datumsvergleich.)

Bei Templates an denen ich arbeite habe ich diese Funktion(en) immer mit dabei, sowohl für CSS als auch für JS, sodass die Änderungen auch von allen gleich nach dem Einspielen gesehen werden.

Die Funktionen sind
fresh_css und fresh_js.
die Funktion fresh_file ist nur eine Hilfsfunktion

<?php


if (!function_exists('fresh_file')) {
	function fresh_file($file) {
		$fileLoc          = TEMPLATE_DIR.$file;
		$fresh_used_file  = str_replace(WB_URL, WB_PATH, $fileLoc);
		if(file_exists($fresh_used_file)){
			$fileLoc  = $fileLoc.'?'.filemtime ($fresh_used_file);
		}
		return $fileLoc;
	}

	function fresh_css($sCssFile) {
		$sFileString = false;
		if($file = fresh_file($sCssFile)){
			$sFileString = "\t".'<link rel="stylesheet" href="'.$file.'">'.PHP_EOL;
		}
		return $sFileString;
	} 

	function fresh_js($sJsFile)	{
		$sFileString = false;
		if($file = fresh_file($sJsFile)){
			$sFileString = "\t".'<script type="text/javascript" src="'.$file.'"></script>'.PHP_EOL;			
		}
		return $sFileString;
	} 
}

Danach kann ich, anstatt z.B.


<link href="<?php echo TEMPLATE_DIR; ?>/editor.css<?php echo $refreshstring; ?>" rel="stylesheet" type="text/css" />

Das eintragen

<?=fresh_css('/editor.css') ?>

Bei JS Dateien dann respektive

<?=fresh_js('/js/myjsfile') ?>

So werden immer die frischen Dateien gezogen.

Es hat auch den Vorteil, dass es "weniger tippen" ist.
Und wenn man eine Datei mal nicht eingebunden haben will, reicht eine Raute, wie hier:

<?=#fresh_css('/editor.css') ?>

Dann wird das File nicht mehr geladen.

Das ist jetzt keine weltbewegende Neuerung, aber das ganze hat den Vorteil, dass alle Änderungen (auch wenn man direkt on-site, z.B. mit dem AFE arbeitet) immer fresh nachgeladen werden.

Vielleicht ist das von irgendeinem Nutzen für den ein oder anderen. wink

(Ist nicht nur für Templates mit einem eingebauten Template-Editor gut.)

Christian

Beitrag geändert von stefanek (03.09.2017 13:48:47)


“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

Offline

Fußzeile des Forums

up