Ein Page Builder kann viel, aber keine Beschriftungen gleichmäßig auf einen Kreis setzen und keine Marken aus einem Feld der Seite ziehen. IDF Visual Content liefert genau diese Bausteine: zeichnet einen Ring mit Bild in der Mitte und beliebig vielen Stationen auf der Ringlinie, zeigt die Marken einer Seite als Logo-Zeile oder als Karten mit Logo, Beschreibung und Nachweisen.

Beide Shortcodes bringen keine eigene Überschrift mit und bleiben leer, wenn die Seite keine Daten hat. Die Felder legt das Plugin selbst an: Stationen, Bild und Marker an der Seite, die Marken-Auswahl an der Seite, die Nachweise an den WooCommerce-Marken. Gedacht für Leistungs- und Landingpages, die je Seite andere Stationen und andere Marken zeigen.

Changelog

v0.4.4

Geändert

  • Ohne Stationen erscheint kein Ring mehr. Joerg, 20.09.2026: „Wenn keine Ring-Werte angegeben, sollte der Ring einfach weg bleiben.“ Bis v0.4.3 reichte dem Shortcode das Beitragsbild als Rückfall, und auf der neuen Hub-Seite Fassadengestaltung stand deshalb ein leerer Ring aus zwei Kreisen mit Bild in der Mitte. Jetzt entscheidet allein die Liste der Stationen: ist sie leer, gibt [idf_vc_ring] nichts aus; im Avada-Builder steht statt dessen der Hinweis „Ring: keine Stationen hinterlegt, deshalb kein Ring.“ Das Bild in der Mitte bleibt Rückfall, sobald es Stationen gibt.

v0.4.3

Geändert

  • Ein Logo aus [idf_vc_marke_logo] folgt immer seiner Plugin-Zeile. Joerg, 19.09.2026, zur Zeile „[idf_vc_marke_logo]“ mit 40 px: „Ich verstehe nicht, was das dann ist. Das ist doch das Logo, das ich in der Karte aufrufe.“ Bis v0.4.2 hatte die Klasse an der Spalte seiner Post-Card-Vorlage (idf-marken-logo, 20 px) Vorrang, weil .klasse img spezifischer war als .idf-vc-logo--karte. Jetzt ist der Plugin-Selektor .idf-vc-logo.idf-vc-logo--karte und gewinnt; die Klassen-Zeilen gelten für Avada-Bildelemente, die ein Markenbild selbst zeigen (Dynamic Data: Bild der Marke, z. B. Produktkarten). Zusätzlich .fusion-imageframe:has(.idf-vc-logo) { max-width: none; overflow: visible }, damit ein Bildelement mit Plugin-Logo als dynamischem Inhalt nicht beschneidet. Zeilen im Reiter entsprechend umbenannt. Refs #4.

v0.4.2

Behoben

  • Avada-Bildelemente beschnitten die Logos. Auf den Archivkarten von Jacken stand von Fristads nur „FR“, von Greiff „G R“ (Joerg, 19.09.2026, Screenshot): das Bildelement (span.fusion-imageframe) hat overflow: hidden und eine Höchstbreite aus dem Builder (25 % der Karte), das Bild darin war nach der neuen Rechnung breiter. Für jeden Kontext mit Klasse gibt es jetzt zusätzlich .klasse, .klasse.fusion-imageframe { max-width: none; width: auto; overflow: visible }. Refs #4.
  • Landingpage-Karten reagierten nicht auf den Reiter (Joerg, 19.09.2026): die Post-Card-Vorlage rendert [idf_vc_marke_logo] ohne den Wrapper .idf-vc-marke__logo, den der Kontext „Marken-Karte“ erwartete, und hoehe="48" im Shortcode setzte die Basis fest. Der Einzel-Shortcode trägt jetzt die Klasse idf-vc-logo--karte, der Kontext meint beides; die Vorlage „PC Marke (Vorlage)“ auf ihre-ideenfabrik.de kommt ohne hoehe aus. Ein hoehe im Shortcode geht weiterhin vor, absichtlich. Die Kontexte heißen jetzt nach dem, was sie erkennen: „Produkt-Logo“ und „Marken-Logo“ (Bild-Element mit der Klasse, auch ein Avada-Bildelement mit [idf_vc_marke_logo] als dynamischem Inhalt) und die beiden Plugin-Bausteine; die Labels „Produktseite“ und „Landingpage: Marken-Karte“ führten in die Irre. Refs #4.

Geändert

  • Für Produktseite und Produkt-Archiv wird die CSS-Klasse des Bild-Elements eingetragen (wie im Avada-Feld „CSS-Klasse“, ohne Punkt) statt eines Selektors; der Selektor .klasse img entsteht daraus. Ein in v0.4.0/v0.4.1 gespeicherter Selektor .klasse img wird beim Lesen zur Klasse. Joerg, 19.09.2026: „Ich verstehe die Klassen nicht.“

v0.4.1

Geändert

  • Bezugsgröße ist die Wortmarke, nicht das Quadrat. In v0.4.0 bekam ein quadratisches Logo genau die Basis-Höhe und breite Wortmarken entsprechend weniger: in der Hero-Zeile von Berufskleidung standen Fristads mit 11 px und Geyser mit 9 px (live geprüft 19.09.2026). Jetzt ist eine Wortmarke 4 : 1 mit 35 % Tinte die 1, k = (4/ar)^a · (0,35/Tinte)^e / Rand; quadratische Logos werden relativ dazu größer, breite kleiner. Neuer Regler „Seitenverhältnis ausgleichen“ a (0,5 = gleiche Fläche, 0 = gleiche Höhe für alle, wie vor v0.4.0). Ein Logo ohne jede Messung bleibt bei 1. Refs #4.

v0.4.0

Hinzugefügt

  • Reiter „Logos“: Marken-Logos optisch gleich groß, ohne Style je Logo. Bei gleicher Höhe wirkt ein quadratisches, dünn gezeichnetes Logo winzig und eine fette Wortmarke riesig (Joerg, 19.09.2026: „Machen wir sie an Höhe und Breite fest, sind sie total unterschiedlich … nicht für jedes Logo jedes Mal einen extra Style“). Jedes Marken-Logo wird einmal vermessen: Box ohne leeren Rand, Seitenverhältnis, Tintenanteil; daraus ein Faktor k = 1/√ar · (0,35/Tinte)^e / Rand, mit dem Exponenten e (Standard 0,25; 0 = reine Fläche) und Grenzen für Höhe und Breite. Je Kontext eine Basis-Höhe: Produktseite (.idf-produkt-logo img, 40 px), Produkt-Archiv (.idf-marken-logo img, 28 px), Landingpage Logo-Zeile (32 px) und Marken-Karte (48 px); die beiden ersten Selektoren sind editierbar. Die vier gemessenen Logos (Greiff 1,25 : 1 mit 11 % Tinte bis Geyser 8,1 : 1 mit 51 %) landen damit bei 3,6 : 1 (Greiff zu Fristads), was Joergs Archiv-Abstimmung entspricht. Refs #4.
  • Ausgabe auf jeder Seite als Inline-CSS an einem Handle ohne Datei: img.wp-image-{ID},img[src*="/dateiname."]{--idf-logo-k:…}, {Selektor}{--idf-logo-basis:…} und eine Höhenregel über alle Kontexte (height: calc(basis × k), width: auto, object-fit: contain). Greift an Avada-Elementen, im Editor und an wp_get_attachment_image(), weil alle die Klasse wp-image-{ID} setzen. Regeln je Logo im Custom CSS entfallen.
  • Messung auf dem Server (Imagick, auch SVG mit Delegat; GD für Rasterbilder) beim ersten Bedarf, sonst im Backend per Canvas beim Öffnen des Reiters (AJAX idf_vc_logo_messen, Nonce, manage_options); Ergebnis im Anhangs-Meta _idf_vc_logo mit Datei-Hash, eine ersetzte Datei wird neu vermessen. Ohne Messung zählt nur das Seitenverhältnis aus den Metadaten. Reiter mit Vorschau je Kontext (reagiert sofort auf Exponent, Grenzen, Basis), Messwert-Tabelle, „Alle Logos neu vermessen“, CSS-Ausgabe. Übersicht zeigt „Marken-Logos vermessen x von y“.
  • Filter idf/visual_content/logos (weitere Anhänge), idf/visual_content/logos_css; Action idf/visual_content/logos_gespeichert. Test-Harness tests/test-logos.php.

Geändert

  • [idf_vc_marken hoehe] und [idf_vc_marke_logo hoehe] setzen nur noch die Basis-Höhe je Einsatz (--idf-logo-basis), leer = Reiter „Logos“; der Faktor je Logo gilt immer. Die eigenen Logos tragen die Klasse wp-image-{ID}.
  • uninstall.php löscht mit dem Schalter auch idf_visual_content_logos und die Messwerte.

v0.3.0

Hinzugefügt

  • Reiter „Ring“ im Plugin-Menü. Alles am Ring ist jetzt ohne CSS einstellbar (Joerg, 19.09.2026: „Der Ring gibt heute keine Möglichkeit, dass man ihn gestalten kann“): Höchstbreite; äußere und innere Ringlinie (Farbe, Stärke, innere Linie an/aus und Durchmesser); Durchmesser des Bildes; Marker (Farbe, Durchmesser, Umlaufzeit, Richtung); Stationen (Hintergrund, Rahmen, Rahmenstärke, Text, Hover, Form Pille/abgerundet/eckig, Innenabstand, Schriftsatz aus den Avada-Typografie-Sets, Schriftgröße für Desktop und unter 640 px, Laufweite, Großbuchstaben). Option idf_visual_content_ring über die Settings API; „Zurücksetzen“ leert sie, dann gilt wieder der Plugin-Standard, der dem bisherigen Aussehen entspricht. Nach dem Speichern wird der WP-Rocket-Cache geleert, andere Caches hängen sich an die Action idf/visual_content/ring_gespeichert. Refs #3.
  • Farbfelder mit den Farben des Themes, Bauart aus idf-digital-signage: Farbkreis (Iris aus WordPress) für eigene Farben, Textfeld für Name oder Hex-Code, Weltkugel mit der Palette des Themes (editor-color-palette; Avada meldet dort seine Global Colors, die zwölf WordPress-Standardfarben bleiben draußen). Eine Theme-Farbe wird als Kennung theme:<slug> gespeichert, nicht als Wert. Avada-Farben (awb-color-N) kommen im Frontend als var(--awb-colorN, #hex) an und folgen damit späteren Änderungen in den globalen Optionen, wie es die Regel „nur globale Farben“ verlangt; andere Themes bekommen den Wert der Palette. Refs #3.
  • Schriftsatz für die Stationen aus fusion_options['typography_sets'] (typography1 bis 5 und custom_typography_N, mit ihren Labels). Gesetzt, kommen Schrift, Gewicht, Stil, Zeilenhöhe, Größe, Laufweite und Großbuchstaben als var(--awb-<set>-…); einzelne Werte lassen sich darüber überschreiben. Filter idf/visual_content/schriftsaetze, idf/visual_content/theme_farben, idf/visual_content/ring_css.

Geändert

  • Der Ring füllt seine Spalte. Bisher stand er fest auf 480 px (--idf-vc-ring-size) und wurde in breiteren Spalten nicht größer (Joerg: „Sie sollte mindestens in dem Bereich, wo er steht, füllen“). Jetzt width: 100% mit max-width aus der Höchstbreite des Reiters (Standard: keine). Das Attribut groesse am Shortcode ist die Höchstbreite je Einsatz (--idf-vc-ring-max), mindestens 240; ohne Attribut gilt der Reiter. Refs #3.
  • Alle Ring-Werte im Stylesheet sind Variablen mit dem bisherigen Wert als Rückfall. Die Werte des Reiters gehen als Inline-CSS am Stylesheet-Handle mit (wp_add_inline_style), nur auf Seiten mit einem Baustein. Die innere Linie wird nur gerendert, wenn sie eingeschaltet ist.
  • Test-Harness tests/test-ring-einstellungen.php (Standards, Bereinigung, Palette, Schriftsätze, CSS, Reiter rendert); uninstall.php löscht die neue Option mit dem Schalter.

v0.2.0

Hinzugefügt

  • Marken-Karte selbst gestalten. [idf_vc_marken vorlage="ID" spalten="3"] rendert eine Post-Card-Vorlage aus der Avada-Bibliothek einmal je Marke der Seite; Aufbau, Farben und Schriften kommen damit aus dem Builder und den globalen Optionen statt aus dem Plugin-CSS (Joerg, 19.09.2026: die eingebauten Karten waren im Builder nicht definierbar). Raster mit 1 bis 6 Spalten, ab 1024 px höchstens 2, ab 640 px eine. Eine Vorlage, die sich selbst einbindet, wird abgefangen. Refs #2.
  • Einzel-Shortcodes je Marke für die Vorlage: [idf_vc_marke_logo] (hoehe, link, class), [idf_vc_marke_name] (link, tag, class), [idf_vc_marke_text] (absaetze, hoehe0), hoehe1 (hoehe2 chips|text, hoehe3, hoehe4), hoehe5 (hoehe6, hoehe7, hoehe8, auch umschließend). Alle mit hoehe9 auch einzeln nutzbar. Die aktuelle Marke wird in dieser Reihenfolge ermittelt: Attribut, Schleife der Vorlage, Filter link0, Marken-Term unter einem bekannten Global-Namen (link1, link2, link3, link4; keine Suche durch alle Globals), Marken-Archiv. Ohne Marke leer im Frontend, Hinweis im Builder. Refs #2.
  • Filter idf/visual_content/marken (Marken vor der Ausgabe) und idf/visual_content/marke (aktuelle Marke nachreichen).

Geändert

  • Stylesheet nur noch mit globalen Farben (--awb-color1 bis 5) und relativen Schriftgrößen; die Ring-Pillen bekommen ihre Größe über --idf-vc-station-size. Nachweise sind jetzt eine Liste (ul.idf-vc-chips > li.idf-vc-chip).
  • Logo und Archiv-Link liegen zentral in Idf_Visual_Content_Marke, [idf_vc_marken] nutzt sie.

v0.1.0

Hinzugefügt

  • Shortcode [idf_vc_ring]: Kreislauf-Ring mit Bild in der Mitte, Stationen auf der Ringlinie (gleichmäßig verteilt, optional verlinkt) und laufendem Marker. Daten aus der Feldgruppe „Ring (Visual Content)“ der Seite, Attribute stationen, bild, marker, groesse, class überschreiben.
  • Shortcode [idf_vc_marken]: die an der Seite ausgewählten WooCommerce-Marken als Logo-Zeile (layout="logos") oder Karten (layout="karten") mit Logo, Name, Beschreibung, Nachweisen als Chips und Link zum Marken-Archiv. Attribute label, hoehe, marken, limit, class.
  • Plugin-eigene ACF-Felder per Code: Repeater Stationen, Bild und Marker-Schalter sowie Marken-Auswahl an den Seiten; Feld „Nachweise“ an den Marken (product_brand).
  • Einstellungen: Post-Types, auf denen die Feldgruppen erscheinen (Voreinstellung physisch, strategie, digital, visuell, page).
  • Stylesheet nur auf Seiten mit Baustein; Farben aus den Avada-Globals mit Rückfallwerten.
  • Ohne Daten keine Ausgabe im Frontend, Hinweis im Page Builder. Keine eigene Überschrift, die setzt der Builder.
  • Menü unter IDF Home mit Übersicht, Einstellungen, DSGVO, Hilfe und Deinstallieren.

0 Comments

Info
  • Version: 0.4.4
  • Version vom: 20. September 2026
  • WordPress-Version: 6.0
  • Getestet bis WP-Version: 6.8
  • PHP-Version: 8.0
  • Kompatible Themes: Alle
  • Erforderliche Plugins: Advanced Custom Fields (ACF), WooCommerce
  • Mitwirkende: Joerg Martin