Element Library — was es ist und wie du sie nutzt

Die Element Library ist Hubbees Katalog wiederverwendbarer Design-Elemente, die du an jede verbundene WordPress-Site pushen kannst. Jedes Element ist ein in sich geschlossener Chunk — JavaScript, CSS und Assets — das das Plugin on-demand installiert.

Welche Arten von Elementen

Elemente fallen in drei Familien:

• Backgrounds — Full-Page- oder Section-level-Visual-Effekte (LiquidEther, Galaxy, LightRays etc.)
• Elements — animierte UI-Primitives (BorderGlow, AnimatedList, Carousel etc.)
• Text-Effekte — typografie-fokussierte Animationen (ASCIIText, CircularText, TextPressure etc.)

Du browst alle in Asset Library im Dashboard. Jede Karte zeigt ein Live-Preview, eine One-Line-Description und die Chunk-Größe.

Wie sie zu deiner WordPress-Site kommen

Elemente sind nicht im Hubbee-Plugin gebündelt. Das Plugin liefert nur eine Runtime — etwa 80 KB. Wenn du ein Element pushst, lädt das Plugin nur diesen spezifischen Chunk von Hubbees Storage runter und installiert ihn lokal.

Das hält das Plugin klein (schnelle Updates, geringer Memory) und lässt uns neue Elemente hinzufügen, ohne jedes Mal das Plugin neu zu releasen. Ein typischer Chunk ist 5-50 KB.

Element an Site pushen

1. Asset Library → Element-Karte klicken → Preview mit Live-Demo öffnet
2. An Site pushen → Ziel-Site(s) wählen
3. Bestätigen → Push feuert binnen 1-2 Sekunden

Das Plugin meldet via standardmäßiger Push-Pipeline zurück. Nach Installation ist das Element verfügbar in:

• Elementor: als neues Widget in der Hubbee-Kategorie
• Gutenberg: als Custom Block
• Shortcode: [bz_element name="border-glow"] (mit Attribut-Customization)

Konfiguration

Die meisten Elemente haben konfigurierbare Props (Farbe, Speed, Intensität). Du konfigurierst sie pro Einfügung — nicht pro Site. Das Plugin rendert das Element mit den Props, die du in Elementor/Gutenberg/Shortcode zur Render-Zeit setzt.

Das heißt: eine Site kann denselben border-glow dreimal mit drei verschiedenen Farbschemata nutzen. Der Chunk wird einmal installiert; mehrfach gerendert.

Wenn ich Props für alle Instanzen ändern will?

Zwei Pfade:

• Bei Einfügung konfigurieren: jeden Elementor/Gutenberg-Block editieren, Prop ändern, speichern
• Konfigurierte Variante pushen: Custom-Variante im Dashboard erstellen (Pro+) und Variante als separates Element pushen — siehe Custom Components

Elemente entfernen

Wenn du ein Element nicht mehr auf einer Site willst:

1. Element von allen Seiten entfernen, wo es genutzt wird (Elementor/Gutenberg/Shortcodes)
2. Hubbee-Site → Tab Installierte Elemente → Element klicken → Deinstallieren

Deinstallieren entfernt den Chunk vom WP-Filesystem und gibt Storage frei. Das Element bleibt jederzeit zum Re-Install verfügbar.

Updates

Wenn wir ein Element verbessern (neue Prop, Bugfix, Performance), zeigt das Dashboard ein Update verfügbar-Badge auf der Element-Karte. Klick es und der neue Chunk pusht zu allen Sites, die das Element installiert haben. Keine Downtime; der neue Chunk ersetzt den alten atomar.

Du kannst auch Auto-Update-Notifications deaktivieren und Elemente auf spezifische Versionen pinnen (Pro+). Nützlich für Kunden-Sites mit Change-Control.

Größen-Limits

• Free-Plan: bis zu 3 Elemente pro Site installieren
• Pro-Plan: unlimitierte Elemente pro Site
• Agency-Plan: unlimitiert + Workspace-Templates

Was es NICHT macht

• Element Library ist kein Page-Builder. Du nutzt weiterhin Elementor/Gutenberg zum Seiten-Komponieren. Elemente sind einzelne wiederverwendbare Teile, keine vollen Layouts.
• Elemente ersetzen nicht dein Theme. Sie sitzen on top.
• Elemente modifizieren nicht deine DB. Sie schreiben Files in wp-content/plugins/hubbee/chunks/.

Mehr zum Bauen eigener Custom-Elemente: Custom Components.