643 lines
33 KiB
HTML
643 lines
33 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de" dir="ltr">
|
|
<head>
|
|
<title>WordPress Werkstatt PHP :: Jörg Lohrer - Example site for hugo-theme-tailwind</title>
|
|
|
|
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta
|
|
name="description"
|
|
content="WordPress Werkstatt PHP Zunächst wird auf relilab.org das kostenfreie Plugin ACF - Advanced Custom Fields installiert und aktiviert. Dies ermöglicht weitere individuelle Beitragsfelder für die Beiträge. Nun kann manuell aktiviert oder eine Feldgruppe importiert werden - hier mittels dieser JSON-Datei , die das abkürzt: mit dem Ergebnis, dass unter allen WordPress-Beiträgen jetzt zwei Terminfelder erscheinen, die ausgefüllt werden können: Zudem gibt es neu eine Kategorie “Termine”, die aktiviert werden kann mit Unterkategorien, die später Übersichtsseiten ermöglichen: Jetzt wird das Plugin relilab-termine installiert und aktiviert Nun kann mittels Shortcode [relilab_termine] eine Terminübersicht als WordPress-Block erzeugt werden: "
|
|
/>
|
|
<meta
|
|
name="keywords"
|
|
content="hugo, tailwind, tailwindcss, hugo theme, hugo theme tailwind"
|
|
/>
|
|
<meta name="robots" content="noodp" /><link rel="manifest" href="/manifest.json" /><meta property="og:url" content="https://joerg-lohrer.de/2021/11/17/wordpress-werkstatt.html/">
|
|
<meta property="og:site_name" content="Jörg Lohrer">
|
|
<meta property="og:title" content="WordPress Werkstatt PHP">
|
|
<meta property="og:description" content="Advanced Custom Fields und Formulareingaben">
|
|
<meta property="og:locale" content="de">
|
|
<meta property="og:type" content="article">
|
|
<meta property="article:section" content="posts">
|
|
<meta property="article:published_time" content="2021-11-17T00:00:00+00:00">
|
|
<meta property="article:modified_time" content="2021-11-17T00:00:00+00:00">
|
|
<meta property="article:tag" content="ACF">
|
|
<meta property="article:tag" content="WordPress">
|
|
<meta property="article:tag" content="Formulare">
|
|
<meta property="article:tag" content="JSON">
|
|
<meta property="article:tag" content="Plugin">
|
|
|
|
|
|
<meta name="twitter:card" content="summary">
|
|
<meta name="twitter:title" content="WordPress Werkstatt PHP">
|
|
<meta name="twitter:description" content="Advanced Custom Fields und Formulareingaben">
|
|
|
|
|
|
<link rel="canonical" href="https://joerg-lohrer.de/2021/11/17/wordpress-werkstatt.html/" />
|
|
|
|
<link rel="shortcut icon" href="/favicon.ico" />
|
|
<link rel="stylesheet" href="/css/index.min.c860e17f20d9f258820c02bf7ab3f57c9595d0bc21dede7eda08ccd63ba3f4cc.css">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</head>
|
|
<body class="flex flex-col min-h-screen w-full bg-slate-50 dark:bg-gray-800"><header class="flex flex-none justify-center z-10">
|
|
<div class="flex flex-row gap justify-between w-full max-w-4xl lg:max-w-5xl h-12 mt-3">
|
|
<div class="flex-none ml-2 md:ml-0">
|
|
<a href="/" class="">
|
|
<img class="h-12 w-12 rounded-full object-cover bg-gray-100" src="/joerg-profil-2024.webp" alt="logo">
|
|
</a>
|
|
</div>
|
|
<div class="flex-1"></div>
|
|
<div class="flex-none">
|
|
|
|
|
|
|
|
|
|
<nav class="h-full static">
|
|
<button id="navbar-menu-toggle" type="button" class="inline-flex items-center p-2 text-sm text-slate-800 dark:text-slate-200 rounded-lg md:hidden" aria-controls="navbar-menu" aria-expanded="false">
|
|
<span class="sr-only">Hauptmenü öffnen</span>
|
|
<i class="w-8 h-8">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-menu-2" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
|
|
<path d="M4 6l16 0" />
|
|
<path d="M4 12l16 0" />
|
|
<path d="M4 18l16 0" />
|
|
</svg>
|
|
|
|
</i>
|
|
</button>
|
|
<div class="absolute md:static top-16 left-0 right-0 z-50 hidden w-full md:block md:w-auto" id="navbar-menu">
|
|
<ul class="flex flex-col mx-2 md:mx-0 md:flex-row md:border-0 rounded-sm md:rounded-full px-3 text-base font-medium text-slate-800 dark:text-slate-200 shadow-lg bg-white dark:bg-gray-600 shadow-slate-800/5 dark:shadow-slate-200/5 ring-1 ring-slate-900/5 dark:ring-slate-100/5">
|
|
|
|
<li id="" class="">
|
|
<a class="block px-3 py-3 hover:text-emerald-600"
|
|
href="/" title="Home">Home</a>
|
|
</li>
|
|
|
|
|
|
<li id="" class="">
|
|
<a class="block px-3 py-3 hover:text-emerald-600"
|
|
href="/tags/" title="Schlagworte">Schlagworte</a>
|
|
</li>
|
|
|
|
|
|
<li id="" class="">
|
|
<a class="block px-3 py-3 hover:text-emerald-600"
|
|
href="/impressum/" title="Impressum">Impressum</a>
|
|
</li>
|
|
|
|
|
|
<li id="" class="">
|
|
<a class="block px-3 py-3 hover:text-emerald-600"
|
|
href="https://reliverse.social/@joerglohrer" title="Mastodon">Mastodon</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
</div>
|
|
|
|
<div class="flex-none mx-1"></div>
|
|
|
|
<div class="flex-none md:hidden">
|
|
<a href=/search/ class="inline-flex items-center p-2 text-sm text-slate-800 dark:text-slate-200 rounded-lg" aria-controls="navbar-menu" aria-expanded="false">
|
|
<span class="sr-only">Suche</span>
|
|
<i class="w-8 h-8">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-search" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
|
<path d="M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0" />
|
|
<path d="M21 21l-6 -6" />
|
|
</svg>
|
|
|
|
</i>
|
|
</a>
|
|
</div>
|
|
<div class="darkmode-toggle flex flex-none mr-2 md:mr-0">
|
|
<label for="darkmode-toggle" class="flex items-center px-3 cursor-pointer rounded-full bg-gray-100 dark:bg-gray-600" title="Dark Mode umschalten">
|
|
<input name="darkmode-toggle" id="darkmode-toggle" type="checkbox" class="sr-only peer" aria-label="Dark Mode umschalten">
|
|
<div class="group flex flex-row gap-1 justify-center h-8 px-1 rounded-full bg-white dark:bg-gray-700">
|
|
<i class="h-6 w-6 flex-none rounded-full bg-yellow-400 place-self-center peer-checked:group-[]:invisible">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brightness-down" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
|
|
<path d="M12 5l0 .01"></path>
|
|
<path d="M17 7l0 .01"></path>
|
|
<path d="M19 12l0 .01"></path>
|
|
<path d="M17 17l0 .01"></path>
|
|
<path d="M12 19l0 .01"></path>
|
|
<path d="M7 17l0 .01"></path>
|
|
<path d="M5 12l0 .01"></path>
|
|
<path d="M7 7l0 .01"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<i class="h-6 w-6 flex-none rounded-full place-self-center invisible peer-checked:group-[]:visible">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-moon-stars" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z"></path>
|
|
<path d="M17 4a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2"></path>
|
|
<path d="M19 11h2m-1 -1v2"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
</header>
|
|
<main class="flex flex-auto justify-center">
|
|
|
|
<div class="w-full max-w-4xl lg:max-w-5xl">
|
|
<div class="flex flex-col mt-6 mx-2 md:mx-0 rounded-lg overflow-hidden shadow-md bg-white dark:bg-gray-700">
|
|
<div>
|
|
<a href="/2021/11/17/wordpress-werkstatt.html/">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8944884994434855314.webp 960w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu7610248239459608004.jpg 960w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="w-full object-cover h-36 md:h-48 xl:h-60" src="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8045952101686690525.jpg" width="1350" height="590" alt="WordPress Werkstatt PHP" title="WordPress Werkstatt PHP" loading="lazy" />
|
|
</picture>
|
|
</a>
|
|
</div>
|
|
<div class="flex flex-col gap-y-3 p-6">
|
|
<h1 class="text-4xl font-semibold text-slate-800 dark:text-slate-100">
|
|
<a href="/2021/11/17/wordpress-werkstatt.html/">WordPress Werkstatt PHP</a>
|
|
</h1>
|
|
|
|
|
|
<h2 class="my-4 text-large text-slate-600 dark:text-slate-300">
|
|
Advanced Custom Fields und Formulareingaben
|
|
</h2>
|
|
|
|
|
|
<ul class="flex flex-row flex-wrap text-slate-500 dark:text-slate-300">
|
|
|
|
|
|
|
|
<li>
|
|
<a href="/tags/acf/"
|
|
class="flex flex-row text-sm mr-2 py-1">
|
|
<i class="h-5 w-5 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hash" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M5 9l14 0"></path>
|
|
<path d="M5 15l14 0"></path>
|
|
<path d="M11 4l-4 16"></path>
|
|
<path d="M17 4l-4 16"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span class="ml-0">ACF</span>
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="/tags/wordpress/"
|
|
class="flex flex-row text-sm mr-2 py-1">
|
|
<i class="h-5 w-5 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hash" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M5 9l14 0"></path>
|
|
<path d="M5 15l14 0"></path>
|
|
<path d="M11 4l-4 16"></path>
|
|
<path d="M17 4l-4 16"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span class="ml-0">WordPress</span>
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="/tags/formulare/"
|
|
class="flex flex-row text-sm mr-2 py-1">
|
|
<i class="h-5 w-5 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hash" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M5 9l14 0"></path>
|
|
<path d="M5 15l14 0"></path>
|
|
<path d="M11 4l-4 16"></path>
|
|
<path d="M17 4l-4 16"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span class="ml-0">Formulare</span>
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="/tags/json/"
|
|
class="flex flex-row text-sm mr-2 py-1">
|
|
<i class="h-5 w-5 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hash" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M5 9l14 0"></path>
|
|
<path d="M5 15l14 0"></path>
|
|
<path d="M11 4l-4 16"></path>
|
|
<path d="M17 4l-4 16"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span class="ml-0">JSON</span>
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="/tags/plugin/"
|
|
class="flex flex-row text-sm mr-2 py-1">
|
|
<i class="h-5 w-5 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hash" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M5 9l14 0"></path>
|
|
<path d="M5 15l14 0"></path>
|
|
<path d="M11 4l-4 16"></path>
|
|
<path d="M17 4l-4 16"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span class="ml-0">Plugin</span>
|
|
</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
<div class="flex flex-col gap-y-1 md:flex-row md:gap-y-0 md:gap-x-4 text-slate-500 dark:text-slate-300">
|
|
|
|
|
|
<div class="flex flex-row text-base gap-x-1">
|
|
<i class="h-6 w-6 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-calendar" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z"></path>
|
|
<path d="M16 3v4"></path>
|
|
<path d="M8 3v4"></path>
|
|
<path d="M4 11h16"></path>
|
|
<path d="M11 15h1"></path>
|
|
<path d="M12 15v3"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<time datetime="2021-11-17T00:00:00+00:00">
|
|
2021-11-17
|
|
</time>
|
|
</div>
|
|
|
|
<div class="flex flex-row text-base gap-x-1">
|
|
<i class="h-6 w-6 flex-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hourglass-high" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M6.5 7h11"></path>
|
|
<path d="M6 20v-2a6 6 0 1 1 12 0v2a1 1 0 0 1 -1 1h-10a1 1 0 0 1 -1 -1z"></path>
|
|
<path d="M6 4v2a6 6 0 1 0 12 0v-2a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1z"></path>
|
|
</svg>
|
|
|
|
</i>
|
|
<span>
|
|
Lesezeit 2 Minuten
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<section class="prose prose-slate dark:prose-invert w-full max-w-4xl lg:max-w-5xl mt-6">
|
|
<h2>Inhaltsverzeichnis</h2>
|
|
<aside><nav id="TableOfContents">
|
|
<ul>
|
|
<li><a href="#json">JSON</a>
|
|
<ul>
|
|
<li></li>
|
|
</ul>
|
|
</li>
|
|
<li><a href="#php">PHP</a>
|
|
<ul>
|
|
<li><a href="#software">Software</a></li>
|
|
<li><a href="#plugin">Plugin</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</nav></aside>
|
|
</section>
|
|
|
|
|
|
|
|
<article class="mt-6 w-full max-w-4xl lg:max-w-5xl prose prose-slate dark:prose-invert prose-quoteless post-content">
|
|
<h1 id="wordpress-werkstatt-php">WordPress Werkstatt PHP</h1>
|
|
<p>Zunächst wird auf relilab.org das kostenfreie <a href="https://de.wordpress.org/plugins/advanced-custom-fields/" target="_blank" rel="noopener">Plugin ACF - Advanced Custom Fields</a>
|
|
installiert und aktiviert.
|
|
Dies ermöglicht weitere individuelle Beitragsfelder für die Beiträge.
|
|
Nun kann manuell aktiviert oder eine Feldgruppe importiert werden - hier mittels <a href="#ACF-JSON-Export">dieser JSON-Datei</a>
|
|
, die das abkürzt:
|
|
<div class="not-prose">
|
|
<figure>
|
|
<img src="h01-json-import.png"
|
|
alt=""
|
|
loading="lazy"
|
|
>
|
|
</figure></div>
|
|
|
|
mit dem Ergebnis, dass unter allen WordPress-Beiträgen jetzt zwei Terminfelder erscheinen, die ausgefüllt werden können:
|
|
<div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu10638503955594110412.webp 320w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu11641354830712878815.webp 640w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu6270597460248840189.webp 960w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu13710124356862619841.webp 1280w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu2344405227287193927.webp 1600w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu9906208054346259959.webp 1920w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu15892755219989258069.jpg 320w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu13260414893189478009.jpg 640w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu7070739399017478355.jpg 960w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu1227262159146907970.jpg 1280w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu10680859010074027683.jpg 1600w, /2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu16535648422837812005.jpg 1920w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/02-terminfelder_hu13260414893189478009.jpg" width="2550" height="1080" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
|
|
Zudem gibt es neu eine Kategorie “Termine”, die aktiviert werden kann mit Unterkategorien, die später Übersichtsseiten ermöglichen:
|
|
<div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/03-kategorien_hu808294735421259194.webp 320w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/03-kategorien_hu15796485438129464958.jpg 320w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/03-kategorien_hu1630272154010610305.jpg" width="634" height="532" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
|
|
Jetzt wird das <a href="https://github.com/rpi-virtuell/relilab-termine" target="_blank" rel="noopener">Plugin relilab-termine</a>
|
|
installiert und aktiviert
|
|
Nun kann mittels Shortcode <code>[relilab_termine]</code> eine Terminübersicht als WordPress-Block erzeugt werden:
|
|
<div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8030273912502346087.webp 320w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu12287844731339598663.webp 640w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8944884994434855314.webp 960w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu17252675307486064342.webp 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu6159681432606967888.jpg 320w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8045952101686690525.jpg 640w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu7610248239459608004.jpg 960w, /2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu2555311404445053940.jpg 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/04-termine-neu_hu8045952101686690525.jpg" width="1350" height="590" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
</p>
|
|
<h2 id="json">JSON</h2>
|
|
<h4 id="acf-json-export">ACF-JSON-Export:</h4>
|
|
<pre tabindex="0"><code class="language-json=" data-lang="json=">[
|
|
{
|
|
"key": "group_6193936e4f12c",
|
|
"title": "Termin",
|
|
"fields": [
|
|
{
|
|
"key": "field_619393f8e62e0",
|
|
"label": "Startet am",
|
|
"name": "relilab_startdate",
|
|
"type": "date_time_picker",
|
|
"instructions": "",
|
|
"required": 0,
|
|
"conditional_logic": 0,
|
|
"wrapper": {
|
|
"width": "",
|
|
"class": "",
|
|
"id": ""
|
|
},
|
|
"display_format": "d.m.Y H:i",
|
|
"return_format": "Y-m-d H:i",
|
|
"first_day": 1
|
|
},
|
|
{
|
|
"key": "field_619394a3e62e1",
|
|
"label": "Endet am",
|
|
"name": "relilab_enddate",
|
|
"type": "date_time_picker",
|
|
"instructions": "",
|
|
"required": 0,
|
|
"conditional_logic": 0,
|
|
"wrapper": {
|
|
"width": "",
|
|
"class": "",
|
|
"id": ""
|
|
},
|
|
"display_format": "d.m.Y H:i",
|
|
"return_format": "Y-m-d H:i",
|
|
"first_day": 1
|
|
}
|
|
],
|
|
"location": [
|
|
[
|
|
{
|
|
"param": "post_type",
|
|
"operator": "==",
|
|
"value": "post"
|
|
}
|
|
]
|
|
],
|
|
"menu_order": 0,
|
|
"position": "normal",
|
|
"style": "default",
|
|
"label_placement": "left",
|
|
"instruction_placement": "label",
|
|
"hide_on_screen": "",
|
|
"active": true,
|
|
"description": "",
|
|
"show_in_rest": 0,
|
|
"acfe_display_title": "",
|
|
"acfe_autosync": "",
|
|
"acfe_form": 0,
|
|
"acfe_meta": "",
|
|
"acfe_note": ""
|
|
}
|
|
]
|
|
</code></pre><h2 id="php">PHP</h2>
|
|
<h3 id="software">Software</h3>
|
|
<h4 id="php-storm">PHP-Storm</h4>
|
|
<p><a href="https://www.jetbrains.com/de-de/phpstorm/" target="_blank" rel="noopener">https://www.jetbrains.com/de-de/phpstorm/</a>
|
|
</p>
|
|
<h5 id="shortcode-zum-sprechen-bringen">Shortcode zum Sprechen bringen</h5>
|
|
<p><a href="https://developer.wordpress.org/reference/functions/add_shortcode/" target="_blank" rel="noopener">https://developer.wordpress.org/reference/functions/add_shortcode/</a>
|
|
|
|
In PhpStorm
|
|
<div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/05-php-storm_hu12982377581929914418.webp 320w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu1807805532182105225.webp 640w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu12851634901879346989.webp 960w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu4955437441532289849.webp 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/05-php-storm_hu4827462863840096259.jpg 320w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu7249465117598012049.jpg 640w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu5578401266170252106.jpg 960w, /2021/11/17/wordpress-werkstatt.html/05-php-storm_hu2428058475642649309.jpg 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/05-php-storm_hu7249465117598012049.jpg" width="1308" height="434" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
|
|
<code>add_shortcode( string $tag, callable $callback )</code></p>
|
|
<p>alle Termine listen, die
|
|
<a href="https://www.advancedcustomfields.com/resources/orde-posts-by-custom-fields/" target="_blank" rel="noopener">https://www.advancedcustomfields.com/resources/orde-posts-by-custom-fields/</a>
|
|
</p>
|
|
<p><div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu15910472035871987496.webp 320w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu6320772522747024829.webp 640w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu8899028715853228845.webp 960w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu8541953622335408994.webp 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu14094622832384974442.jpg 320w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu346329118464991948.jpg 640w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu5153037850317064482.jpg 960w, /2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu15751608568345164690.jpg 1280w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/06-termine-listen_hu346329118464991948.jpg" width="1308" height="566" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
</p>
|
|
<p>PHP-Storm nutzt als External Library dann WordPress
|
|
<div class="not-prose">
|
|
<picture>
|
|
<source type="image/webp" srcset="/2021/11/17/wordpress-werkstatt.html/07-external-library_hu5672708490841325158.webp 320w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu3122361097728923937.webp 640w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu1038200181717264693.webp 960w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu4432101327127392969.webp 1280w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu15717209123459359926.webp 1600w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu1607681631105581445.webp 1920w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<source type="image/jpeg" srcset="/2021/11/17/wordpress-werkstatt.html/07-external-library_hu18072628208523803056.jpg 320w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu12358302643887400072.jpg 640w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu52637165153801375.jpg 960w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu11558250619649644197.jpg 1280w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu15446451875138159557.jpg 1600w, /2021/11/17/wordpress-werkstatt.html/07-external-library_hu13328731026979326442.jpg 1920w" sizes="(min-width: 1024px) 100vw, 50vw" />
|
|
<img class="h-auto max-w-full rounded-lg" src="/2021/11/17/wordpress-werkstatt.html/07-external-library_hu12358302643887400072.jpg" width="2092" height="952" alt="" title="" loading="lazy" />
|
|
</picture>
|
|
</div>
|
|
</p>
|
|
<h3 id="plugin">Plugin</h3>
|
|
<p>Unsere Funktion:</p>
|
|
<pre tabindex="0"><code>/**
|
|
*Plugin Name: relilab Termine
|
|
*/
|
|
add_shortcode('termine','termineAusgeben');
|
|
|
|
function termineAusgeben( $atts ) {
|
|
|
|
$posts = get_posts(array(
|
|
'post_type' => 'post',
|
|
'posts_per_page' => -1,
|
|
'category' => 'termine',
|
|
'meta_key' => 'relilab_startdate',
|
|
'orderby' => 'meta_value',
|
|
'order' => 'DESC'
|
|
));
|
|
|
|
|
|
// ob_start();
|
|
global $post;
|
|
?>
|
|
<ul>
|
|
<?php
|
|
foreach ($posts as $post) {
|
|
setup_postdata( $post )
|
|
?>
|
|
<li>
|
|
<a href="<?php the_permalink(); ?>"><?php the_title(); ?> (date: <?php the_field('relilab_startdate'); ?>)</a>
|
|
</li>
|
|
<?php
|
|
}
|
|
?>
|
|
|
|
</ul>
|
|
<?php
|
|
wp_reset_postdata();
|
|
|
|
|
|
// return ob_get_clean();
|
|
}
|
|
</code></pre>
|
|
</article>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</main>
|
|
<footer class="flex flex-none justify-center">
|
|
<section class="flex flex-col md:flex-row mx-2 md:mx-0 gap-2 md:gap-0 justify-between w-full max-w-4xl lg:max-w-5xl py-6 text-slate-500 dark:text-slate-300">
|
|
<div class="flex flex-row">
|
|
|
|
|
|
|
|
<a href="https://reliverse.social/@joerglohrer" target="_blank" title="Mastodon" class="flex flex-row mr-2">
|
|
<span class="hidden">Mastodon</span>
|
|
<i class="h-6 w-6 flex-none"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-mastodon"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18.648 15.254c-1.816 1.763 -6.648 1.626 -6.648 1.626a18.262 18.262 0 0 1 -3.288 -.256c1.127 1.985 4.12 2.81 8.982 2.475c-1.945 2.013 -13.598 5.257 -13.668 -7.636l-.026 -1.154c0 -3.036 .023 -4.115 1.352 -5.633c1.671 -1.91 6.648 -1.666 6.648 -1.666s4.977 -.243 6.648 1.667c1.329 1.518 1.352 2.597 1.352 5.633s-.456 4.074 -1.352 4.944z" /><path d="M12 11.204v-2.926c0 -1.258 -.895 -2.278 -2 -2.278s-2 1.02 -2 2.278v4.722m4 -4.722c0 -1.258 .895 -2.278 2 -2.278s2 1.02 2 2.278v4.722" /></svg> </i>
|
|
</a>
|
|
|
|
|
|
|
|
<a href="https://nostrrr.com/p/npub1mmful66pyasny86vdxtm0d2v9v572hjtmx0ufaa2t4m9hxartuxs4wu69w" target="_blank" title="nostr" class="flex flex-row mr-2">
|
|
<span class="hidden">nostr</span>
|
|
<i class="h-6 w-6 flex-none"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
<path
|
|
class="nostro"
|
|
d="m 21.219688,10.632199 v 9.782376 c 0,0.36788 -0.298537,0.666422 -0.666421,0.666422 h -7.997031 c -0.367884,0 -0.666422,-0.298542 -0.666422,-0.666422 v -1.82178 c 0.03645,-2.233152 0.272682,-4.372276 0.768675,-5.34546 0.297363,-0.58532 0.78748,-0.903839 1.350469,-1.074263 1.063686,-0.319694 2.93013,-0.10108 3.722312,-0.138691 0,0 2.392997,0.09521 2.392997,-1.259967 0,-1.0907187 -1.069562,-1.0049187 -1.069562,-1.0049187 -1.178867,0.03055 -2.076831,-0.04937 -2.658626,-0.278557 C 15.421721,9.1077763 15.388811,8.4049219 15.385285,8.1698534 15.337094,5.4548117 11.333878,5.1292411 7.8066742,5.8027121 3.9503743,6.536127 7.8489842,12.063765 7.8489842,19.44257 v 0.984936 c -0.00706,0.362004 -0.299712,0.654662 -0.6640682,0.654662 h -3.95973 c -0.3678829,0 -0.6664195,-0.298534 -0.6664195,-0.666415 V 3.4966903 c 0,-0.3678822 0.2985366,-0.6664194 0.6664195,-0.6664194 h 3.7223109 c 0.3678822,0 0.6664189,0.2985372 0.6664189,0.6664194 0,0.546534 0.6147044,0.8509478 1.0589839,0.5324305 1.3387143,-0.9590801 3.0570663,-1.4703543 4.9799263,-1.4703543 4.307633,0 7.564508,2.5105327 7.564508,8.0734325 z M 14.068901,8.6470424 c 0,-0.7874805 -0.638211,-1.4256909 -1.425691,-1.4256909 -0.787479,0 -1.425692,0.6382104 -1.425692,1.4256909 0,0.7874809 0.638213,1.4256916 1.425692,1.4256916 0.78748,0 1.425691,-0.6382107 1.425691,-1.4256916 z"
|
|
id="nostr"
|
|
style="fill:currentColor;fill-opacity:1;stroke-width:0.5" />
|
|
</svg>
|
|
</i>
|
|
</a>
|
|
|
|
|
|
|
|
<a href="https://bsky.app/profile/joerglohrer.bsky.social" target="_blank" title="Bluesky" class="flex flex-row mr-2">
|
|
<span class="hidden">Bluesky</span>
|
|
<i class="h-6 w-6 flex-none"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-bluesky"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6.335 5.144c-1.654 -1.199 -4.335 -2.127 -4.335 .826c0 .59 .35 4.953 .556 5.661c.713 2.463 3.13 2.75 5.444 2.369c-4.045 .665 -4.889 3.208 -2.667 5.41c1.03 1.018 1.913 1.59 2.667 1.59c2 0 3.134 -2.769 3.5 -3.5c.333 -.667 .5 -1.167 .5 -1.5c0 .333 .167 .833 .5 1.5c.366 .731 1.5 3.5 3.5 3.5c.754 0 1.637 -.571 2.667 -1.59c2.222 -2.203 1.378 -4.746 -2.667 -5.41c2.314 .38 4.73 .094 5.444 -2.369c.206 -.708 .556 -5.072 .556 -5.661c0 -2.953 -2.68 -2.025 -4.335 -.826c-2.293 1.662 -4.76 5.048 -5.665 6.856c-.905 -1.808 -3.372 -5.194 -5.665 -6.856z" /></svg> </i>
|
|
</a>
|
|
|
|
|
|
|
|
<a href="https://www.instagram.com/joerglohrer" target="_blank" title="Instagram" class="flex flex-row mr-2">
|
|
<span class="hidden">Instagram</span>
|
|
<i class="h-6 w-6 flex-none"> <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"></path>
|
|
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
|
|
<path d="M16.5 7.5l0 .01"></path>
|
|
</svg>
|
|
</i>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
<div class="grow"></div>
|
|
<div class="flex flex-row">
|
|
<i class="h-6 w-6 flex-none"><svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-copyright" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
|
|
<path d="M14 9.75a3.016 3.016 0 0 0 -4.163 .173a2.993 2.993 0 0 0 0 4.154a3.016 3.016 0 0 0 4.163 .173"></path>
|
|
</svg>
|
|
</i> 2023 - 2024
|
|
|
|
</div>
|
|
|
|
<div class="flex flex-row">
|
|
<span class="ml-0 pl-0 md:ml-2 md:pl-2 border-l-0 md:border-l border-slate-300 dark:border-slate-400">
|
|
Powered by <a href="https://gohugo.io" target="_blank" rel="noopener" class="underline">Hugo</a> <span class="text-red-600">♥</span> <a href="https://github.com/tomowang/hugo-theme-tailwind" target="_blank" rel="noopener" class="underline">Tailwind</a>
|
|
</span>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
</footer>
|
|
<script src="/main.min.65ca5b0808abf278fcec5d424701ebf0b4bc46a737129cd5e57fdb739f463e79.js"></script>
|
|
|
|
<div class="hidden top-1 right-1" id="code-copy">
|
|
<i class="h-6 w-6 block">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-copy" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
|
|
<path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" />
|
|
<path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" />
|
|
</svg>
|
|
|
|
</i>
|
|
</div>
|
|
<div class="hidden top-1 right-1" id="code-copy-done">
|
|
<i class="h-6 w-6 block">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-check" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
|
|
<path d="M5 12l5 5l10 -10" />
|
|
</svg>
|
|
|
|
</i>
|
|
</div><script src="/code-copy.min.e7b2a74adef1ed474c335c8bd5e7832b2316b8842b0f9184d65286c5bd64f51a.js"></script>
|
|
|
|
|
|
|
|
|
|
|
|
</body>
|
|
</html>
|