ACF-Blöcke bietet eine Auswahl an Blöcken, die aus Advanced Custom Fields Pro erstellt wurden

Veröffentlicht: 2020-05-07

Am Wochenende veröffentlichte Munir Kamal Version 2.0 seines ACF-Blocks-Plugins, ein Projekt, das eine Reihe von Blöcken für den Editor erstellt. Das Plugin bietet 18 benutzerdefinierte Blöcke in seiner kostenlosen Version und 15 weitere im Pro-Upgrade. Es baut auf Advanced Custom Fields Pro (ACF Pro) auf.

Das neueste Update des Plugins fügte Unterstützung für Typografie hinzu, einschließlich Optionen zur Verwendung verschiedener Google-Schriftarten für In-Block-Text. Kamal hat auch Basis-Styling-Optionen für Designmerkmale wie Rand und Polsterung für jeden Block im Plugin integriert.

Mit ACF Pro als harte Abhängigkeit wird die Zielgruppe von ACF-Blöcken eingeschränkt. Dieses Plugin wird größtenteils für Agenturen und Freiberufler nützlich sein, die innerhalb ihres Budgets schnell Funktionen für Kunden erstellen müssen. Zu diesem Zweck leistet das Plugin solide Arbeit.

Die enge Kopplung mit ACF Pro schadet der Benutzererfahrung für das Plugin. Die Ideen hinter ACF Blocks und seinen benutzerdefinierten Optionen gleichen jedoch die Mängel aus, die sich aus der Abhängigkeit von seinem abhängigen übergeordneten Plugin ergeben. Eine Entkopplung der beiden ist unwahrscheinlich, aber es würde zu einem reibungsloseren Erlebnis führen und das Plugin einem breiteren Publikum zugänglich machen.

Kamal ließ sich für das Plugin von ACF und seiner Pro-Version inspirieren. Er beschrieb den Prozess des Bauens von Blöcken mit dem Framework als „super einfach“, selbst für einen Entwickler auf mittlerem Niveau. „Es ist seit Jahren ein so erstaunliches WordPress-Framework, um benutzerdefinierte Felder zu erstellen“, sagte er. „Und als [Elliot Condon] die Blockerstellungsfunktion in ACF ankündigte, hat mich das schnell veranlasst, diese Sammlung gebrauchsfertiger ACF-Blöcke aufzubauen.“

Die größte technische Einschränkung besteht darin, dass Kamal keine verschachtelten Blöcke erstellen kann, was eine aktuelle Einschränkung von ACF darstellt. „Ich habe es bereits mit [Condon] besprochen, und er arbeitet bereits daran, diese Funktionalität hoffentlich bald bereitzustellen“, sagte er. „Sobald das zu ACF kommt, können wir weitere erstaunliche und mächtige Gutenberg-Blöcke erstellen.“

Sehen Sie sich eine kurze Anleitung zur Funktionsweise des Plugins an:

Nützliche Auswahl an Blöcken

Während ich hauptsächlich die kostenlose Version von ACF Blocks testete, stellte ich fest, dass sie mehrere nützliche Blöcke enthält, die allgemeine Anforderungen von Endbenutzern sofort erfüllen könnten. Mit 18 verfügbaren kostenlosen Blöcken haben Benutzer viel zu tun, bevor sie entscheiden, ob sie den Upgrade-Pfad zur Pro-Version einschlagen möchten.

Einer der besten Blöcke in der Sammlung ist der Photo Collage-Block. Es ist die Antwort von ACF Blocks auf den Kernblock Gallery. Allein die Rasteroptionen für diesen Block machen dieses Plugin einen Besuch wert. Der Block bietet zwischen 2 und 15 Rasterlayouts, abhängig von der Rasteroption, die der Benutzer auswählt.

Screenshot des Photo Collage-Blocks aus dem ACF Blocks-Plugin im WordPress-Editor.
Einstellen des Rasters für den Fotocollage-Block.

Mein zweiter Favorit im Sortiment ist der Testimonial Block. Gepaart mit den Typografie-Möglichkeiten, die für alle Blöcke zur Verfügung stehen, macht die Gestaltung eines Testimonial-Bereichs viel Spaß.

Screenshot des Testimonial-Blocks aus dem ACF Blocks-Plugin im WordPress-Editor.
Basteln mit Google Fonts im Testimonial-Block.

Dies ist eine kleine Auswahl dessen, was das Plugin tun kann. Der Preislistenblock kann Restaurantseiten dabei helfen, ihre Speisekarte zusammenzustellen. Der Pricing Box-Block, insbesondere wenn er in den Core-Columns-Block eingebettet ist, erleichtert die Einrichtung eines Preisabschnitts mit mehreren Produktoptionen. Und der Team-Block macht es einfach, Profilabschnitte auf der Team-/Info-Seite eines Unternehmens zu erstellen.

Die folgenden Blöcke sind in der kostenlosen Version verfügbar (mit mehreren weiteren in der Pro-Version):

  1. Scrollbarer Bildblock
  2. Tab-Block
  3. Sperren umschalten
  4. Akkordeon-Block
  5. Bild-Slider-Block
  6. Social-Sharing-Block
  7. Fotocollage-Block
  8. Beiträge blockieren
  9. Testimonial-Block
  10. Team-Block
  11. Multi-Buttons-Block
  12. Pricing-Box-Block
  13. Preislistenblock
  14. Bewertungsblock starten
  15. Fortschrittsbalken-Block
  16. Zählernummernblock
  17. Klicken Sie hier, um zu twittern Blockieren
  18. Block der Geschäftszeiten

Kamals Lieblingsblöcke aus der gesamten Suite sind Image Hotspot, der es Benutzern ermöglicht, einen Bildhintergrund mit „Zeigern“ festzulegen, um Inhalte einzublenden; Before After Image, mit dem Benutzer zwei Bilder mithilfe einer Schiebeleiste vergleichen können; und Photo Collage, der rasterbasierte Galerieblock des Plugins. Die ersten beiden sind nur in der Pro-Version des Plugins verfügbar. Der Plugin-Ersteller sagte, er denke, dass alle Blöcke nützlich seien, aber das Erstellen dieser Blöcke habe am meisten Spaß gemacht.

Raum für Verbesserung

ACF Blocks ist ein nettes Konzept. Es macht vieles richtig. Es gibt jedoch kleinere Probleme, die die Erfahrung bei der Arbeit mit seinen Blöcken dämpfen. Diese Probleme sind nicht unüberwindbar, und ich gehe davon aus, dass Kamal sie in den kommenden Versionen angehen wird, basierend auf der Vertrautheit mit seiner bisherigen Arbeit und dem Bestreben, großartige Produkte für Benutzer zu entwickeln.

Das unmittelbarste Problem und wahrscheinlich am einfachsten zu beheben sind die Stile des Plugins für den linken und rechten Rand in jedem Block. Das Plugin setzt diese Ränder standardmäßig auf 0 zurück. Je nach aktivem Theme auf einer Seite könnte dies die Blöcke an den Rand des Bildschirms statt in den Inhaltsbereich des Frontends verschieben. Einige Designs verwenden linke/rechte Ränder, um Inhalte auszurichten. Dies ist kein Problem, wenn nur ACF-Blöcke verwendet werden. Es ist unter Plugins mit Front-End-Ausgabe weit verbreitet.

Eine schnelle Lösung für das Randproblem besteht darin, einen der Blöcke des Plugins in den Kerngruppenblock einzuschließen. Dadurch werden die Ränder wieder unter die Kontrolle des Themas gestellt.

Das Bearbeiten von Blockinhalten erfolgt im Blockoptionsfeld und nicht direkt im Block. Ich bin mir nicht sicher, ob dies eine Einschränkung der Verwendung des ACF Pro-Frameworks oder eine Designentscheidung von Kamal ist. Es fühlt sich seltsam an, zwischen der Bearbeitung von Inhalten im Inhaltsbereich und der Bearbeitung von Inhalten in der Seitenleiste zu wechseln.

Ein Beispiel für meine Verwirrung mit Blockinhalten war der Fotocollage-Block. Ich klickte auf den Block in der Hoffnung, dass die Mediathek zum Hochladen erscheint. Nichts ist passiert. Ich habe erneut geklickt, weil ich beim ersten Mal vielleicht keinen guten Klick hinbekommen habe. Nichts ist passiert. Schließlich fand ich die Schaltfläche zum Hochladen von Bildern unter dem Optionsfeld des Blocks auf der rechten Seite.

Das Festlegen von Blockoptionen kann sich manchmal etwas träge anfühlen, da die Blockausgabe im Editor Änderungen nicht sofort widerspiegelt. Dies liegt hauptsächlich daran, dass ACF Blocks auf die serverseitigen Rendering-Funktionen von ACF Pro angewiesen ist. Es ist unwahrscheinlich, dass dies im Block-Plugin behoben werden kann. Einige Benutzer finden das verzögerte Rendern möglicherweise mühsam, wenn mehrere Optionen bearbeitet werden.

Abschließende Gedanken

Kamal hat einen nützlichen Satz von Blöcken zusammengestellt, die vielen Endbenutzern helfen werden, Abschnitte von Inhalten zu erstellen, die sie nicht standardmäßig erstellen können. Zwischen der kostenlosen und der Pro-Version gibt es insgesamt 33 Blöcke. Der Ersteller ist bestrebt, basierend auf dem Feedback der Benutzer im Laufe der Zeit weitere Blöcke hinzuzufügen. In der unmittelbaren Zukunft plant er, sich weiter mit Bugfixes zu beschäftigen und den Code zu verbessern.

Ich habe immer noch das Gefühl, dass die Funktionsweise von ACF Pro ein Hindernis dafür ist, wie gut dieses Plugin sein könnte, wenn es von Grund auf neu erstellt würde. Vor diesem Hintergrund hat das Framework dazu beigetragen, Kamals Plugin Wirklichkeit werden zu lassen. ACF Blocks ist ein Schaufenster der Möglichkeiten von ACF Pro, das andere Entwickler inspirieren sollte, die nach Lösungen suchen, die auf einem der am weitesten verbreiteten Frameworks im WordPress-Ökosystem aufbauen.

Kamal versteht, dass einige ACF Pro-Benutzer versuchen, ähnliche Blöcke zu erstellen, aber er ist der Meinung, dass das Wissen und die Hingabe seines Teams, Support anzubieten, die wichtigsten Teile der Gleichung sind. „ACF-Blöcke sparen Zeit und Mühe beim Erstellen von Blöcken für die gängigsten Webdesign-Elemente“, sagte er.

Hinweis: Diese Plugin-Überprüfung und das Feedback wurden vom Plugin-Autor angefordert. Lesen Sie unseren Beitrag über ehrliches Feedback auf der Grundlage echter Erfahrungen, um mehr darüber zu erfahren, wie Bewertungen gehandhabt werden.