Page 1 of 3

Jede Ebene mit anderem Hintergrundbild versehen

Posted: Mon 5. Mar 2018, 11:54
by Uwe367
Hallo allerseits.
Wie gehe ich am sinnvollsten vor wenn ich jeder Ebene/Kategorie ein anderes Hintergrundbild zuweisen möchte?
Es handelt sich dabei NICHT um einen Onepager bei dem ich das einfach in die Sections packen könnte.
Ich dachte schonmal daß man das über das Feld CSS Klasse im BE bei der entsprechenden Ebene einbauen könnte. In der CSS Klasse dann entsprechend das Bild definieren und am besten gleich so daß es responsive ist. Wäre das zu empfehlen oder gibt es einen anderen, vielleicht besseren Weg? Mir würde derzeit nichts anderes einfallen.

Ich meine daß Oliver vor langer Zeit mal irgendwo hier ein kleines FE Renderscript gepostet hat womit das über die Schlüsselwörter realisierbar war.....

Wobei ich gerade noch ne Frage zu diesem Feld CSS Klasse habe.
Werden dort auch mehrere Klassen gerendert wenn ich diese, z.B. durch Komma getrennt, eingebe?

[EDIT]
Also das Feld CSS Klasse ist dafür ungeeignet da die Klasse, die man dort einträgt, in der Navi gerendert wird.
[/EDIT]

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Mon 5. Mar 2018, 15:56
by update
Es gibt doch die Möglichkeit, classes in den body-tag zu schicken. Einmal über FE-render
Beispiel

Code: Select all

<?php
if(!empty($content['struct'][ $content['cat_id'] ]['acat_class'])) {
    $content['body_id'] = 'smoothscroll ';
    $template_default['body']['class'] = $content['struct'][ $content['cat_id'] ]['acat_class'];
}
if(!empty($aktion[1])) {
    $template_default['body']['class'] .= ' custom-article-id_'.$aktion[1].' what-the-hell- ';
}
else { // do nothing
   $content['body_id'] = false;
}
?>
oder über conf.template_default.inc.php

Code: Select all

$template_default['body']['class'] = 'bg-';
Jedenfalls glaube ich fest daran ;) :D

Dann kannst Du ja per CSS bg-15 und what-the-hell-42 die Hintergründe verpassen.... Probier mal, kann ja nix passieren ;)

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Mon 5. Mar 2018, 18:41
by Uwe367
Ja.. das mit der conf.template_default.inc.php hatte ich dafür auch schon im Visier und das könnte klappen da ich ja mittels CSS ID die Ebene mit ihrer ID direkt ansprechen kann. Muß ich morgen mal ausprobieren.
Danke erstmal für den Schubs :wink:

Hab hier eben nochwas gefunden. Ist zwar schon älter, aber genau das was du beschreibst. Na dann mal hoffen daß das noch funktioniert und nicht in einem Updateprozess entfernt wurde. Und nach diesem Beispiel wird der body jedes mal neu gerendert und bekommt die ID bzw. Klasse zugewiesen die vorher deklariert wurde.
viewtopic.php?p=141749#p141749

Danke dir nochmal :D

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Mon 5. Mar 2018, 20:21
by update
Welcome :-)

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 09:42
by Uwe367
Also ich habe das jetzt mal Olivers Beispiel in dem verlinkten Thread lokal nachgebaut, aber die ID der jeweiligen Kategorie wird nicht zur CSS Klasse bzw. ID, die ich in der conf.template.default.inc.php setzte, gerendert. Als body id und body class habe ich jeweils "cat" gesetzt. Jedoch wird dazu keine Kategorie ID gerendert. Dabei spielt es keine Rolle in welcher Ebene ich mich gerade im FE befinde.
Eigentlich sollte doch nun zur der definierten Klasse/ID die jeweilige Kategorie ID gerendert werden oder verstehe ich da was falsch?

conf.template.default.inc.php:

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = 'cat';
$template_default['body']['class'] = 'cat';
CSS:

Code: Select all

bg {
    position: relative;
    width: 1000px;
    height: 400px;
    background: #eee;
}
.cat0 bg, #cat0 bg{
	background-image: url(../images/1.jpg);
}

.cat1 bg, #cat1 bg {
	background-image: url../images/2.jpg);
}
Und das wird gerendert:

Code: Select all

<body id="cat" class="cat">
Es wird also keine Kategorie ID gerendert, sondern lediglich die Klasse bzw. ID, die ich in der conf.template.default.inc.php eingetragen habe oder habe ich hier ein Verständnisproblem?

Achso.... verwendete Version ist phpwcms 1.9.0-rc.2 (2018/02/01, r549)

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 11:24
by kmstario
Moin moin,

habs auch mal getestet und offensichtlich wurde die angehängte ID wieder rausgenommen.
Jetzt ist es im Prinzip wie "früher", dass nur die Klasse ausgegeben wird, welche eingetragen wurde.

Jetzt bleibt wohl eher der Weg über einen kleinen JS Schnipsel, der im Haupttemplate hinterlegt werden kann und in jeder Kategorie ein eigenes Ergebnis erzeugt.

Code: Select all

<!-- JS: 
  $(document).ready(function() {
    $('body').addClass('js-{CATEGORY}');
  });
-->
<!-- CSS: 
body.js-{CATEGORY} { 
background-image: url(../picture/white.png);
background-repeat: no-repeat;
background-position: center center;
background-size:cover; } 
-->
Die CSS Anweisung kann natürlich auch in die entsprechende Datei.

VG Andreas

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 11:30
by Uwe367
Danke Andreas.
Ich habs vorübergehend anders gelöst und das klappt.
In der index.php habe ich diese beiden Zeilen...

Code: Select all

if(!empty($template_default['body']['id'])) {
    $content['page_start'] .= ' id="'.$template_default['body']['id'].$content['body_id'].'"';
}
if(!empty($template_default['body']['class'])) {
    $content['page_start'] .= ' class="'.$template_default['body']['class'].$content['body_id'].'"';

um die ID ergänzt und das scheint bisher zu klappen...

Code: Select all

if(!empty($template_default['body']['id'])) {
    $content['page_start'] .= ' id="'.$template_default['body']['id'].$content['body_id'].$content['cat_id'].'"';
}
if(!empty($template_default['body']['class'])) {
    $content['page_start'] .= ' class="'.$template_default['body']['class'].$content['body_id'].$content['cat_id'].'"';
Ich werde diese Änderung auch in meinem Issue eintragen und sehen was Oliver dazu sagt.

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 11:33
by update
So hatte ich das auch mal ;)
Spiel doch noch mal mit dem FE-Render-Script, das ich oben als Beispiel gepostet hatte...

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 11:42
by Uwe367
update wrote: Tue 6. Mar 2018, 11:33 So hatte ich das auch mal ;)
Spiel doch noch mal mit dem FE-Render-Script, das ich oben als Beispiel gepostet hatte...
Werde ich gerne mal ausprobieren, aber was meinst du woher ich diese Erweiterung für die index.php habe? :wink:

Code: Select all

$content['cat_id']
Genau aus deinem FE Renderscript. Ich wußte daß es für die Kategorieen einen solchen Wert gibt aber ich wußte nicht wie der aussah und in dem Script hab ich ihn gefunden :D
Und wenn ich in der conf.template.default.inc.php keine Klasse oder ID eintrage, so wird auch die Kategorie ID nicht gerendert was auch in Ordnung ist.

Was ich allerdings an deinem Frontend-Renderscript besser finde ist daß es updatesicher ist. Es ist nach wie vor schade daß man Änderungen, die man an der conf.template.default.inc.php vornimmt, nicht in einer eigens definierten Datei speichern kann denn zu gerne vergisst man schonmal diese vorher zu sichern.

Aber auch das JS Snippet ist eine gute und vor allem updatesichere Lösung.

Danke euch beiden für eure Hilfe und Vorschläge :D

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Tue 6. Mar 2018, 19:47
by Uwe367
Uwe367 wrote: Tue 6. Mar 2018, 11:42Es ist nach wie vor schade daß man Änderungen, die man an der conf.template.default.inc.php vornimmt, nicht in einer eigens definierten Datei speichern kann denn zu gerne vergisst man schonmal diese vorher zu sichern.
Also ich habe mir nun nochmal das mit der custom_settings.php angeschaut (inc_settings/template_default).
Hier ist es möglich eine eigene Definitionsdatei anzulegen, z.B. my_settings.php.
In dieser lege ich meine kompletten Änderungen ab, die ich Normalerweise in der conf.template.default.inc.php vornehme. Es werden sämtliche, durchgeführten Änderungen aus dieser Datei übernommen und das was Standart bleiben soll, wird aus der conf.template.default.inc.php übernommen. Zu gut deutsch... ich brauche in der conf.template.default.inc.php nichts zu verändern. Somit ist das ganze dann auch absolut updatesicher.
Man muß lediglich im Haupttemplate die neu angelegte Datei auswählen.
Image

Man kann damit auch nur eine oder mehrere Kategorieen steuern, oder aber eben das Haupttemplate.

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Thu 8. Mar 2018, 10:10
by Oliver Georgi
Daran denken, wirklich nur die geänderten Werte zu setzen. Siehe https://github.com/slackero/phpwcms/blo ... gs.php#L15

Ansonsten habt ihr ja weitere mögliche Lösungen beschrieben. Dabei sollte das injekten mittels JavaScript die allerletzte Möglichkeit sein.

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Thu 8. Mar 2018, 10:41
by Uwe367
Oliver Georgi wrote: Thu 8. Mar 2018, 10:10 Daran denken, wirklich nur die geänderten Werte zu setzen.
Ja klar. Wenn man sich wirklich durchliest was in der Datei als Beschreibung steht...
Use this to overwrite the default "template_default" settings.
It allows to set alternative behavior on a per structure level basis.
The defaults are located here "include/config/conf.template_default.inc.php"
Set only those values which should overwrite the defaults.
There is no need to use the complete set of vars.
Both arrays will be merged while frontend rendering process.
und der englischen Sprache einigermaßen mächtig ist, sollte das selbsterklärend sein.
Und wenn man dazu noch eine eigene Definitionsdatei, z.B. my_settings.php, anlegt und diese auswählt ist man auch bei einem Update auf der absolut sicheren Seite.

Was mir aber gerade auffällt ist dieser Passus:
on a per structure level basis
Das könnte den Anschein erwecken daß diese Datei nur bei den Ebenen greift, was aber ncht stimmt denn ich kann sie im Haupttemplate sowie aber auch in den einezlnen Ebenen auswählen. Bei einer Auswahl im Haupttemplate greift sie dann über die ganze Seite.
Wäre das so wie beschrieben, könnte ich sie nicht im Haupttemplate auswählen und somit dürfte auch der body TAG nicht verändert werden oder verstehe ich da was falsch?

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Thu 8. Mar 2018, 11:00
by Oliver Georgi
Das bedeutet, diese funktionieren nicht rekursiv.

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Sat 10. Mar 2018, 21:06
by Uwe367
Ok, habe ich verstanden.
Aber ich habe das ganze mit dem Rendern der Kategorie ID noch etwas erweitert. Nun kann ich mittles Schalter '1' in der conf.template.default.inc.php selbst entscheiden ob die ID´s der Kategorieen im Quellcode gerendert werden soll oder nicht.
Banales Beispiel:
Ich will über die ganze Seite ein Hintergrundbild definieren. Werden die ID´s fest gerendert, so hätte ich Mehrarbeit da ich jede Kategorie via CSS formatieren müßte. Möchte ich jeder Kategorie etwas individuelles mitgeben, so lasse ich die ID rendern.
Nun wäre die Frage ob das was sinnvolles ist oder nicht. Mir war einfach danach das mal umzusetzen. Hat ja für mich auch einen Lernfaktor in Sachen PHP.

Ich stells hier mal online und wers ausprobiern möchte.. bitte sehr.
Änderung in der index.php:

Code: Select all

// inject body tag in case of class or id attribute
$content['page_start'] .= '<body';
if(!empty($template_default['body']['id'])) {
if($template_default['cat_id']==1) {
	$content['page_start'] .= ' id="'.$template_default['body']['id'].$content['body_id'].$content['cat_id'].'"';
}

else {
	$content['page_start'] .= ' id="'.$template_default['body']['id'].$content['body_id'].'"';
}
}
//if(!empty($template_default['body']['id'])) {
//    $content['page_start'] .= ' id="'.$template_default['body']['id'].$content['body_id'].'"';
//}

if(!empty($template_default['body']['id'])) {
if($template_default['cat_id']==1) {
	$content['page_start'] .= ' class="'.$template_default['body']['class'].$content['body_id'].$content['cat_id'].'"';
}
else {
	$content['page_start'] .= ' class="'.$template_default['body']['class'].$content['body_id'].'"';
	
//if(!empty($template_default['body']['class'])) {
    //$content['page_start'] .= ' class="'.$template_default['body']['class'].$content['body_id'].'"';	
}
}
$content['page_start'] .= '>'.LF;
Erweiterung in der conf.template.default.inc.php:

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = '';
$template_default['body']['class'] = '';
$template_default['cat_id'] = ''; //Set '1' to render Category ID

Re: Jede Ebene mit anderem Hintergrundbild versehen

Posted: Sun 11. Mar 2018, 06:16
by Oliver Georgi
Hier liegt bereits alles, was Du benötigst:
https://github.com/slackero/phpwcms/blo ... ody_id.php

Es ist nicht nötig, die index.php auf diese Weise zu erweitern.

Für Deinen Anwendungsfall sollte also in der frontend_render (oder init) genügen:

Code: Select all

if(!empty($template_default['cat_id'])) {
    $content['body_id'] = $content['cat_id'];
}
Du kannst natürlich jetzt noch zusätzlich gegen $template_default['body']['id'] prüfen, aber da es eh nur greifen soll, wenn $template_default['cat_id'] gesetzt ist, liegt diese Steuerung sinnvollerweise in der jeweiligen template_default Datei, indem dort dann eine passende ID gesetzt wird.

Ich bin kein großer Freund mehr von IDs an der Stelle. Eine Klasse tut es meist besser und ist bildlicher.