Wikizone - Benutzerbeiträge [de]

Microsoft 365

2024-05-08T11:57:59Z

134.3.86.14:

== Quickstart ==
In 2023/2024 hat Microsoft die meisten Dienste unter dem Terminus Microsoft 365 zusammengefasst. Diese Seite soll als Startpunkt für die Suche dienen.

== Was ist was ==
=== Admin Center ===
Zentrale Verwaltung, Billing, Benutzerverwaltung

=== Purview ===
Compliance Center

=== Azure / Entra ===
Azure AD heißt jetzt Entra.

=== Exchange ===
Postfächer etc.

=== Defender ===
Bedrohungen analysieren und reagieren

== Anmeldung ==
https://learn.microsoft.com/de-de/entra/identity/authentication/concept-authentication-methods - Einstieg
https://mysignins.microsoft.com/security-info // Self-Service Einstellungen

=== Mehrstufige Authentifizierung (MFA) ===
https://www.youtube.com/watch?v=qNndxl7gqVM
https://aka.ms/MFASetup - Benutzerregistrierung
https://go.microsoft.com/fwlink/?LinkId=627442 Handbuch
==== Telefon und E-Mail als Administrator festlegen ====
Entra Portal > Benutzer > Benutzername > Authentifizierungsmethoden

=== Bedingter Zugriff ===
=== Kombinierte Anmeldung ===
Todo

=== Probleme ===
MFA wird erzwungen, obwohl sie deaktiviert ist.
Mögliche Gründe:
* Single Sign On
* Richtlinien für bedingten Zugriff - in Azure können extra Richtlinien unter bestimmten Bedingungen definiert sein (z.b. Anmeldung außerhalb des Unternehmensnetzwerks).
* Residuale Situationen (alte Richtlinien)
* Sicherheits (Compliance) Anforderungen Azure / Entra

2024-04-20T12:48:58Z

134.3.86.14:

Beispielszenarien wie man Animationen mit ProcessWire als CMS, UIKit als CSS/JS Framework und GSAP einsetzen kann.

== Beispiele ==
=== Beispielszenario 1 - Section Animationen mit ScrollTrigger und ProcessWire ===

Hier möchten wir Animationen abspielen, die beim Scrollen abgespielt werden, wenn der Benutzer die Section erreicht.
* Die Animationen sollen für den Redakteur wählbar sein.
* Die Animationen an sich sind vorgefertigt
* Wenn sie nicht benötigt werden soll der Code nicht eingebunden werden.

==== Übersicht ====
Benötigte Dateien
_init.php
site/templates/includes/Animation.php
site/templates/includes/animations.inc
site/templates/fields/animations/myAnimationTemplate.php
site/templates/scripts/animations.js
Box.php (Optional)

'''_init.php'''
<syntaxhighlight lang="php">
// ANIMATION CODE
if($page->opt_2){
include_once('includes/Animation.php'); // include Animation Class
include_once('includes/animations.inc'); // include additional animation helper functions
page()->additionalHeaderData .= '
<link rel="stylesheet" href="'.urls()->templates.'styles/animations.css" />
<script src="'.urls()->templates.'vendor/gsap/gsap.min.js"></script>
<script src="'.urls()->templates.'vendor/gsap/gsap.min.js"></script>
<script src="'.urls()->templates.'vendor/gsap/ScrollTrigger.min.js"></script>
';
}
</syntaxhighlight>
In der '''_init.php''' laden wir die benötigten Skripte:

Über das Feld $page->opt_2 (Checkbox) kann der User festlegen ob für die Seite die benötigten Skripte geladen werden.

page()->additionalHeaderData wird in einem späteren Template eingefügt. Man könnte auch über einen Hook arbeiten, dies ist aber eine einfache effektive Lösung.

'''Animation.php''' liefert die Klasse Animation, die im wesentlichen Funktionen bietet um Code aus einem Template zu laden und in den aktuellen Markup einzubetten.

'''animations.inc''' liefert Helferfunktionen für die Layoutblocks.

'''Animation.php'''
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
class Animation extends Box
{
public $classes = array();
public $styles = array();
public $classesMarkup = '';
public $stylesMarkup = '';
public $attributes = array();

// init section with page values aka layout_block values
function __construct($classes = array('ani-box'), $styles = array(), $attributes = array()){
}

/**
* Uses a template file to create the animation markup inside a wrapper box
* @param String template filename (without suffix)
* @param Array associative Array containing rendering options
*/
function renderAnimationTemplate($animationName,$options=array()){
$defaults = array(
'box'=>false, // wrap the animation template content in a container?
'classes'=>'ani-box', // classes for the container (if used)
'assetPath'=>urls()->templates.'assets/animations', // path to animation assets - can be used by templates
'templatePath'=>'animations/'.$animationName // render templates starting at /site/templates/
);
$options = array_merge($defaults, $options);
$options['animationName'] = $animationName;
$animationBoxContent = page()->renderValue($options,$options['templatePath']);

$animationBox = new Box();
if($options['classes']) $animationBox->addClasses(preg_replace("/[^a-zA-Z0-9-\s]+/", "", $options['classes']));
$animationBox->addClasses($animationName);
if($options['box']) $animationBoxContent = $animationBox->wrap($animationBoxContent,'div');

return $animationBoxContent;
}
}

</syntaxhighlight>
Die Klasse Animation bekommt von der Klasse Box alle Funktionen zum einfachen erstellen von HTML Containern mit Klassen und Attributen. Das kann man auch selbst machen. Wichtig ist aber die '''renderAnimationTemplate''' Funktion. Diese holt ein Template welches im Ordner
site/templates/fields/animations/meinAnimationsName.php
liegt.

'''animations.inc'''
<syntaxhighlight lang="php">
/**
* animations.inc
* Helperfunctions for animations with gsap and processwire
* needs Animation Class from Animation.php
* mainly used in layoutblocks to render animation markup if nessecary
*/

/**
* renderAnimationCode
* @param Page
* @param String - Markup we need to expand with animation markup
* @return String
*/
function renderAnimationCode($page,$out){
$ani = new Animation();
if($page->fp_section->section_animation && $animationName = $page->fp_section->section_animation->value){
// get animation markup
$animationContent = $ani->renderAnimationTemplate($animationName,array('box'=>true));
// as animation object extends Box we can use it to add additional wrapper
$ani->addClasses('ani-wrapper');
$ani->addClasses('ani-wrapper-'.$animationName);
$out = $ani->wrap($out.$animationContent); // wrap section markup + animation markup in a container
}
return $out;
}</syntaxhighlight>

Diese kann von unseren Seitentemplates (wir nutzen eigene Templates für verschiedene Inhaltstypen) um jeweils am Ende den '''Code für die gewünschte Animation einzufügen'''.

Im Backend kann der User über ein Dropdown Feld (section_animation) eine Animation auswählen. Hat er das getan wird über $page->fp_section->section_animation der Wert des Feldes ausgelesen. Unsere Animationstemplates entsprechen diesem Namen. Wir erstellen ein Animations Objekt und übergeben diesen an Animation->renderAnimatioinTemplate(). Daraufhin wird uns der benötigte code zurückgegeben. Da das Animation Objekt auch alle Box Funktionen beinhaltet, können wir es auch gleich nutzen um einen Wrapper drumrum zu legen.

'''myTemplate.php'''
<syntaxhighlight lang="php">
$parent = getRepeaterParent($page); // Helper function to get parent page if we are in a repeaterMatrix (see below)
if($parent->opt_2){
$out = renderAnimationCode($page,$out);
}
return $out;
</syntaxhighlight>
Dies ist unser Haupttemplate. Hier starte ich den Vorgang.
Wichtig ist hier nur, dass wir lediglich die Helferfunktion renderAnimationCode aufrufen müssen. Der Rest geht durch unsere Vorarbeiten automatisch.

Optional: Ich starte das nur, falls der User für die Seite Animationen (hier im Feld opt_2 aktiviert hat. Da ich oft eine RepeaterMatrix benutze müssen wir noch die Elternseite finden. Das machen wir mit einer kleinen Hilfefunktion.

'''site/fields/animations/myAnimationTemplate.php'''

<syntaxhighlight lang="php">
// Note: $value contains all values we need as an array
$out = '';
$i1 = $value['assetPath'].'/Cloud1-S.png';
ob_start();
?>
<div class="ani-item cloud1">
<img src="<?=$i1?>">
</div>
<?php
$out = ob_get_clean();
echo $out;
</syntaxhighlight>
Dieses Template gibt uns das zusätzliche Markup für die Animation. Da wir in der Animation.php die ProcessWire Funktion $page->renderValue() verwendet haben konnten wir im ersten Parameter unsere $options an das Template weitergeben. Im Template steht und das automatisch in der Variable $value zur Verfügung.

site/templates/scripts/animations.js
<syntaxhighlight lang="javascript">
// Todo event listeners für Browserfenster Größenänderungen

gsap.registerPlugin("ScrollTrigger");
gsap.defaults({
ease: "expo.in.out",
duration: 1.3
});
// COMMON VARS
var screenWidth = window.innerWidth

$(document).ready(function(){
// ANI-CLOUD1
var cloud = $(".ani-cloud1 .cloud1")
var wCloud = cloud.outerWidth();
var hCloud = cloud.outerHeight();
var tlCloud1 = gsap.timeline({
scrollTrigger: {
trigger: cloud,
pin: false, // pin the trigger element while active?
start: "top bottom", // when the top of the trigger hits the top of the viewport
end: "top top",
scrub: 0, // smooth scrubbing (seconds)
},
repeat: 0
})
tlCloud1.fromTo(cloud, {x:0, y:hCloud/2},{x:screenWidth-wCloud, duration: 2})

// ANI TREES1
// ...

});

</syntaxhighlight>
Zu guter Letzt müssen wir in unserer JavaScript Dateien die eigentlichen Animationen hinterlegen. In unserem Fall mit GSAP.

Dieser Aufbau ist am Anfang etwas komplexer, dafür können wir unsere Animationen gut erweitern und sind super flexibel und organisiert im ProcessWire. Für den Redakteur ist die Bedienung sehr einfach.

GSAP - ProcessWire - UIKit

2024-04-20T12:47:57Z

134.3.86.14:

Beispielszenarien wie man Animationen mit ProcessWire als CMS, UIKit als CSS/JS Framework und GSAP einsetzen kann.

== Beispiele ==
=== Beispielszenario 1 - Section Animationen mit ScrollTrigger und ProcessWire ===

Hier möchten wir Animationen abspielen, die beim Scrollen abgespielt werden, wenn der Benutzer die Section erreicht.
* Die Animationen sollen für den Redakteur wählbar sein.
* Die Animationen an sich sind vorgefertigt
* Wenn sie nicht benötigt werden soll der Code nicht eingebunden werden.

==== Übersicht ====
Benötigte Dateien
_init.php
site/templates/includes/Animation.php
site/templates/includes/animations.inc
site/templates/fields/animations/myAnimationTemplate.php
site/templates/scripts/animations.js
Box.php (Optional)

'''_init.php'''
<syntaxhighlight lang="php">
// ANIMATION CODE
if($page->opt_2){
include_once('includes/Animation.php'); // include Animation Class
include_once('includes/animations.inc'); // include additional animation helper functions
page()->additionalHeaderData .= '
<link rel="stylesheet" href="'.urls()->templates.'styles/animations.css" />
<script src="'.urls()->templates.'vendor/gsap/gsap.min.js"></script>
<script src="'.urls()->templates.'vendor/gsap/gsap.min.js"></script>
<script src="'.urls()->templates.'vendor/gsap/ScrollTrigger.min.js"></script>
';
}
</syntaxhighlight>
In der '''_init.php''' laden wir die benötigten Skripte:

Über das Feld $page->opt_2 (Checkbox) kann der User festlegen ob für die Seite die benötigten Skripte geladen werden.

page()->additionalHeaderData wird in einem späteren Template eingefügt. Man könnte auch über einen Hook arbeiten, dies ist aber eine einfache effektive Lösung.

'''Animation.php''' liefert die Klasse Animation, die im wesentlichen Funktionen bietet um Code aus einem Template zu laden und in den aktuellen Markup einzubetten.

'''animations.inc''' liefert Helferfunktionen für die Layoutblocks.

'''Animation.php'''
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
class Animation extends Box
{
public $classes = array();
public $styles = array();
public $classesMarkup = '';
public $stylesMarkup = '';
public $attributes = array();

// init section with page values aka layout_block values
function __construct($classes = array('ani-box'), $styles = array(), $attributes = array()){
}

/**
* Uses a template file to create the animation markup inside a wrapper box
* @param String template filename (without suffix)
* @param Array associative Array containing rendering options
*/
function renderAnimationTemplate($animationName,$options=array()){
$defaults = array(
'box'=>false, // wrap the animation template content in a container?
'classes'=>'ani-box', // classes for the container (if used)
'assetPath'=>urls()->templates.'assets/animations', // path to animation assets - can be used by templates
'templatePath'=>'animations/'.$animationName // render templates starting at /site/templates/
);
$options = array_merge($defaults, $options);
$options['animationName'] = $animationName;
$animationBoxContent = page()->renderValue($options,$options['templatePath']);

$animationBox = new Box();
if($options['classes']) $animationBox->addClasses(preg_replace("/[^a-zA-Z0-9-\s]+/", "", $options['classes']));
$animationBox->addClasses($animationName);
if($options['box']) $animationBoxContent = $animationBox->wrap($animationBoxContent,'div');

return $animationBoxContent;
}
}

</syntaxhighlight>
Die Klasse Animation bekommt von der Klasse Box alle Funktionen zum einfachen erstellen von HTML Containern mit Klassen und Attributen. Das kann man auch selbst machen. Wichtig ist aber die '''renderAnimationTemplate''' Funktion. Diese holt ein Template welches im Ordner
site/templates/fields/animations/meinAnimationsName.php
liegt.

'''animations.inc'''
<syntaxhighlight lang="php">
/**
* animations.inc
* Helperfunctions for animations with gsap and processwire
* needs Animation Class from Animation.php
* mainly used in layoutblocks to render animation markup if nessecary
*/

/**
* renderAnimationCode
* @param Page
* @param String - Markup we need to expand with animation markup
* @return String
*/
function renderAnimationCode($page,$out){
$ani = new Animation();
if($page->fp_section->section_animation && $animationName = $page->fp_section->section_animation->value){
// get animation markup
$animationContent = $ani->renderAnimationTemplate($animationName,array('box'=>true));
// as animation object extends Box we can use it to add additional wrapper
$ani->addClasses('ani-wrapper');
$ani->addClasses('ani-wrapper-'.$animationName);
$out = $ani->wrap($out.$animationContent); // wrap section markup + animation markup in a container
}
return $out;
}</syntaxhighlight>

Diese kann von unseren Seitentemplates (wir nutzen eigene Templates für verschiedene Inhaltstypen) um jeweils am Ende den '''Code für die gewünschte Animation einzufügen'''.

Im Backend kann der User über ein Dropdown Feld (section_animation) eine Animation auswählen. Hat er das getan wird über $page->fp_section->section_animation der Wert des Feldes ausgelesen. Unsere Animationstemplates entsprechen diesem Namen. Wir erstellen ein Animations Objekt und übergeben diesen an Animation->renderAnimatioinTemplate(). Daraufhin wird uns der benötigte code zurückgegeben. Da das Animation Objekt auch alle Box Funktionen beinhaltet, können wir es auch gleich nutzen um einen Wrapper drumrum zu legen.

'''myTemplate.php'''
<syntaxhighlight lang="php">
$parent = getRepeaterParent($page); // Helper function to get parent page if we are in a repeaterMatrix (see below)
if($parent->opt_2){
$out = renderAnimationCode($page,$out);
}
return $out;
</syntaxhighlight>
Dies ist unser Haupttemplate. Hier starte ich den Vorgang.
Wichtig ist hier nur, dass wir lediglich die Helferfunktion renderAnimationCode aufrufen müssen. Der Rest geht durch unsere Vorarbeiten automatisch.

Optional: Ich starte das nur, falls der User für die Seite Animationen (hier im Feld opt_2 aktiviert hat. Da ich oft eine RepeaterMatrix benutze müssen wir noch die Elternseite finden. Das machen wir mit einer kleinen Hilfefunktion.

'''site/fields/animations/myAnimationTemplate.php'''

<syntaxhighlight lang="php">
// Note: $value contains all values we need as an array
$out = '';
$i1 = $value['assetPath'].'/Cloud1-S.png';
ob_start();
?>
<div class="ani-item cloud1">
<img src="<?=$i1?>">
</div>
<?php
$out = ob_get_clean();
echo $out;
</syntaxhighlight>
Dieses Template gibt uns das zusätzliche Markup für die Animation. Da wir in der Animation.php die ProcessWire Funktion $page->renderValue() verwendet haben konnten wir im ersten Parameter unsere $options an das Template weitergeben. Im Template steht und das automatisch in der Variable $value zur Verfügung.

site/templates/scripts/animations.js
<syntaxhighlight lang="javascript">
// Todo event listeners für Browserfenster Größenänderungen

gsap.registerPlugin("ScrollTrigger");
gsap.defaults({
ease: "expo.in.out",
duration: 1.3
});
// COMMON VARS
var screenWidth = window.innerWidth

$(document).ready(function(){
// ANI-CLOUD1
var cloud = $(".ani-cloud1 .cloud1")
var wCloud = cloud.outerWidth();
var hCloud = cloud.outerHeight();
var tlCloud1 = gsap.timeline({
scrollTrigger: {
trigger: cloud,
pin: false, // pin the trigger element while active?
start: "top bottom", // when the top of the trigger hits the top of the viewport
end: "top top",
scrub: 0, // smooth scrubbing (seconds)
},
repeat: 0
})
tlCloud1.fromTo(cloud, {x:0, y:hCloud/2},{x:screenWidth-wCloud, duration: 2})

// ANI TREES1
// ...

});

</syntaxhighlight>
Zu guter Letzt müssen wir in unserer JavaScript Dateien die eigentlichen Animationen hinterlegen. In unserem Fall mit GSAP.

2024-04-19T16:55:51Z

134.3.86.14:

Hier eine Übersicht über verschiedene Möglichkeiten Files, Felder und Templates zu rendern.
== Links ==
[[ProcessWire - Page Rendering Functions]]
[[ProcessWire - Rendering Funktionen]]
[[ProcessWire - Rendering Templates mit fields Ordner]]
https://processwire.com/blog/posts/processwire-3.0.7-expands-field-rendering-page-path-history-and-more/#theres-also-page-gt-rendervalue

== Kleine ProcessWire Renderübersicht ==
Die häufigsten...
<syntaxhighlight lang="php">
$page->render($filename); // $filename (including .php) assumed in /site/templates/
$page->render($pathname); // $pathname is full path, but must resolve somewhere in web root
$page->render($filename, $myArray); // $myArray can be accessed via $options in Template
$page->render($fieldname) // short for $page->renderField() IF parameter is a fieldname - then pw looks for template file in /fields

// render the pages using templates/fields/myFieldTemplate and access ther with $page->
$page->renderValue($myPageArray, 'myFieldTemplate');
$page->renderValue($myValue, 'templateName'); //

$files->render('teasers', ['items' => $pages->find("template=article")]); // mostly for delayed output
wireRenderFile('my_template', array('pid' => $child->id)); // old version of $files->render
wireIncludeFile() // for direct output

//$page->render() is intended for rendering a specific page (optionally using a specific file)
//wireRenderFile() renders a specific file without the need for a Page object
</syntaxhighlight>

== Use Cases und Unterschiede ==
$page->render('some_field') does indeed call renderField(), but only if the given param is a field name. Take a look at PageRender for more details. If you provide a filename as a param, $page->render() will use that file to render given page.

If you provide a filename (actual filename, not just something like "file") to $page->render() as the first param, you can provide an array as the second param, and the values stored in that array can then be accessed via $options.

It seems to me that you're trying to use $page->render() to something it's really not meant for: $page->render() is intended for rendering a specific page (optionally using a specific file), while wireRenderFile() renders a specific file without the need for a Page object. Those are two different use cases.

ProcessWire - Render Funktionen

2024-04-19T16:27:16Z

134.3.86.14: /* Kleine ProcessWire Renderübersicht */

ProcessWire - Rendering Templates mit fields Ordner

2024-04-19T16:19:50Z

134.3.86.14: /* Felder aus anderen Seiten rendern */

== Links ==
[[ProcessWire - Render Funktionen]] (Inhaltsverzeichnis zu Renderseiten mit ProcessWire)

== Felder mit Templates rendern ==
ProcessWire's $page->render Funktion ist extrem flexibel. Seit der Version 3 gibt es den fields Ordner mit dem man sehr einfach verschiedene Teiltemplates anlegen kann.
Das ist für mich die wichtigste Variante um flexible Backends anzulegen. Vor allem in Verbindung mit der RepeaterMatrix.

Man kann den Inhalt eines Feldes aus dem Backend über ein Template rendern, wenn es in /site/templates/fields/ liegt und richtig benannt ist.

Beispiel: Der Inhalt eines body Felds soll ausgegeben werden und dazu soll ein Template genutzt werden, mit dem der Inhalt zusätzlich von einem Div umgeben wird.

/site/templates/fields/body.php

<syntaxhighlight lang="php">
<div class='bodycopy'>
<?= $value ?>
</div>
</syntaxhighlight>

Zur Ausgabe gibt es mehrere Möglichkeiten:

<syntaxhighlight lang="php">
echo $page->render('body');
echo $page->render->body;
echo $page->_body_; // Nützlicher Shortcut wenn man mehrere Felder mit Template ausgeben möchte. Einfach vorne und hinten ein Underscore.
</syntaxhighlight>

Es stehen folgende Variablen zur Verfügung, die man in den Templates nutzen kann:
$value - The value that needs to be rendered
$page - The page that $value lives on
$field - The field representing $value (of class Field) if you want it
Weitere Variablen kann man mit '''$page->set()''' übergeben.

=== Varianten (Custom Template) ===
Mit einem Zweiten Parameter kann man auch weitere Templates anlegen. Die werden dann passend zum Namen gesucht. Reihenfolge wie im Beispiel

Beispiel
echo $page->render('body', 'custom');
Sucht nach templates wie unten und nimmt das erste das gefunden wird. Die erste Variante ergibt für mich am meisten Sinn.

/site/templates/fields/body/custom.php
/site/templates/fields/custom/body.php
/site/templates/fields/custom.php
/site/templates/fields/body.php (fallback)
Man kann es aber auch genau angeben:
echo $page->render('body', '/custom'); // use only custom.php
echo $page->render('body', '/custom/body'); // use only custom/body.php

=== Felder mit Repeater Matrix ===

Matrix Felder könnte man so handeln:

<syntaxhighlight lang="php">
foreach($page->test_matrix as $item) {
if($item->type == 'content') {
echo "
<h3>$item->headline</h3>
<p>$item->summary</p>
";
} else if($item->type == 'quote') {
echo "
<blockquote>
<p>$item->quote</p>
<cite>$item->cite</cite>
</blockquote>
";
} else if( ... ) {
// and so on
}
}
</syntaxhighlight>

Über den Field Template Ansatz kann man die Matrix eleganter rendern. Wenn man sie so anlegt...

/site/templates/fields/test_matrix.php
<syntaxhighlight lang="php">
foreach($value as $item) {
echo $item->render();
}
</syntaxhighlight>

... sucht die render Funktion im nächsten Unterordner für jeden Typ das Templatefile...

/site/templates/fields/test_matrix/content.php
<syntaxhighlight lang="php">
<h3><?= $page->headline ?></h3>
<p><?= $page->summary ?></p>
</syntaxhighlight>
/site/templates/fields/test_matrix/quote.php
<syntaxhighlight lang="php">
<blockquote>
<p><?= $page->quote ?></p>
<cite><?= $page->cite ?></cite>
</blockquote>
</syntaxhighlight>

So kann man im Template ganz einfach aufrufen:

<syntaxhighlight lang="php">
echo $page->render('test_matrix');
</syntaxhighlight>

=== Felder sinnvoll gruppieren ===
Mit geschickter Strategie lassen sich zum Beispiel geschickt Varianten erzeugen. Z.B. verkürzte Absätze oder Thumbnails statt der Vollansicht:

'''/site/templates/fields/short/body.php'''

<syntaxhighlight lang="php">
// render the first found paragraph only
if(preg_match('!(<p>.+?</p>)!', $value, $matches)) {
echo $matches[1];
}
</syntaxhighlight>

'''/site/templates/fields/short/images.php'''

<syntaxhighlight lang="php">
// render a thumbnail of the first image
if(count($value)) {
$image = $value->first()->width(200);
echo "<img src='$image->url' alt='$image->description'>";
}
</syntaxhighlight>

'''/site/templates/fields/short/title-link.php'''

<syntaxhighlight lang="php">
// render a linked title
echo "<a href='$page->url'><h2>$page->title</h2></a>";
</syntaxhighlight>
Im Haupttemplate kann man das z.B. für eine Zusammenfassung nutzen:

<syntaxhighlight lang="php">
foreach($page->children as $child) {
echo $child->render('title', 'short/title-link');
echo $child->render('images', 'short/');
echo $child->render('body', 'short/');
}
</syntaxhighlight>

=== Felder aus anderen Seiten rendern ===
Mit $page->render() haben wir Werte aus der aktuellen Seite gerendert. Man kann aber auch aus beliebigen Seiten Felder Rendern. Dazu gibt es renderValue()

<syntaxhighlight lang="php">
$results = $pages->find("body%=some text"); // find some pages and store in a PageArray
echo $page->renderValue($results, 'children'); // use the template above to render it
</syntaxhighlight>
Das children.php Template kann auf die Seiten via $page->children zugreifen, weil wir als Feldnamen 'children' übergeben haben.

== Verschiedenes ==
<syntaxhighlight lang="php">
// New Functions in 3.x
render()
renderValue()

// Functions for 2.x or for easy snippet inclusion (also possible with render
wireRenderFile() // mostly used for delayed output
wireIncludeFile() // for direct output
</syntaxhighlight>

ProcessWire - Rendering Templates mit fields Ordner

2024-04-19T16:15:15Z

134.3.86.14: /* Links */

== Links ==
[[ProcessWire - Render Funktionen]] (Inhaltsverzeichnis zu Renderseiten mit ProcessWire)

== Felder mit Templates rendern ==
ProcessWire's $page->render Funktion ist extrem flexibel. Seit der Version 3 gibt es den fields Ordner mit dem man sehr einfach verschiedene Teiltemplates anlegen kann.
Das ist für mich die wichtigste Variante um flexible Backends anzulegen. Vor allem in Verbindung mit der RepeaterMatrix.

Man kann den Inhalt eines Feldes aus dem Backend über ein Template rendern, wenn es in /site/templates/fields/ liegt und richtig benannt ist.

Beispiel: Der Inhalt eines body Felds soll ausgegeben werden und dazu soll ein Template genutzt werden, mit dem der Inhalt zusätzlich von einem Div umgeben wird.

/site/templates/fields/body.php

<syntaxhighlight lang="php">
<div class='bodycopy'>
<?= $value ?>
</div>
</syntaxhighlight>

Zur Ausgabe gibt es mehrere Möglichkeiten:

<syntaxhighlight lang="php">
echo $page->render('body');
echo $page->render->body;
echo $page->_body_; // Nützlicher Shortcut wenn man mehrere Felder mit Template ausgeben möchte. Einfach vorne und hinten ein Underscore.
</syntaxhighlight>

Es stehen folgende Variablen zur Verfügung, die man in den Templates nutzen kann:
$value - The value that needs to be rendered
$page - The page that $value lives on
$field - The field representing $value (of class Field) if you want it
Weitere Variablen kann man mit '''$page->set()''' übergeben.

=== Varianten (Custom Template) ===
Mit einem Zweiten Parameter kann man auch weitere Templates anlegen. Die werden dann passend zum Namen gesucht. Reihenfolge wie im Beispiel

Beispiel
echo $page->render('body', 'custom');
Sucht nach templates wie unten und nimmt das erste das gefunden wird. Die erste Variante ergibt für mich am meisten Sinn.

/site/templates/fields/body/custom.php
/site/templates/fields/custom/body.php
/site/templates/fields/custom.php
/site/templates/fields/body.php (fallback)
Man kann es aber auch genau angeben:
echo $page->render('body', '/custom'); // use only custom.php
echo $page->render('body', '/custom/body'); // use only custom/body.php

=== Felder mit Repeater Matrix ===

Matrix Felder könnte man so handeln:

<syntaxhighlight lang="php">
foreach($page->test_matrix as $item) {
if($item->type == 'content') {
echo "
<h3>$item->headline</h3>
<p>$item->summary</p>
";
} else if($item->type == 'quote') {
echo "
<blockquote>
<p>$item->quote</p>
<cite>$item->cite</cite>
</blockquote>
";
} else if( ... ) {
// and so on
}
}
</syntaxhighlight>

Über den Field Template Ansatz kann man die Matrix eleganter rendern. Wenn man sie so anlegt...

/site/templates/fields/test_matrix.php
<syntaxhighlight lang="php">
foreach($value as $item) {
echo $item->render();
}
</syntaxhighlight>

... sucht die render Funktion im nächsten Unterordner für jeden Typ das Templatefile...

/site/templates/fields/test_matrix/content.php
<syntaxhighlight lang="php">
<h3><?= $page->headline ?></h3>
<p><?= $page->summary ?></p>
</syntaxhighlight>
/site/templates/fields/test_matrix/quote.php
<syntaxhighlight lang="php">
<blockquote>
<p><?= $page->quote ?></p>
<cite><?= $page->cite ?></cite>
</blockquote>
</syntaxhighlight>

So kann man im Template ganz einfach aufrufen:

<syntaxhighlight lang="php">
echo $page->render('test_matrix');
</syntaxhighlight>

=== Felder sinnvoll gruppieren ===
Mit geschickter Strategie lassen sich zum Beispiel geschickt Varianten erzeugen. Z.B. verkürzte Absätze oder Thumbnails statt der Vollansicht:

'''/site/templates/fields/short/body.php'''

<syntaxhighlight lang="php">
// render the first found paragraph only
if(preg_match('!(<p>.+?</p>)!', $value, $matches)) {
echo $matches[1];
}
</syntaxhighlight>

'''/site/templates/fields/short/images.php'''

<syntaxhighlight lang="php">
// render a thumbnail of the first image
if(count($value)) {
$image = $value->first()->width(200);
echo "<img src='$image->url' alt='$image->description'>";
}
</syntaxhighlight>

'''/site/templates/fields/short/title-link.php'''

<syntaxhighlight lang="php">
// render a linked title
echo "<a href='$page->url'><h2>$page->title</h2></a>";
</syntaxhighlight>
Im Haupttemplate kann man das z.B. für eine Zusammenfassung nutzen:

<syntaxhighlight lang="php">
foreach($page->children as $child) {
echo $child->render('title', 'short/title-link');
echo $child->render('images', 'short/');
echo $child->render('body', 'short/');
}
</syntaxhighlight>

=== Felder aus anderen Seiten rendern ===
Mit $page->render() haben wir Werte aus der aktuellen Seite gerendert. Man kann aber auch aus beliebigen Seiten Felder Rendern. Dazu gibt es renderValue()

<syntaxhighlight lang="php">
$results = $pages->find("body%=some text"); // find some pages and store in a PageArray
echo $page->renderValue($results, 'children'); // use the template above to render it
</syntaxhighlight>
Hier müssen wir die Seiten als Parameter mitgeben, da wir ja nicht von der aktuellen Seite rendern wollen.

== Verschiedenes ==
<syntaxhighlight lang="php">
// New Functions in 3.x
render()
renderValue()

// Functions for 2.x or for easy snippet inclusion (also possible with render
wireRenderFile() // mostly used for delayed output
wireIncludeFile() // for direct output
</syntaxhighlight>

ProcessWire - Render Funktionen

2024-04-19T16:11:30Z

134.3.86.14:

ProcessWire - Render Funktionen

2024-04-19T16:07:52Z

134.3.86.14: /* Kleine ProcessWire Renderübersicht */

134.3.86.14:

Hier einige Snippets und Links zum Rendern von Files, Feldern und Templates
== Links ==
https://processwire.com/blog/posts/processwire-3.0.7-expands-field-rendering-page-path-history-and-more/#theres-also-page-gt-rendervalue

== Felder mit Templates rendern ==
ProcessWire rendert Felder mit einem Template wenn es in /site/templates/fields/ liegt und richtig benannt ist.

Beispiel

/site/templates/fields/body.php

<syntaxhighlight lang="php">
<div class='bodycopy'>
<?= $value ?>
</div>
</syntaxhighlight>

Ausgabe z.B. mit:

<syntaxhighlight lang="php">
echo $page->render('body');
echo $page->render->body;
echo $page->_body_; // Nützlicher Shortcut wenn man mehrere Felder mit Template ausgeben möchte.
</syntaxhighlight>

Es stehen folgende Variablen zur Verfügung:
$value - The value that needs to be rendered
$page - The page that $value lives on
$field - The field representing $value (of class Field) if you want it

=== Varianten (Custom Template) ===
Mit einem Zweiten Parameter kann man auch weitere Templates anlegen. Die werden dann passend zum Namen gesucht. Reihenfolge wie im Beispiel

Beispiel
echo $page->render('body', 'custom');
Sucht nach templates wie unten und nimmt das erste das gefunden wird. Die erste Variante ergibt für mich am meisten Sinn.

/site/templates/fields/body/custom.php
/site/templates/fields/custom/body.php
/site/templates/fields/custom.php
/site/templates/fields/body.php (fallback)
Man kann es aber auch genau angeben:
echo $page->render('body', '/custom'); // use only custom.php
echo $page->render('body', '/custom/body'); // use only custom/body.php

=== Felder mit Repeater Matrix ===

Matrix Felder könnte man so handeln:

<syntaxhighlight lang="php">
foreach($page->test_matrix as $item) {
if($item->type == 'content') {
echo "
<h3>$item->headline</h3>
<p>$item->summary</p>
";
} else if($item->type == 'quote') {
echo "
<blockquote>
<p>$item->quote</p>
<cite>$item->cite</cite>
</blockquote>
";
} else if( ... ) {
// and so on
}
}
</syntaxhighlight>

Über den Field Template Ansatz kann man die Matrix eleganter rendern. Wenn man sie so anlegt...

/site/templates/fields/test_matrix.php
<syntaxhighlight lang="php">
foreach($value as $item) {
echo $item->render();
}
</syntaxhighlight>

... sucht die render Funktion im nächsten Unterordner für jeden Typ das Templatefile...

/site/templates/fields/test_matrix/content.php
<syntaxhighlight lang="php">
<h3><?= $page->headline ?></h3>
<p><?= $page->summary ?></p>
</syntaxhighlight>
/site/templates/fields/test_matrix/quote.php
<syntaxhighlight lang="php">
<blockquote>
<p><?= $page->quote ?></p>
<cite><?= $page->cite ?></cite>
</blockquote>
</syntaxhighlight>

So kann man im Template ganz einfach aufrufen:

<syntaxhighlight lang="php">
echo $page->render('test_matrix');
</syntaxhighlight>

<syntaxhighlight lang="php">
</syntaxhighlight>

<syntaxhighlight lang="php">
</syntaxhighlight>
<syntaxhighlight lang="php">
</syntaxhighlight>

<syntaxhighlight lang="php">
</syntaxhighlight>
<syntaxhighlight lang="php">
</syntaxhighlight>

<syntaxhighlight lang="php">
</syntaxhighlight>
<syntaxhighlight lang="php">
</syntaxhighlight>

<syntaxhighlight lang="php">
</syntaxhighlight>
<syntaxhighlight lang="php">
</syntaxhighlight>

== Verschiedenes ==
<syntaxhighlight lang="php">
// New Functions in 3.x
render()
renderValue()

// Functions for 2.x or for easy snippet inclusion (also possible with render
wireRenderFile() // mostly used for delayed output
wireIncludeFile() // for direct output
</syntaxhighlight>

ProcessWire - Render Funktionen

2024-04-19T15:06:52Z

134.3.86.14: Die Seite wurde neu angelegt: „Hier einige Snippets und Links zum Rendern von Files, Feldern und Templates == Links == https://processwire.com/blog/posts/processwire-3.0.7-expands-field-ren…“

ProcessWire - Snippets

2024-04-19T14:53:34Z

134.3.86.14: /* $page Object */

Hier findest du ein paar Basis Snippets. Codebeispiele zu Feldern findest du z.B. über die Seiten zu den Field Types.

== Siehe auch ==
[[ProcessWire - Module Snippets]]
[[ProcessWire - Navigation Snippets]]
[[ProcessWire - Debugging Snippets]]
[[ProcessWire - Selectors]]

== Basics ==
=== Bild in Template einbinden ===
<img src="<?php echo $config->urls->templates?>img/menu.png" alt="Home">

=== Link zu Seite ===
<a href="<?php echo $pages->get('/kontakt/')->url; ?>">
=== Wert aus Textfeld ===
<div class="<? echo $page->get("content_class")?>">
== Bilder ==

=== Umfassende Renderfunktion zum wiederverwenden ===
Hier immer wieder aktualisiert. Todo Option für srcset.
<syntaxhighlight lang="php">

/**
* render image tag from imageobject
* @todo add srcset version,add ukimage version, other attributes
* @todo attributes as object or string
* @param Object Image
* @param Int width
* @return String
*/
function renderImage($image,$w=200,$options=array()){
if(!$image instanceof \ProcessWire\Pageimage) return '';
$defaults = array(
'resizeHeight' => false, // use height instead of width to resize
'srcset' => false, // todo
'uikit' => false, // todo
'aspect' => false,
'noResize' => false,
'classes' => '', // classes as string
'attributes' => false, // attributes as array(attr=>val) or string
'title' => true, // add title tag based on image description
'alt' => true, // add alt tag based on image description
);
$options = array_merge($defaults,$options);
$attributes = array();
$strAttr = '';
$classMarkup = '';

// ATTRIBUTES
$attributesMarkup = '';
if( $options['attributes'] ){
bd( gettype( $options['attributes'] ) );
if( gettype($options['attributes'] ) == 'string') $strAttr = (string)$options['attributes'];
else if( gettype($options['attributes']) == 'array' ){
foreach( (array)$options['attributes'] as $k => $a ){
$attributes[$k] = $a;
}
}
}
if($options['alt'] && $image->description) $attributes['alt'] = $image->description;
if($options['title'] && $image->description) $attributes['title'] = $image->description;
$attributesMarkup = implode(' ', $attributes);
if($strAttr) $attributesMarkup .= " $strAttr";

if($options['classes']) $classMarkup = ' class="'.$options['classes'].'"';

if($options['resizeHeight']){
$i = $image->height($w);
}else if($options['aspect']){
$i = $image->size($w, intval( $w / $options['aspect']) );
}else if($options['noResize']){
// Todo

}else{
$i = $image->width($w);
}
$out = '<img src="'.$i->url.'" '.$classMarkup.$attributesMarkup.'>';
return $out;
}
</syntaxhighlight>

=== Advanced Image Manipulation ===
ImageMagick, Externe Bilder laden, Bilder Vorrendern...
[[Processwire - Advanced Image Manipulation]]

=== Praktische Renderfunktionen ===
<syntaxhighlight lang="php">
/**
* Image Function
*/

/**
* get background-position style via focus point if available
* mainly used in other functions
* @param Pageimage PW image object
* @return Array containing background-position
*/
function getFocusStyles($image){
// Focal Points if available
$imageStyles = array();
if($image->focus){
$focus=$image->focus();
//var_dump($focus);
$imageStyles[] = 'background-position:'.number_format($focus["left"],1,".","") .'% '.number_format($focus["top"],1,".","").'%;';
}
return $imageStyles;
}

/**
* get background-image styles and create image
* @todo - make image set instead of single image
* @param Pageimage
* @param Int Image width
* @param String background-size attribute (cover, contain...)
* @return array
*/
function getBgImageStyles($image, $w = 800,$options = array()){
$defaults = array(
'size' => 'cover',
'noResize' => false
);
$options = array_merge($defaults,$options);

if($image){
$styles = array();
if ($options['noResize']) $myImage = $image;
else $myImage = $image->width($w);
$styles[] = "background-image: url($myImage->url);";
$styles[] = 'background-size: '.$options['size'].'; background-repeat: no-repeat;';
$styles = array_merge( $styles, getFocusStyles($myImage) );
return $styles;
} else return array();

}

/**
* render image tag from imageobject
* @todo add srcset version, add description, add ukimage version, other attributes
* @param Object Image
* @param Int width
* @return String
*/
function renderImage($image,$w=200,$options=array()){
if(!$image instanceof \ProcessWire\Pageimage) return '';
$defaults = array(
'resizeHeight' => false, // use height instead of width to resize
'srcset' => false, // todo
'uikit' => false, // todo
'aspect' => false,
'noResize' => false
);
$options = array_merge($defaults,$options);
if($options['resizeHeight']){
$i = $image->height($w);
}else if($options['aspect']){
$i = $image->size($w, intval( $w / $options['aspect']) );
}else if($options['noResize']){
// Todo

}else{
$i = $image->width($w);
}
$out = '<img src="'.$i->url.'" alt="'.$i->description.'">';
return $out;
}
</php>
</syntaxhighlight>

=== Einzelbild einfügen ===

==== Maximale Breite oder maximale Höhe je nach Orientierung ====
$thumburl = $image->width > $image->height ? $image->size(450,0)->url : $image->size(0,320);

==== Maximale Breite und maximale Höhe berücksichtigen ====
<syntaxhighlight lang="php">
$mW = 180;
$mH = 80;
$thumbUrl = ($mH / $image->height) > ($mW / $image->width) ? $image->size($mW,0)->url : $image->size(0,$mH)->url;
</syntaxhighlight>

====Bild aus Backend als Hintergrund einfügen====
(Feldname hier: ''main_image'')
<syntaxhighlight lang="php">
if($page->main_image){$image = $page->main_image->size(640,960);}
else $image = NULL;
...
if($image){
echo "
<div class='a-3-4 team-image' style='background-image:url({$image->url})'>
<div>{$myContent}</div>
</div>
";
}
</syntaxhighlight>

=== n-tes Bild einfügen ===
$page->images->eq(1); // second image

=== Mehrere Bilder aus dem Backend ===
<syntaxhighlight lang="php">
$myImages='';
if(count($page->images)) {
foreach($page->images as $image) {
$myImages .= '<img class="img-responsive" src="'.$image->url.'">';
}
}
</syntaxhighlight>
'''Beispiel 2'''
<syntaxhighlight lang="php">
echo $page->images->implode(function($item) {
$large = $item->size(1200,800);
$thumb = $item->size(400,300);
return "<li><a href='$large->url'><img src='$thumb->url' alt='$item->description'></a></li>";
}, array('prepend' => '<ul>', 'append' => '</ul>'));
</syntaxhighlight>

==== Einfache Galerie ====
<syntaxhighlight lang="php">
$gallery = '<div class="gallery">';
$images = $page->gallery;

// add thumbnail to gallery
if(count($page->thumbnail)){
$gallery .= '<a class="chocolat-image gallery-item" href="'.$page->thumbnail->url.'"><img src="'. $page->thumbnail->getThumb('thumbnail') .'" title="'. $image->description .'"></a>';
}

foreach($images as $image){
$gallery .= '<a class="chocolat-image gallery-item" href="'.$image->url.'"><img src="'. $image->getThumb('thumbnail') .'" title="'. $image->description .'"></a> ';
}
$gallery .= '</div>';
</syntaxhighlight>

=== Slider mit Processwire ===
[[Processwire - Slider]]

== Videos ==
[[Processwire - Working with Video]]

== File Uploads ==
[[ProcessWire - Uploads]]

== Navigation ==
[[ProcessWire - Navigation Snippets]]

== Seiten ==
http://processwire.com/api/variables/pages/
=== Inhalt einer Seite mit $page->get() ===
Beispiel
<syntaxhighlight lang="php">
<p>Visit us at:  <?php 
$contact = $pages->get("/about/contact/");
echo $contact->address;
?> </p>
</syntaxhighlight>
Kürzer:
<syntaxhighlight lang="php">
<p>Visit us at: <?=$pages->get("/about/contact/")->address?></p>
</syntaxhighlight>

=== Seiten Filtern find() ===
==== "Featured" Checkbox im Backend angehakt ====
<syntaxhighlight lang="php">
<ul> <?php 
$features = $pages->find("featured=1");
foreach($features as $feature)
echo "<li><a href='{$feature->url}'>{$feature->title}</a></li>";
?> </ul>
</syntaxhighlight>

==== Beispiel: Limitierte Ausgabe, Sortieren und in Unterverzeichnis ====
$pages->find("parent=/about/press/, featured=1, limit=3, sort=-date");
oder
$pages->get("/about/press/")->children("featured=1, limit=3, sort=-date");
Finde in Kategorie
$pages->get("/about/press/")->find("featured=1, limit=3, sort=-date");

==== Seiten mit Template xyz ====
$pages->find("template=press_release, featured=1, limit=3, sort=-date");
Ausführliches Beispiel mit Ausgabe
<syntaxhighlight lang="php">
<ul> <?php 
$features = $pages->find("template=press_release, featured=1, limit=3, sort=-date");
foreach($features as $feature) {
echo "<li>" .
"<h3><a href='{$feature->url}'>{$feature->title}</a></h3>" .
"<span class='date'>{$feature->date}</span>" .
"<p>{$feature->summary}</p>" .
"</li>"; 
}
?></ul>
</syntaxhighlight>

== Felder ==
=== Label zu Feldes und Subfeldern ausgeben ===
Beispiel mit dem Combo Profield. Das Prinzip funktioniert bei allen Feldern.
https://processwire.com/talk/topic/26183-getting-label-of-combo-subfield/#comment-217749
<syntaxhighlight lang="php">
$field = $fields->get('your_combo_field_name');
$settings = $field->getComboSettings();
$subfield = $settings->getSubfield('your_subfield_name');

// get label in current user language
$label = $subfield->getLabel();

// to get in a language other than current user language
$label = $subfield->getLabel('de');

// to get localized description
$description = $subfield->getDescription();

// to get localized notes
$notes = $subfield->getNotes();

// also note you can use getLanguageValue
$label = $subfield->getLanguageValue('de', 'label');
</syntaxhighlight>

=== Label eines Felds ausgeben ===
Geht über das Feld-Objekt.
echo $fields->get("body")->label;

=== Ist ein Feld leer ? ===
if($page->summary_de) { ... }
// check whitespace
if(trim($page->summary_de)) { ... }

=== Datumsfelder formatieren ===
<syntaxhighlight lang="php">

// aus Datumsfeldern
echo date("Y-m-d", $page->getUnformatted("closing"));

// aus Unix Timestamp mit Vanilla PHP
echo date("Y-m-d", $news->created);

setlocale(LC_TIME, "de_DE.utf8");
$weekday = strftime ( '%A' , $page->getUnformatted("date") );
$date = date("d.m.Y", $page->getUnformatted("date"));
</syntaxhighlight>

Beispiel aus ProcessWire Blog
<syntaxhighlight lang="php">
setlocale(LC_ALL, array('de_DE','de_DE.iso88591','de_DE.iso885915@euro','de_DE.utf8','de_DE@euro'));
$date = $page->date ? date('d.m.Y',$page->getUnformatted("date")) : date('d.m.Y',$page->getUnformatted("createdStr"));
</syntaxhighlight>

=== Optionen eines Select Felds ausgeben (fieldtypeOptions)===
<syntaxhighlight lang="php">
$options = $fieldtypes->get('FieldtypeOptions')->getOptions('YOURFIELDNAME');
foreach($options as $option) {
echo $option->id;
echo $option->value;
echo $option->title;
}
</syntaxhighlight>

=== Parent von Repeater oder RepeaterMatrix finden ===
Nutzt man ein Repeater Feld muss man manchmal die Seite herausfinden in der das Feld enthalten ist. Hierfür gibt es die Funktion getForPage().
<syntaxhighlight lang="php">
if( get_class($myPage) == 'ProcessWire\RepeaterMatrixPage' || get_class($myPage) == 'ProcessWire\RepeaterPage') {
$forPage = $myPage->getForPage();
//var_dump( $myPage->getForPage());
return $myPage = getImagePage($forPage);
}
</syntaxhighlight>

Falls man Repeater in Repeatern hat kann man auch eine rekursive Funktion nutzen:

<syntaxhighlight lang="php">
if (!function_exists('getForPage')) {

function getForPage($myPage, $level=1){
// if in repeater or repeaterMatrix find the first parent ProcessWire\Page Page
$maxLevel=5;
if( get_class($myPage) == 'ProcessWire\RepeaterMatrixPage' || get_class($myPage) == 'ProcessWire\RepeaterPage') {
$level +=1;
if($level > $maxLevel) return false;
$forPage = $myPage->getForPage();
//var_dump( $myPage->getForPage());
//echo("<p>next Level: ".get_class($forPage)."</p>");
return $myPage = getForPage($forPage);

}else if( get_class($myPage) == 'ProcessWire\Page'){

return $myPage;
}
}
}
</syntaxhighlight>

== Searchbar ==
<pre>

<form class='search' action='<?php echo $pages->get('template=search')->url; ?>' method='get'>
<input type='text' name='q' placeholder='Search' value='<?php echo $sanitizer->entities($input->whitelist('q')); ?>' />
<button type='submit' name='submit'>Search</button>
</form>

</pre>
== Create Admin User ==
=== Reset Password - Passwort zurücksetzen ===
<syntaxhighlight lang="php">
<?php
require "index.php";
$admin = $users->get('admin1'); // or whatever your username is
$admin->setAndSave('pass', 'geheim');
?>
</syntaxhighlight>

https://processwire-recipes.com/recipes/resetting-admin-password-via-api/
Problem
For some reason, you have managed to lock yourself out of a site you are currently developing.

Solution
Paste the following into a file (e.g. "reset.php") in the root folder of the site, then run it.

ProcessWire version >= 2.6.9

<pre>
require "index.php";
$admin = $users->get('admin'); // or whatever your username is
$admin->setAndSave('pass', 'yo123456');
</pre>

ProcessWire version < 2.6.9

<pre>
require "index.php";
$admin = wire('users')->get('admin');
$admin->setOutputFormatting(false);
$admin->set('pass', 'yo12345');
$admin->save('pass');
</pre>

== Editor Link / Login Logout Link ==
_main.php
<syntaxhighlight lang="php">
<div class="editor">
<?php
if($user->isLoggedin()) {
// if user is logged in, show a logout link
echo "<a href='{$config->urls->admin}login/logout/'>Logout ($user->name)</a>";
} else {
// if user not logged in, show a login link
echo "<a href='{$config->urls->admin}'>∆</a>";
}
// output an "Edit" link if this page happens to be editable by the current user
if($page->editable()) echo "<li class='edit nav'><a href='$page->editUrl'>Edit</a></li>";
?>
</div>
</syntaxhighlight>
Siehe auch [[ProcessWire - User Login / Logout]]

== Conditions ==
=== Bedingungen durch Oder Operator in Feldern ===
Wenn das eine Feld leer ist nimm das nächste...
$t = $page->get("long_title|title");
=== Conditions für Navigation ===
<syntaxhighlight lang="php">
// If the page has children, then render navigation to them under the body.
// See the _func.php for the renderNav example function.
if($page->hasChildren) {
$content .= renderNav($page->children);
}
</syntaxhighlight>

<syntaxhighlight lang="php">
// if the rootParent (section) page has more than 1 child, then render
// section navigation in the sidebar
if($page->rootParent->hasChildren > 1) {
$sidebar = renderNavTree($page->rootParent, 3) . $page->sidebar;
}
</syntaxhighlight>
== Rendering ==
Es gibt viele Möglichkeiten deshalb ein eigenes Kapitel:
[[ProcessWire - Render Funktionen]]

== $page Object ==
Siehe auch [[ProcessWire - Page Object]]
=== Zugriff auf $page in Funktionen ===
Beispiel:
<pre>
function getTitle() {
$page = wire("page");
$t = $page->title;
</pre>
oder einfach übergeben.
=== Variablen zu Render-Datei senden ===
<pre>
// you can send vars (here item count)
// use this inside the field rendering script
// ie. $page->_n
$page->set('_n',$n);
$page->set('_type',$item->type);
$out .= $item->render();
</pre>

== Copy and Paste ==
=== Einfache Datumssteuerung ===
Setzt Felder date_begin und date_end voraus.
<syntaxhighlight lang="php">
// Date check
$dateValid = true;
$now = time();
$start = 0;
$end = 0;
if($page->date_begin){
$start = strtotime( $page->date_begin('Y-m-d') . " 00:00:00");
if( !($now >= $start) ) $dateValid = false;
}
if($page->date_end){
$end = strtotime( $page->date_end('Y-m-d') . " 23:59:59");
if( ($now > $end) ) $dateValid = false;
}

if(!$dateValid) return '';
</syntaxhighlight>

=== Copyright / Published Date ===
<pre>
$published_date = date('d.m.Y',$page->created);
<?= '©'.$published_date ?>
</pre>

=== Stylesheets und Skripte mit AIOM ===
<script src="<?php echo AIOM::JS(array('scripts/jquery-2.2.4.min.js','scripts/jquery.chocolat.js','scripts/jquery.fitvids.js','scripts/jquery.flexslider-min.js', 'scripts/main.js')); ?>"></script>
<link rel="stylesheet" type="text/css" href="<?php echo AIOM::CSS('styles/main.less'); ?>">
<?php echo $homepage->site_title .' '. Date('Y'); ?>

=== Link zur Seite anhand URL-Pfad ===
<?php echo $pages->get('/ueber-uns/')->url; ?>

=== Feld einer Seite ===
$content_left = $page->get('content_left');

=== Bild ===
if($page->main_image){$image = $page->main_image->size(640,960);}
else $image = NULL;
=== Bild von der Homepage ===
in _init.php
$homepage = $pages->get('/');
im Template
if($homepage->config_logo){$logo = $homepage->config_logo->width(280);}
else $logo = NULL;

=== Simple Navigation ===
<pre>
<ul class='nav-list'>
<?php
// Childrens
foreach(($page->children) as $item) {
if($item->id == $page->rootParent->id) {
echo '<li class="current">';
} else {
echo '<li>';
}
echo '<a class="ajax-link" href="'.$item->url.'">'.$item->title.'</a></li>';
}
?>
</ul>
</pre>

=== Auflistung mit div. Feldern aus Kindseiten ===
<syntaxhighlight lang="php">
/**
* Publications list template
*
*/
$publications = '';
$children = $page->children;
foreach($children as $child){
$publications .= '<div class="box">';
$publications .= '<h2><a class="ajax-link" parent="'. $child->parent->title .'" name="'.$child->title.'" href="'. $child->url. '">'. $child->title . '</a></h2>';
$publications .= $child->body;
$publications .= '</div>';
}

$content = $page->body . $publications;
</syntaxhighlight>

=== Minigalerie ===
Thumbnails / Child Pages
<syntaxhighlight lang="php">
$works = '<div class="gallery">';
$children = $page->children;
foreach($children as $child){
$works .= '<a class="ajax-link" parent="'. $child->parent->title .'" name="'.$child->title.'" href="'. $child->url. '">';
$works .= '<h2>'. $child->title . '</h2>';

if(count($child->thumbnail)){
$works .= '<div class="thumbnail"><img src="'. $child->thumbnail->getThumb('thumbnail') .'" title="'. $image->description .'"></div>';
}

$works .= '</a>';
}
$works .= '</div>';

$content = $page->body . $works . '<br/>' . $page->video;
</syntaxhighlight>

=== Page Navigation ===
<syntaxhighlight lang="php">
// add next button if there is another page next
if($page->next->id){
$next = '<div class="next"><i>Next:</i> <a class="ajax-link" name="'.$page->next->title.'" href="'. $page->next->url .'">'. $page->next->title .'<span class="fa fa-arrow-right"><span></a></div>';
}

$content = '<h2>'. $page->title . '</h2>' . $page->body . '<br/><div class="video">' . $page->video .'</div>' . $next;
</syntaxhighlight>

=== Simple Gallery with next Page ===
<syntaxhighlight lang="php">
$gallery = '<div class="gallery">';
$images = $page->gallery;

// add thumbnail to gallery
if(count($page->thumbnail)){
$gallery .= '<a class="chocolat-image gallery-item" href="'.$page->thumbnail->url.'"><img src="'. $page->thumbnail->getThumb('thumbnail') .'" title="'. $image->description .'"></a>';
}

foreach($images as $image){
$gallery .= '<a class="chocolat-image gallery-item" href="'.$image->url.'"><img src="'. $image->getThumb('thumbnail') .'" title="'. $image->description .'"></a> ';
}
$gallery .= '</div>';

// add next button if there is another page next
if($page->next->id){
$next = '<div class="next"><i>Next:</i> <a class="ajax-link" name="'.$page->next->title.'" href="'. $page->next->url .'">'. $page->next->title .'<span class="fa fa-arrow-right"><span></a></div>';
}

$content = '<h2>'. $page->title . '</h2>' . $page->body . '<br/>' . $gallery . '<br/><div class="video">' . $page->video .'</div>'. $next;

</syntaxhighlight>

=== Platzhalter-Seite mit Redirect auf erste Unterseite ===
Möchte man eine Eltern-Seite für das Menü generieren die keinen eigenen Inhalt besitzt sondern nur Unterseiten enthält, kann man ein Template für diese Seite erstellen, dass den User auf die erste Unterseite weiterleitet.

Diese Lösung ist ein regulärer Redirect. Ob das die Beste Lösung ist müßte man mal überlegen. Auf alle Fälle besser als Duplicate Content.
<syntaxhighlight lang="php">
<?php namespace ProcessWire;
$root = $pages->get("/");
if($page->numChildren){
$session->redirect($page->child()->url);
} else $session->redirect($root->url);
?>

</syntaxhighlight>

=== In Funktionen auf Page Objekt zugreifen ===
Entweder als Parameter übergeben (evtl. by reference) oder wenn ein ProcessWire Objekt in der Funktion vorliegt das vom Wire Objekt abgeleitet ist (fast alle) kannst du dieses nutzen:
$page = $items->wire('page'); // $items is a PageArray - use its wire to get current page

== ProcessWire - Debugging Snippets ==
[[ProcessWire - Debugging Snippets]]

GSAP - Timelines

2024-04-19T13:03:01Z

134.3.86.14:

https://greensock.com/docs/v3/GSAP/gsap.timeline()
https://greensock.com/forums/topic/12643-master-timeline-and-the-use-of-functions/

<syntaxhighlight lang="javascript">
// WITHOUT Timelines (only using delays):
gsap.to("#id", { x: 100, duration: 1 });
gsap.to("#id", { y: 50, duration: 1, delay: 1 }); //wait 1 second
gsap.to("#id", { opacity: 0, duration: 1, delay: 2 }); //wait 2 seconds

//WITH Timelines (cleaner, more versatile)
var tl = gsap.timeline({repeat: 2, repeatDelay: 1});
tl.to("#id", {x: 100, duration: 1});
tl.to("#id", {y: 50, duration: 1});
tl.to("#id", {opacity: 0, duration: 1});

// then we can control the whole thing easily...
tl.pause();
tl.resume();
tl.seek(1.5);
tl.reverse();
</syntaxhighlight>

== Master Timeline ==
Gutes Vorgehen für flexiblen Einsatz:
Ältere Beispiele (v2)
<syntaxhighlight lang="javascript">
function getFirst() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getSecond() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getThird() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

master.add(getFirst());
master.add(getSecond());
master.add(getThird());
</syntaxhighlight>

The end result of both techniques is going to be identical and both offer a modular approach. However, wrapping your timelines in a function has two advantages which may not be applicable all the time, but its nice to have them:)

1: By using functions to create your timelines, you can create them "on-demand" only when needed. In the context of a large game or application the function-wrapped way means you don't have to create 500 timelines in advance, you can just call the proper function when you need a timeline.

2: You can create the same timeline multiple times and add each unique copy of the timeline to the same or any parent timeline. Although it isn't always necessary, it is very easy to use the function-wrapped technique to do
<syntaxhighlight lang="javascript">
master.add(getFirst());
master.add(getFirst());
master.add(getFirst());
master.add(getSecond());
master.add(getSecond());
</syntaxhighlight>

When it comes to doing elaborate, dynamic scene changes (based on user interaction) it makes things incredibly flexible.

Imagine your app has a variety of scenes, and each scene has its own timeline for animating in and out.

You could do something like:
<syntaxhighlight lang="javascript">
navTimeline.add(scene1Out());
navTimeline.add(scene3In(), "-=1");
</syntaxhighlight>

which would trigger the timeline that the scene3In() function generates 1 second before the scene1Out animation ends.

and then maybe later the user wants to go back to scene1

<syntaxhighlight lang="javascript">
navTimeline.add(scene3Out());
navTimeline.add(scene1In(), "-=1");
</syntaxhighlight>

The end result of this technique is that you can generate your transition timelines whenever you need them, as many times as you need them, and glue them together in any number of ways.

<syntaxhighlight lang="javascript">
function carMove(){
var tl = new TimelineMax();
tl.to("#car", 2, {x:"+=200"})
/* more tweens go here */
return tl;
}

function wheelsRotate(){
var tl = new TimelineMax();
tl.to("#wheels", 2, {rotation:"+=360"})
/* more tweens go here */
return tl;
}

masterTL
.add( carMove())
.add( wheelsRotate());
</syntaxhighlight>

GSAP - Timelines

2024-04-19T13:02:31Z

134.3.86.14:

https://greensock.com/docs/v3/GSAP/gsap.timeline()
https://greensock.com/forums/topic/12643-master-timeline-and-the-use-of-functions/

<syntaxhighlight lang="javascript">
// WITHOUT Timelines (only using delays):
gsap.to("#id", { x: 100, duration: 1 });
gsap.to("#id", { y: 50, duration: 1, delay: 1 }); //wait 1 second
gsap.to("#id", { opacity: 0, duration: 1, delay: 2 }); //wait 2 seconds

<syntaxhighlight lang="javascript">
//WITH Timelines (cleaner, more versatile)
var tl = gsap.timeline({repeat: 2, repeatDelay: 1});
tl.to("#id", {x: 100, duration: 1});
tl.to("#id", {y: 50, duration: 1});
tl.to("#id", {opacity: 0, duration: 1});

// then we can control the whole thing easily...
tl.pause();
tl.resume();
tl.seek(1.5);
tl.reverse();
</syntaxhighlight>

== Master Timeline ==
Gutes Vorgehen für flexiblen Einsatz:
Ältere Beispiele (v2)
<syntaxhighlight lang="javascript">
function getFirst() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getSecond() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getThird() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

master.add(getFirst());
master.add(getSecond());
master.add(getThird());
</syntaxhighlight>

The end result of both techniques is going to be identical and both offer a modular approach. However, wrapping your timelines in a function has two advantages which may not be applicable all the time, but its nice to have them:)

1: By using functions to create your timelines, you can create them "on-demand" only when needed. In the context of a large game or application the function-wrapped way means you don't have to create 500 timelines in advance, you can just call the proper function when you need a timeline.

2: You can create the same timeline multiple times and add each unique copy of the timeline to the same or any parent timeline. Although it isn't always necessary, it is very easy to use the function-wrapped technique to do
<syntaxhighlight lang="javascript">
master.add(getFirst());
master.add(getFirst());
master.add(getFirst());
master.add(getSecond());
master.add(getSecond());
</syntaxhighlight>

When it comes to doing elaborate, dynamic scene changes (based on user interaction) it makes things incredibly flexible.

Imagine your app has a variety of scenes, and each scene has its own timeline for animating in and out.

You could do something like:
<syntaxhighlight lang="javascript">
navTimeline.add(scene1Out());
navTimeline.add(scene3In(), "-=1");
</syntaxhighlight>

which would trigger the timeline that the scene3In() function generates 1 second before the scene1Out animation ends.

and then maybe later the user wants to go back to scene1

<syntaxhighlight lang="javascript">
navTimeline.add(scene3Out());
navTimeline.add(scene1In(), "-=1");
</syntaxhighlight>

The end result of this technique is that you can generate your transition timelines whenever you need them, as many times as you need them, and glue them together in any number of ways.

<syntaxhighlight lang="javascript">
function carMove(){
var tl = new TimelineMax();
tl.to("#car", 2, {x:"+=200"})
/* more tweens go here */
return tl;
}

function wheelsRotate(){
var tl = new TimelineMax();
tl.to("#wheels", 2, {rotation:"+=360"})
/* more tweens go here */
return tl;
}

masterTL
.add( carMove())
.add( wheelsRotate());
</syntaxhighlight>

GSAP - Timelines

2024-04-19T13:02:13Z

134.3.86.14:

https://greensock.com/docs/v3/GSAP/gsap.timeline()
https://greensock.com/forums/topic/12643-master-timeline-and-the-use-of-functions/
== Master Timeline ==
Gutes Vorgehen für flexiblen Einsatz:

<syntaxhighlight lang="javascript">
// WITHOUT Timelines (only using delays):
gsap.to("#id", { x: 100, duration: 1 });
gsap.to("#id", { y: 50, duration: 1, delay: 1 }); //wait 1 second
gsap.to("#id", { opacity: 0, duration: 1, delay: 2 }); //wait 2 seconds

<syntaxhighlight lang="javascript">
//WITH Timelines (cleaner, more versatile)
var tl = gsap.timeline({repeat: 2, repeatDelay: 1});
tl.to("#id", {x: 100, duration: 1});
tl.to("#id", {y: 50, duration: 1});
tl.to("#id", {opacity: 0, duration: 1});

// then we can control the whole thing easily...
tl.pause();
tl.resume();
tl.seek(1.5);
tl.reverse();
</syntaxhighlight>

Ältere Beispiele (v2)
<syntaxhighlight lang="javascript">
function getFirst() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getSecond() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getThird() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

master.add(getFirst());
master.add(getSecond());
master.add(getThird());
</syntaxhighlight>

The end result of both techniques is going to be identical and both offer a modular approach. However, wrapping your timelines in a function has two advantages which may not be applicable all the time, but its nice to have them:)

1: By using functions to create your timelines, you can create them "on-demand" only when needed. In the context of a large game or application the function-wrapped way means you don't have to create 500 timelines in advance, you can just call the proper function when you need a timeline.

2: You can create the same timeline multiple times and add each unique copy of the timeline to the same or any parent timeline. Although it isn't always necessary, it is very easy to use the function-wrapped technique to do
<syntaxhighlight lang="javascript">
master.add(getFirst());
master.add(getFirst());
master.add(getFirst());
master.add(getSecond());
master.add(getSecond());
</syntaxhighlight>

When it comes to doing elaborate, dynamic scene changes (based on user interaction) it makes things incredibly flexible.

Imagine your app has a variety of scenes, and each scene has its own timeline for animating in and out.

You could do something like:
<syntaxhighlight lang="javascript">
navTimeline.add(scene1Out());
navTimeline.add(scene3In(), "-=1");
</syntaxhighlight>

which would trigger the timeline that the scene3In() function generates 1 second before the scene1Out animation ends.

and then maybe later the user wants to go back to scene1

<syntaxhighlight lang="javascript">
navTimeline.add(scene3Out());
navTimeline.add(scene1In(), "-=1");
</syntaxhighlight>

The end result of this technique is that you can generate your transition timelines whenever you need them, as many times as you need them, and glue them together in any number of ways.

<syntaxhighlight lang="javascript">
function carMove(){
var tl = new TimelineMax();
tl.to("#car", 2, {x:"+=200"})
/* more tweens go here */
return tl;
}

function wheelsRotate(){
var tl = new TimelineMax();
tl.to("#wheels", 2, {rotation:"+=360"})
/* more tweens go here */
return tl;
}

masterTL
.add( carMove())
.add( wheelsRotate());
</syntaxhighlight>

GSAP - Timelines

2024-04-19T13:01:17Z

134.3.86.14: /* Master Timeline */

https://greensock.com/docs/v3/GSAP/gsap.timeline()
https://greensock.com/forums/topic/12643-master-timeline-and-the-use-of-functions/
== Master Timeline ==
Gutes Vorgehen für flexiblen Einsatz:

Celli, I read you question a little differently. it seems you are already using a modular approach, it's just that you are doing
// WITHOUT Timelines (only using delays):
gsap.to("#id", { x: 100, duration: 1 });
gsap.to("#id", { y: 50, duration: 1, delay: 1 }); //wait 1 second
gsap.to("#id", { opacity: 0, duration: 1, delay: 2 }); //wait 2 seconds

What if you wanted to make the first animation longer? You'd need to adjust every delay thereafter. And what if you want to pause() the whole sequence or restart() it or reverse() it on-the-fly or repeat it twice? This could become quite messy, but GSAP's Timelines make it incredibly simple:

<syntaxhighlight lang="javascript">
//WITH Timelines (cleaner, more versatile)
var tl = gsap.timeline({repeat: 2, repeatDelay: 1});
tl.to("#id", {x: 100, duration: 1});
tl.to("#id", {y: 50, duration: 1});
tl.to("#id", {opacity: 0, duration: 1});

// then we can control the whole thing easily...
tl.pause();
tl.resume();
tl.seek(1.5);
tl.reverse();
</syntaxhighlight>

Ältere Beispiele (v2)
<syntaxhighlight lang="javascript">
function getFirst() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getSecond() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

function getThird() {
var tl = new TimelineLite();
tl.to(...)
return tl;
}

master.add(getFirst());
master.add(getSecond());
master.add(getThird());
</syntaxhighlight>

The end result of both techniques is going to be identical and both offer a modular approach. However, wrapping your timelines in a function has two advantages which may not be applicable all the time, but its nice to have them:)

1: By using functions to create your timelines, you can create them "on-demand" only when needed. In the context of a large game or application the function-wrapped way means you don't have to create 500 timelines in advance, you can just call the proper function when you need a timeline.

2: You can create the same timeline multiple times and add each unique copy of the timeline to the same or any parent timeline. Although it isn't always necessary, it is very easy to use the function-wrapped technique to do
<syntaxhighlight lang="javascript">
master.add(getFirst());
master.add(getFirst());
master.add(getFirst());
master.add(getSecond());
master.add(getSecond());
</syntaxhighlight>

When it comes to doing elaborate, dynamic scene changes (based on user interaction) it makes things incredibly flexible.

Imagine your app has a variety of scenes, and each scene has its own timeline for animating in and out.

You could do something like:
<syntaxhighlight lang="javascript">
navTimeline.add(scene1Out());
navTimeline.add(scene3In(), "-=1");
</syntaxhighlight>

which would trigger the timeline that the scene3In() function generates 1 second before the scene1Out animation ends.

and then maybe later the user wants to go back to scene1

<syntaxhighlight lang="javascript">
navTimeline.add(scene3Out());
navTimeline.add(scene1In(), "-=1");
</syntaxhighlight>

The end result of this technique is that you can generate your transition timelines whenever you need them, as many times as you need them, and glue them together in any number of ways.

<syntaxhighlight lang="javascript">
function carMove(){
var tl = new TimelineMax();
tl.to("#car", 2, {x:"+=200"})
/* more tweens go here */
return tl;
}

function wheelsRotate(){
var tl = new TimelineMax();
tl.to("#wheels", 2, {rotation:"+=360"})
/* more tweens go here */
return tl;
}

masterTL
.add( carMove())
.add( wheelsRotate());
</syntaxhighlight>