Colecciones de bloques para Gutemberg

Apuntes de la Charla de José Ángel Vidania en la Wordcamp Zaragoza 2020.

La charla completa puede verse aquí:
Colecciones de bloques para WordPress

Disclaimer: estos son unos apuntes personales que he tomado viendo la charla. Ni José Ángel ni mis apuntes somos fuente responsable de afirmaciones como «esto es lo mejor». Personalmente, te recomiendo ver la charla mientras puedes clickar cómodamente en todos los enlaces recopilados a continuación 🙂

Colecciones de bloques recomendadas

Gutemberg Blocks – Ultimate Add Ons

Realizado por el grupo de Astra Press

• CREATIVE BLOCKSTable Of Contents
• Advanced Columns
• Advanced Heading
• Blockquote
• Call To Action
• Contact Form 7 Styler
• Content Timeline
• Google Map
• Gravity Form Styler
• Icon List
• Info Box
• Marketing Button
• Multi Buttons
• Post Layouts
• Post Timeline
• Price List
• Sections
• Social Share
• Team
• Testimonials

CoBlocks (goddady)

Revisar el tema GO creado por Goddady desarrollado exclusivamente para bloques

Kadence Blocks

Es el favorito de José Ángel. Deja hacer separadores svg. Además de bloques contiene librerías de plantillas.
Tiene EDITOR MAX WIDTH

• Row Layout – demo
• Advanced Gallery – demo
• Form – demo
• Advanced Heading – demo
• Advanced Button – demo
• Tabs – demo
• Accordion – demo
• Testimonials – demo
• Icon – demo
• Spacer / Divider – demo
• Info Box – demo
• Icon List – demo

Otter Blocks

• Section Block
• Advanced Heading Block
• Button Group Block
• Slider Block
• Google Maps Block
• Post Grid Block
• Service Block
• Pricing Block
• Testimonial Block
• About Author Block
• Font Awesome Block
• Sharing Icons Block
• Plugin Card Block

Stackable ✦

contiene también todo lo que puedes necesitar. Fue de las primeras que salieron.

• Container Block — View Block
• Separator Block — View Block
• Posts Block — View Block
• Feature Grid Block — View Block
• Accordion Block — View Block
• Image Box Block — View Block
• Feature Block — View Block
• Icon List Block — View Block
• Call to Action Block — View Block
• Card Block — View Block
• Header Block — View Block
• Count Up Block — View Block
• Video Popup Block — View Block
• Pricing Box Block — View Block
• Testimonial Block — View Block
• Team Members Block — View Block
• Notification Block — View Block
• Number Box Block — View Block
• Expand / Show More Block — View Block
• Button Block — View Block
• Blockquote Block — View Block
• Divider Block
• Spacer Block

Ultimate Blocks ✦ ✦

Para marqueteros, social content, etc. Tiene tabla de contenidos y el bloque de filtrado de contenido.

• Content Filter – View Demo
• Review (Schema Markup Enabled) – View Demo
• Table of Contents – View Demo
• Tabbed Content – View Demo
• Call to Action – View Demo
• Content Toggle (Accordion) – View Demo
• Styled Box – View Demo
• Styled List – View Demo
• Expand – View Demo
• Testimonial – View Demo
• Click to Tweet – View Demo
• Social Share – View Demo
• Countdown – View Demo
• Progress Bar – View Demo
• Post Grid – View Demo
• Star Rating – View Demo
• Image Slider – View Demo
• Button (Improved) – View Demo
• Divider – View Demo

Getwid blocks

• Section Block – build custom page section layouts of any type (set alignments; use video, slider and image backgrounds; change foregrounds, apply animation, play with colors and shapes, etc.).
• Advanced Heading Block – a rich typography control panel for creating catchy headings – access to Google fonts, styles, sizes, one-click text case conversion, spacing and colors.
• Google Maps Block – embed simple Google Maps with unlimited custom markers.
• Icon Block – create effective and clear user interfaces with a collection of customizable icons.
• Icon Box Block – construct responsive service boxes with icons, headings and text boxes using premade styles, modifying colors, sizes and hover effects.
• Image Box Block – get deeper into image presentation – add animation effects, apply the needed size in clicks and modify spacing.
• Social Links Block – add any social icons, customize their alignment for different devices, go with pre-made layouts and alter their size and spacing.
• Banner Block – advertise wisely with fully customizable banners for which you can define sizes, alignments, colors, animation effects and more tools for better presentation of your offerings.
• Image Slider Block – a better way to create image sliders with full control over navigation styles, image sizes and animation effects.
• Media & Text Slider Block – showcase brilliant sliders with texts, set custom content width and alignment, apply text and color overlays, choose slide and text animation effects individually.
• Button Group Block – add several call-to-action buttons in style and harmony; update width, alignment and direction for the whole set of buttons at the same time.
• Person Block – create simple and stunning team showcase sections with the settings for job titles, names and image sizes.
• Accordion Block – snap and functional accordion tabs section with customizable icons and heading types. Perfect for FAQ sections.
• Toggle Block – similar to Accordion block, but it lets users expand tabs manually.
• Tabs Block – horizontal tabs with a bunch of pre-set styles and customizable headings.
• Image Stack Gallery Block – breathtaking, fully customizable image galleries with seven different styles to unleash your creativity and find a perfect solution for your current WordPress theme design.
• Testimonial Block – a no-frills testimonial block with an author avatar, citation and name.
• Recent Posts Block – present your latest posts with custom metadata, list or grid layout and a choice of different output behaviors.
• Advanced Spacer Block – add a space between your blocks with an adjustable spacer – optionally hide it on mobile, tablet or desktop devices.
• Instagram Block – it provides an easy way to connect your Instagram to WordPress and creates a customizable live-feed gallery.
• Counter Block – show the most significant data about your business in numbers with the lightweight animated counters.
• Price Box Block – visualize any data by creating all sorts of comparison and pricing tables.
• Progress Bar Block – a simple animated horizontal progress bar with customizable colors.
• Circular Progress Bar Block – animated circular progress bars with the adjustable bar sickness, size and colors.
• Contact Form Block – a simple contact form with a traditional set of the form fields, customizable labels and support for reCAPTCHA.
• Post Carousel Block – use agile customization options to showcase posts, pages or custom post types in a catchy carousel with a custom layout.
• Price List Block – a perfect block for featuring restaurant menu prices or a table of contents with the adjustable headings, dotted lines, colors, and images.
• Post Slider Block – fetch your already existing posts, products or other custom post types data into a deeply tunable, stylish slider with several premade layouts.
• Custom Post Type Block – grid, list or custom view of any custom post types with numerous layout and style customization settings.
• Mailchimp block – easy MailChimp API integration for adding email subscription forms.
• Countdown block – a dynamic countdown timer with deeply customizable numeric values and time labels, for which you can set a font family and style, sizes, colors, spacing and more.
• Video Popup block – display your Youtube, Vimeo or self-hosted videos in popups; the play video button, custom video covers, colors and sizes of the block containers are fully adjustable.
• Content Timeline block – display chronological order of any events in a stylish timeline graph with such adjustable containers as headings, subheadings, images, etc.
• Image Hotspot block – place unlimited animated markers with fully customizable tooltips over your image to make it more informative and interactive.

Qodeblock

Tiene poquitos pero son muy chulos

• Inline Notice
• Drop Cap Block
• Testimonial Block
• Button Block
• Accordion Block
• Spacer Block
• Author Profile
• Pricing
• Call to Action Block
• Container
• Post and Page Grid
• Advanced Columns
• Email Newsletter
• Sharing Icons

Gutemberg block templates

está super guay el pro pero el pago es un fee anual que se vuelve bastante carillo después de un año. Pero por otra parte, si montas la web y dejas de pagarlo dice que
«You will have no more access to our premium designs in the plugin. Your existing pages will remain intact. The sections you added on the page will not break or disappear».
tiene todos estos diseños.

Kioken Blocks

bloques y plantillas

Cosmic blocks

tiene 47 bloques y muchos de ellos no los tiene nadie más.

Editors kit ✦

PLUGIN OBLIGATORIO INSTALAR Añade muchas funcionalidades del editor clásico al editor de gutemberg. Además te instala 29 plantillas al core de bloques.

Nota de uso:

Para todos los bloques que no se utilicen: al gestor de bloques y deshabilitar.