Title: Grinner Blocks
Author: Haider Shah
Published: <strong>26. septembra 2026</strong>
Last modified: 13. oktobra 2026

---

Tykace pytaś

![](https://ps.w.org/grinner-blocks/assets/banner-772x250.png?rev=3714222)

![](https://ps.w.org/grinner-blocks/assets/icon-256x256.png?rev=3714222)

# Grinner Blocks

 Wót [Haider Shah](https://profiles.wordpress.org/shahofsheffield/)

[Ześěgnuś](https://downloads.wordpress.org/plugin/grinner-blocks.1.7.0.zip)

 * [Drobnostki](https://dsb.wordpress.org/plugins/grinner-blocks/#description)
 * [Pógódnośenja](https://dsb.wordpress.org/plugins/grinner-blocks/#reviews)
 *  [Instalacija](https://dsb.wordpress.org/plugins/grinner-blocks/#installation)
 * [Wuwiśe](https://dsb.wordpress.org/plugins/grinner-blocks/#developers)

 [Pódpěra](https://wordpress.org/support/plugin/grinner-blocks/)

## Wopisanje

See every block and effect in action at [grinner.io](https://grinner.io).

**Why Grinner Blocks**

 * Performance-first: many blocks ship no JavaScript at all, and each block’s CSS
   and JavaScript load only on pages that use it.
 * Everything is included — no paid tier, no locked features.
 * Native blocks in the editor you already use. Deactivate the plugin and your posts
   keep their content; the controls added to core blocks simply switch off.
 * Landing-page features: animated marquees, before/after sliders, counters, scroll
   reveals, avatar stacks and more.
 * You edit everything directly: place a block, drag it, change its text.

**Everything you need to build landing pages**

Grinner Blocks is a set of native blocks and controls for building and launching
modern landing pages in WordPress. It lives inside the block editor you already 
use — no page builder, no jQuery. Every block renders on the server where it can,
and each block’s own CSS and JavaScript load only on pages that use it. On block
themes, the shared styles also load only where a page uses them, leaving about half
a kilobyte site-wide; classic themes still load 82 KB of shared styles on every 
page.

**Blocks**

 * **Before / After** — two-image comparison slider, side by side or top and bottom,
   with a draggable divider driven by a real range input so it works with a keyboard
   and a screen reader. On touch screens the page still scrolls freely across it.
   Zero layout shift.
 * **Avatar Stack** — overlapping avatars for social proof, in a straight row or
   a gentle arc, with an optional „+N“ chip, a trailing label and hover effects.
   It shrinks to fit narrow screens. No front-end JavaScript.
 * **Logo Marquee** — a continuous scrolling row of logos, pausing on hover and 
   when scrolled off-screen.
 * **Image Slider** — the same continuous loop for photography, with fades, captions,
   hover effects and optional links. It can also stand still and let visitors swipe
   through it, looping endlessly.
 * **Text Rotator** — a line of text that cycles through a list, one item at a time,
   with fades, blurs, clip reveals or the Pixel Reveal and Decrypt effects. It can
   play an entrance animation first, its lines can carry formatting and accents,
   and it follows the alignment of the layout it sits in. Visitors who prefer reduced
   motion see the first item, still.
 * **Image Rotator** — a stepped carousel showing up to six images at a time, advancing
   on its own, with arrows, or both. Eight transitions (Carousel Flow can rest in
   an arc), pause on hover, and no autoplay for visitors who prefer reduced motion.
 * **Scrolling Text** — a marquee for words, with separators, tilt and per-item 
   styling.
 * **Countdown** — counts down to a date in any timezone, ticking live in the browser
   while a permanent screen-reader line states the real deadline.
 * **Video Embed** — a click-to-load YouTube facade using youtube-nocookie.com. 
   Nothing from YouTube runs until the visitor clicks; a poster and play badge stand
   in until then.
 * **Lottie** — a self-hosted Lottie player supporting .json and .dotlottie, with
   loop / once / hover playback, a poster fallback and a mobile kill switch. The
   player library loads only when an animation starts, and you choose whether it
   starts once the page has loaded or on the visitor’s first touch or scroll.
 * **Icon** — one inline SVG icon from a bundled set of 1,512, rendered server-side
   in six weights.
 * **Table** — a responsive table built from real blocks, so each cell can hold 
   anything.

**Responsive layout controls**

 * Set a maximum width per device — desktop, tablet and mobile — on headings, paragraphs,
   groups and columns.
 * Align a width-limited block left, centre or right with a box-alignment control.
 * Set how many columns a Grid block shows on desktop, tablet and mobile, with an
   optional gap for each.
 * Reorder the children of a Columns or Grid block on mobile without touching the
   desktop layout — per item, or with a one-switch reverse.
 * Choose when Columns stack: on phones only, on tablets as well, or two columns
   on tablets.

**Block enhancements**

Added as extra controls on the core blocks you already use:

 * Entrance animations and reveal-on-scroll for headings, paragraphs and groups,
   including the word-by-word Assemble effect, plus a number counter that counts
   up or shuffles its digits.
 * Accent text: select words and give them an accent from the toolbar — six ready-
   made styles built from your theme’s fonts and colours, or accents saved on your
   site — with highlights, underlines, circles, gradient or outline text and a draw-
   in animation. Each decoration has its own size and position controls, and changing
   an accent changes only the words you selected.
 * Grey to Colour: words go from muted to full colour as a heading or paragraph 
   scrolls up the screen. No JavaScript, and the text is always readable.
 * Script text effects for headings and paragraphs — Pixel Reveal, Line Reveal, 
   Decrypt and Typewriter — that hold the text’s exact layout while they run.
 * Button hover effects with their own fill and text colours, icons with their own
   colours, decorative corner marks, full-width fixes, vertical stacking, and click-
   to-play video buttons. On phones, a tapped button shows its hover colours while
   pressed and then returns to normal.
 * Navigation hover styles and markers, and item pills such as „New“ or „Hot“ beside
   a menu link; a sticky header with an optional glass effect.
 * A sticky call-to-action bar, whose buttons can stretch across the bar on phones,
   and clickable Group / Columns blocks where nested links still work independently.
 * Layout reveals, text gradients and inline text icons.
 * Image effects on the core Image block: hover tilt, zoom, lift, greyscale and 
   glare; parallax; entrances such as Rise, Wipe and Roll; and scroll effects such
   as zoom, tilt in and grey to colour. Images can also take a maximum width with
   limits, a resting angle, and stickers pinned over a section, still or animated.
 * A Loading setting on the Image, Cover and Post Featured Image blocks — Auto, 
   Lazy, Eager or Priority — so you decide which image loads first. In a Query Loop,
   Priority applies to the first card only.

**Site settings**

 * Header and footer code injection, gated on the unfiltered_html capability.
 * Smooth anchor scrolling with a scroll offset for sticky headers.
 * Simple exact-match redirects.
 * A site-wide switch for animated previews inside the editor.
 * An optional Excerpt field for pages, so Query Loop cards can show a summary you
   write.
 * A Data setting to keep or wipe your plugin data when you uninstall — off by default,
   so your data is kept.

**Performance and accessibility**

Every block’s CSS and JavaScript loads only on pages that actually use it, and the
stylesheets and scripts visitors download carry no developer comments. Many blocks
ship no JavaScript at all, and one shared IntersectionObserver drives every scroll
effect. Exactly one image per page is ever marked as the priority image, so nothing
competes for the browser’s attention. Content is never hidden waiting for a script,
even when a caching plugin delays JavaScript, and nothing Grinner Blocks animates
can make a page scroll sideways on a phone. Animated content is hidden from screen
readers and paired with a static equivalent, and every animation stops for visitors
who prefer reduced motion.

### External services

Grinner Blocks connects to one external service, YouTube (operated by Google), and
only on pages where you have added a YouTube video: a Grinner Video Embed block,
or a click-to-play video on a button, an image or a Lottie animation. No other external
service is contacted, and nothing is sent anywhere by the plugin’s own server code.

 * **Video thumbnails.** When a Grinner Video Embed block has no custom poster image,
   its poster is YouTube’s thumbnail for that video, loaded from i.ytimg.com when
   a visitor views the page, and in the editor while you edit the block. The request
   comes from the visitor’s browser, so YouTube receives the video ID, the visitor’s
   IP address and standard browser information. Choose a poster from your Media 
   Library and no thumbnail request is made.
 * **Video playback.** The player loads from youtube-nocookie.com only after a visitor
   clicks play; before that click nothing from YouTube runs. On that click YouTube
   receives the video ID, the visitor’s IP address and standard browser information,
   and the player is then governed by YouTube’s own terms. If JavaScript is unavailable,
   the play button is a plain link to the video on youtube.com.

YouTube Terms of Service: https://www.youtube.com/t/terms
 Google Privacy Policy:
https://policies.google.com/privacy

### Source

All first-party Grinner Blocks code ships in this plugin as it was written: plain,
human-readable PHP, JavaScript and CSS, with no compilation. This covers everything
under `blocks/`, `enhancements/`, `admin/`, `inc/blocks-layer2.php`, `inc/settings.
php`, `inc/redirects.php`, `grinner-blocks.php` and `uninstall.php`.

Since 1.7.0, visitors are served comment-free copies of the front-end stylesheets
and scripts. Each copy (`*.min.css`, `*.min.js`) sits next to its readable source
file in the same folder, and is made from it by removing only comments and extra
whitespace: names, strings and code are unchanged. The copies are made by the plugin’s
own build scripts, `bin/build-css.js` and `bin/build-js.js` (Node.js; the script
build reads the code with the acorn parser to find what is a comment), which are
development tools and are not included in the plugin. The readable file beside each
copy is the source.

Three sets of files are pre-built third-party code. Their readable source lives 
upstream:

 * **lottie-web 5.12.2** — `blocks/lottie/assets/lottie.min.js` is the official `
   lottie_light.min.js` build from release 5.12.2, unmodified (the „light“ build
   omits the expression evaluator). Source: https://github.com/airbnb/lottie-web—
   released under the MIT license.
 * **fflate 0.8.2** — `blocks/lottie/assets/fflate.min.js` is the official `umd/
   index.js` build from release 0.8.2, unmodified. Used to unpack `.lottie` archives
   in the browser. Source: https://github.com/101arrowz/fflate — released under 
   the MIT license.
 * **Twentig 2.0.1** — everything under `dist/` is the built asset output of the
   Twentig plugin, version 2.0.1, which Grinner Blocks forks. Source: https://wordpress.
   org/plugins/twentig/ — released under GPL-3.0-or-later. Three files carry first-
   party modifications: in `dist/index.css` the editor icon embedded in it was changed
   from Twentig’s mark to the plugin’s own mark; in `dist/style-index.css` and `
   dist/blocks/common.css` the block entrance animation’s hidden starting state 
   applies only once the plugin’s script has marked the page, so content is never
   left hidden when scripts are delayed or off. Upstream files the plugin does not
   use (starter-site templates and their preview images) are left out; every other
   file under `dist/` is unchanged from the upstream 2.0.1 release.

The icon artwork data under `enhancements/_shared/phosphor/` is generated from Phosphor
Icons 2.1.1 (https://github.com/phosphor-icons/core, MIT) and ships as plain, readable
JSON — see `manifest.json` there for the exact source version and generation date.

### Credits

Grinner Blocks includes code from Twentig by Twentig.com, used under the GPL.

Bundled third-party libraries and their licenses are listed under Source, above.

## Screenshots

[⌊The Grinner Blocks category in the block inserter, holding eleven of the twelve
Grinner blocks (the Image Rotator is under Media).⌉⌊The Grinner Blocks category 
in the block inserter, holding eleven of the twelve Grinner blocks (the Image Rotator
is under Media).⌉[

The Grinner Blocks category in the block inserter, holding eleven of the twelve 
Grinner blocks (the Image Rotator is under Media).

[⌊The Grinner Before / After block in the editor, with its before and after images
in the settings panel.⌉⌊The Grinner Before / After block in the editor, with its
before and after images in the settings panel.⌉[

The Grinner Before / After block in the editor, with its before and after images
in the settings panel.

[⌊The Grinner Countdown block in the editor — live preview, deadline date and time,
and timezone.⌉⌊The Grinner Countdown block in the editor — live preview, deadline
date and time, and timezone.⌉[

The Grinner Countdown block in the editor — live preview, deadline date and time,
and timezone.

[⌊The Grinner Lottie block in the editor — editor preview, playback, delay and width
controls.⌉⌊The Grinner Lottie block in the editor — editor preview, playback, delay
and width controls.⌉[

The Grinner Lottie block in the editor — editor preview, playback, delay and width
controls.

[⌊Responsive layout on a Grid block: columns per breakpoint for desktop, tablet 
and mobile, with an optional gap for each.⌉⌊Responsive layout on a Grid block: columns
per breakpoint for desktop, tablet and mobile, with an optional gap for each.⌉[

Responsive layout on a Grid block: columns per breakpoint for desktop, tablet and
mobile, with an optional gap for each.

[⌊Mobile order and per-device width on an item inside a Grid block, set in the inspector.⌉⌊
Mobile order and per-device width on an item inside a Grid block, set in the inspector
.⌉[

Mobile order and per-device width on an item inside a Grid block, set in the inspector.

[⌊A script text effect on a core heading — Decrypt, with its settle order, settle
duration and a Replay preview.⌉⌊A script text effect on a core heading — Decrypt,
with its settle order, settle duration and a Replay preview.⌉[

A script text effect on a core heading — Decrypt, with its settle order, settle 
duration and a Replay preview.

[⌊The Grinner Blocks settings screen — code injection, smooth scroll, editor, redirects
and data.⌉⌊The Grinner Blocks settings screen — code injection, smooth scroll, editor,
redirects and data.⌉[

The Grinner Blocks settings screen — code injection, smooth scroll, editor, redirects
and data.

## Blocks

This plugin provides 13 blocks.

 *   Grinner Icon A single Phosphor icon in any of six weights. Decorative by default;
   add a label to make it meaningful, a link to make it clickable, or a background
   to make it a chip.
 *   Grinner Table A table-style grid whose cells hold real blocks, so dynamic data(
   Block Bindings) can resolve inside cells — unlike the core Table block.
 *   Grinner Scrolling Text A continuous auto-scrolling strip of text items. CSS-
   only animation, zero JavaScript on the front end.
 *   Grinner Logo Marquee A continuous auto-scrolling logo strip. CSS-only animation,
   zero JavaScript on the front end.
 *   Grinner Lottie A self-hosted Lottie animation, lazy-initialised on scroll. 
   Optional loop/once/hover playback and a click-to-play YouTube popup.
 *   Grinner Image Rotator A stepped image carousel: up to six images visible, manual
   and/or automatic advance, with a transition vocabulary from flat fades to a shuffled
   card deck.
 *   Grinner Text Rotator A line of text that cycles through a list, one at a time,
   forever.
 *   Grinner Before / After Two images compared with a draggable divider. Drag anywhere,
   click to jump, or use the arrow keys.
 *   Grinner Video Embed Click-to-load YouTube embed. A static poster shows first;
   the player iframe is built only on click — zero third-party iframe at page load.
 *   Grinner Avatar Stack Overlapping avatars for social proof, with an optional“
   +N more” chip and trailing label.
 *   Grinner Image Slider A continuous auto-scrolling image strip. CSS-only animation;
   a tiny script loads on the front end only when the manual-scroll infinite loop
   is enabled.
 *   Grinner Countdown A deadline countdown timer. Shows the real remaining time
   at first paint, then ticks live in the browser.
 *   Table Cell One cell of the Grinner Table. Holds any blocks — headings, paragraphs,
   images.

## Instalacija

 1. Upload the `grinner-blocks` folder to `/wp-content/plugins/`
 2. Activate through the Plugins menu
 3. Go to Grinner Blocks in your WordPress admin menu, then add any Grinner block in
    the editor

## FAQ

### Is Grinner Blocks really free? Is anything locked behind a paid tier?

Every block, control and setting is free and included. There is no pro version, 
no locked features, and no account to create. The plugin is complete on its own.

### What happens to my content if I deactivate or delete the plugin?

Your posts and pages keep everything you wrote, and the controls Grinner Blocks 
adds to core blocks simply switch off — your core content is untouched. The plugin’s
own blocks, like Before / After, need the plugin active to display: while it’s deactivated
they show a placeholder, and they come straight back the moment you reactivate, 
with nothing lost. Deleting the plugin keeps your redirects and your header/footer
code, so reinstalling restores them — unless you first turn on „Delete all plugin
data“ under Grinner Blocks  Data.

### Do I need a page builder?

No. Grinner Blocks works entirely inside the standard WordPress block editor. There’s
nothing new to learn — the blocks and controls appear alongside the core ones.

### Does it work with the block editor I already have?

Yes. It uses the standard WordPress block editor (Gutenberg) — no separate editor,
no special mode, no shortcodes.

### Will it work with my theme?

It’s tested with WordPress’s native block themes and should be compatible with any
block-based theme. Grinner Blocks adds blocks and controls; it doesn’t replace your
theme or take over your layout.

### Will it slow my site down?

It’s built to avoid that. Many blocks ship no JavaScript at all, and each block’s
CSS and JavaScript load only on pages that use it.

### Does it work with caching and optimisation plugins?

Yes, with one setting to check. Grinner Blocks uses native image-loading attributes,
so it works alongside caching and optimisation plugins. When an optimiser delays
JavaScript, your content still shows straight away and the animations play once 
the scripts run. After you update Grinner Blocks, it clears LiteSpeed Cache’s page
and CSS/JS caches once, so visitors get the new styles. If you run a LiteSpeed-class
optimiser with image lazy-loading turned on, add „ilm-eager“ to its lazy-load class-
name exclusions — Grinner Blocks marks every image meant to load immediately (a 
hero poster or an above-the-fold marquee) with that class, and the exclusion lets
those images load straight away instead of being deferred. If your optimiser also
picks priority („LCP“) images on its own, the two can overlap. On LiteSpeed, that
feature can stay active for logged-out visitors even with its own setting switched
off, so check your page’s source rather than the settings screen. Grinner Blocks
never changes your optimiser’s settings for you.

### How do I keep a font size from shrinking on phones?

WordPress makes most font sizes fluid, so they shrink on small screens. For a size
that never shrinks on phones, add a Font size preset in Styles with Fluid typography
off, and pick it in Grinner’s font size controls like any other size.

### Where do I get help?

Ask on the plugin’s support forum on WordPress.org — post your question there and
we’ll answer it directly.

## Reviews

There are no reviews for this plugin.

## Sobustatkujuce a wuwijarje

„Grinner Blocks“ jo software wótwórjonego žrědła. Slědujuce luźe su pśinosowali 
k toś tomu tykacoju.

Sobustatkujuce

 *   [ Haider Shah ](https://profiles.wordpress.org/shahofsheffield/)

[Translate “Grinner Blocks” into your language.](https://translate.wordpress.org/projects/wp-plugins/grinner-blocks)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/grinner-blocks/), check
out the [SVN repository](https://plugins.svn.wordpress.org/grinner-blocks/), or 
subscribe to the [development log](https://plugins.trac.wordpress.org/log/grinner-blocks/)
by [RSS](https://plugins.trac.wordpress.org/log/grinner-blocks/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.7.0

 * New: Accent text. Select words and apply an accent from the toolbar: six ready-
   made styles (serif italic, marker, underline, squiggle, circle and gradient) 
   that use your theme’s fonts and colours, or accents saved on your site, with 
   highlights, lines and circles, gradient or outline text, a size and a draw-in
   animation. Each highlight, line, circle and border has size and position controls,
   with a live preview. Changes in the Accent panel apply to the selected words 
   only; anyone who can edit a page can save a look as a new accent, and administrators
   change or delete accents site-wide in the Site accents screen. Accented words
   can be kept on one line, and accents work with every text effect.
 * New: Grey to Colour text effect. Words go from muted to full colour, word by 
   word in reading order, as a heading or paragraph of up to 150 words scrolls up
   the screen. No JavaScript, and the text is always readable.
 * New: More hover options on the core Image block. Tilt has eight directions, a
   strength and a depth, and can follow the mouse; Zoom has an amount and a starting
   point, and can follow the cursor; a glare sheen and a hover speed are new. Linked
   images show their hover effect on keyboard focus too.
 * New: Image entrances: Fade, Rise, Settle, Wipe, Soft blur, Slide and Roll. An
   image the page shows straight away uses a movement-only version, so it is never
   hidden while the page loads.
 * New: Image scroll effects: Zoom on scroll, Tilt in, Grey to colour, Expand to
   full, Wipe in and Roll. CSS only; they follow the image as it travels up the 
   screen.
 * New: Image parallax, previously on or off, has a direction (down, up, left or
   right), a speed and a crop choice. „Break out of frame“ moves the whole image
   past its neighbours instead of inside its frame.
 * New: Rotation for images: a resting angle, with its own angle on phones if you
   like. It is not an animation, so it stays when motion is reduced.
 * New: Never smaller than / Never larger than for an image’s Max width, so a size
   in % or vw stops where you want it.
 * New: Pinned stickers can hang over a rounded section’s edge, sit up to 400px 
   out, or be inset by a percentage of the section or of the sticker itself; in 
   Custom placement they can be positioned by their top-left corner.
 * New: A Loading setting on the Cover and Post Featured Image blocks, as on the
   Image block: Auto, Lazy, Eager or Priority. In a Query Loop, Priority and Eager
   apply to the first card and the other cards load as they scroll into view.
 * New: Entrance animations on the Text Rotator, the same set as headings. The rotation
   starts once the entrance has played, rotating lines can hold formatting and accents,
   and the block has a Text alignment control and follows the alignment of the Stack
   or Row it sits in.
 * New: Vertical Before / After. The divider moves up and down, with keyboard and
   touch support; the page still scrolls when you swipe across it.
 * New: Navigation item pills: „New“, „Hot“, „Beta“ or your own text beside a menu
   link, inline or pinned to a corner, with full styling and an optional pulse. 
   Screen readers hear the label naturally.
 * New: Arc layout for the Avatar Stack, with a Curve control, and an Arc resting
   tilt for the Image Rotator’s Carousel Flow transition.
 * New: A Start setting for Lottie: start automatically once the page has loaded,
   or on the visitor’s first touch or scroll.
 * New: A Text colour for button hover animations, next to the Fill colour, so a
   light fill never leaves white text unreadable. Hover Colour also works on a button
   with no hover animation, for a simple colour change.
 * New: An Icon colour and a Hover icon colour for button icons. Left unset, the
   icon follows the button’s text colour, as before.
 * New: „Stretch buttons on mobile“ for the Sticky CTA: on phones the bar’s buttons
   share its full width, or each run full width when stacked. Off by default.
 * New: A „Stack at“ choice for Columns in Grinner Responsive: stack on tablets 
   as well as phones, or show two columns on tablets.
 * New: Scrolling Text uses WordPress’s own Size and Font controls (Styles tab, 
   Typography), so it gets every size and font from Styles, fluid sizes included.
   Sizes chosen before keep their meaning.
 * New: Palette colours stay linked. A colour picked from your palette in any Grinner
   setting is saved as that palette colour, so it changes when you change the palette
   in Styles. Custom colours, and colours saved before, work as they did.
 * New: Before / After takes a corner radius; Countdown takes a font, weight, letter
   spacing and letter case from Typography; Table cells take their own colours and
   vertical alignment; a Table’s padding can differ on tablets and phones, and its
   staggered entrance has a step and can go row by row. Lift hover has a Shadow 
   switch, and the Accordion has a Focus ring setting.
 * New: Page excerpts. A switch under Grinner Blocks  Editor adds WordPress’s own
   Excerpt field to pages, so Query Loop cards and the Post Excerpt block can show
   a summary you write. Off by default; turning it off keeps any excerpts you wrote.
   SEO plugins may use a written excerpt as the page’s description.
 * New: docs/settings-map.json lists every Grinner setting, its panel, its label
   and exactly what it stores, for developers and AI tools that build pages. Nothing
   loads it on your site.
 * Improved: Visitors get comment-free copies of Grinner’s stylesheets and scripts.
   The front-end stylesheets go from about 473 KB to 195 KB and the front-end scripts
   from about 180 KB to 74 KB. The readable source files are still in the plugin.
 * Improved: The Lottie player library loads only when an animation starts, and 
   an animation on the first screen waits until the page has loaded, so pages with
   Lottie appear much sooner.
 * Improved: Preload, preconnect and dns-prefetch links in your Header code are 
   placed at the very top of the page, before any styles, so preloaded files start
   downloading sooner. The rest of your Header code stays where it was.
 * Improved: Images placed by Grinner Blocks count towards WordPress’s „load the
   first few images straight away“ rule, so images further down a page load lazily,
   and only one image per page is ever given priority, even when the same picture
   appears in several blocks.
 * Improved: The Image Rotator downloads the next image at the size it will show,
   not the full original.
 * Improved: After Grinner Blocks is updated, LiteSpeed Cache’s page and CSS/JS 
   caches are cleared once, so visitors get the new styles. Nothing happens on sites
   without LiteSpeed Cache, and its settings are never changed.
 * Improved: Content is never hidden from first-time visitors when a caching plugin
   delays JavaScript: headings, sections and images show at once and animate once
   the scripts run.
 * Improved: On phones, Hero Mode keeps first-screen text still for the Pixel Reveal,
   Line Reveal, Decrypt and Typewriter effects. A Text Rotator’s Pixel Reveal or
   Decrypt transition changes lines plainly until the visitor’s first scroll or 
   tap, then plays.
 * Improved: On phones and tablets, a button shows its hover colours while it is
   pressed and then returns to its own colours, instead of turning black and staying
   black after a tap.
 * Improved: Slide Fill and Circle Expand with no Fill colour use your theme’s button
   hover colour from Styles, and button colours set in Styles with transparency 
   or color-mix() are followed.
 * Changed: Slide Fill and Circle Expand with a light Fill colour and no Text colour
   show dark text on hover (your theme’s contrast colour) instead of white, when
   that reads better.
 * Changed: A Sticky column’s „Disable on mobile“ is now „Pin on“: desktop only,
   desktop and tablet, or all screen sizes. Columns saved before keep what they 
   did.
 * Changed: A Row that stacks on smaller screens lines its children up along its
   horizontal alignment, as WordPress does; vertical Stretch keeps them full width.
   Its gaps accept spacing presets and clamp().
 * Fixed: Grinner effects and blocks no longer make a page scroll sideways on phones,
   including pinned stickers, corner marks, rotating text, sideways animations, 
   full-width bands and Image Sliders with side padding.
 * Fixed: The Logo Marquee, Image Slider and Scrolling Text no longer stretch a 
   card or column they sit in to thousands of pixels wide.
 * Fixed: An Image Slider set to manual scroll loops endlessly on block themes such
   as Twenty Twenty-Five (it used to stop at the end), and crosses its loop point
   without a jump.
 * Fixed: An image sized with Max width keeps its size in a Row beside long text,
   up to half the Row and never beyond the photo’s own size; it used to shrink.
 * Fixed: An SVG in an Image block that WordPress has no size for is no longer invisible
   as a pinned sticker, centred or in a row: it takes the size set in its file, 
   and elsewhere fills its column as before. An SVG’s Max width is now its size;
   for photos it stays a cap.
 * Fixed: A group in Hero Mode with Stagger children plays its children’s entrance
   on desktop; they used to stay still.
 * Fixed: Hover on each card no longer cancels a staggered entrance on the same 
   group.
 * Fixed: Buttons using Slide Fill, Text Flip, Grow or Circle Expand show your site’s
   button colour from Styles.
 * Fixed: Hover effects on buttons styled in Styles: Grow keeps the button’s own
   shape and hover colours; Text Flip shows the label in your button’s text colour
   and no longer crops it with a tight line height; Ghost Fill fills with your button’s
   own colours and shows its outline on phones and in the editor too; a gradient
   button’s fill slides in over the gradient.
 * Fixed: Text Flip on a button with formatted text flips the label as one unit,
   formatting included, and pressing a Text Flip button with a mouse no longer drops
   it back to its resting colour.
 * Fixed: Buttons with Slide Fill, Text Flip or Circle Expand are no taller than
   the button, so their bottom corner marks sit on its corners and a row of mixed
   buttons lines up.
 * Fixed: Only the image you mark Priority gets high priority. A featured image 
   shown above the content no longer takes a second high-priority slot, and on sites
   using LiteSpeed Cache the priority image keeps its head preload when the same
   picture also appears earlier on the page.
 * Fixed: The Video Embed, Lottie and Before / After blocks no longer disappear 
   inside a Row or Stack, or inside a Group that sits in one; the Image Rotator 
   and an Icon left at its default alignment follow the Row, Stack or Group they
   sit in; and a YouTube Shorts video is centred on your site as it is in the editor.
 * Fixed: A pinned sticker set to „Behind the content“ sits behind the section’s
   text and in front of its background, on the page and in the editor; it used to
   paint over the text.
 * Fixed: Parallax on a group’s children keeps pinned stickers where they were placed,
   and parallax on an image narrower than its column no longer shows the zoomed 
   picture past the image’s own edge.
 * Fixed: The Grinner Table is read as a table by screen readers (rows, column headers,
   row headers and cells), with an optional Table name. It looks the same.
 * Fixed: The Avatar Stack shrinks to fit a narrow screen instead of running off
   the side.
 * Fixed: Scrolling Text’s Full Width Breakout spans the whole screen even when 
   the block has side margins or sits inside a constrained group.
 * Fixed: A Text Rotator set to a large size sits like a heading of the same size
   instead of leaving extra space above and below.
 * Fixed: Count up animates numbers written with their unit, such as 0.8s, 180KB
   or 3x.
 * Fixed: With the Accordion’s Open animation on, answers are spaced as without 
   it.
 * Fixed: Line breaks inside headings and paragraphs using the Word by Word, Stagger
   Fade or Assemble effect are kept.
 * Fixed: On touch screens, scrolling the page across a Before / After slider no
   longer moves the divider.
 * Fixed: The Image Rotator no longer causes a layout shift each time its loop wraps,
   and images added without a web address (by a pattern or an import) show in the
   editor.
 * Fixed: Colour settings in the Before / After, Avatar Stack and Image Slider blocks
   accept colours only.
 * Fixed: Font size pickers in Grinner panels list the same sizes as WordPress’s
   own, including sizes added in Styles, and keep the size you pick when several
   share one base size.

#### 1.6.1

 * New: Stickers on the core Image block: Spin, Rock, Float or Turn on scroll, pinned
   anywhere over a section by one of nine anchors and a nudge, in front of or behind
   the content, and optionally hidden on phones. A sticker never takes the page’s
   priority image slot.
 * New: Play button settings for the Video Embed: size, fill colour, ring colour
   and pulse spread.
 * Changed: Grinner Blocks now works with WordPress 6.5 and later.
 * Improved: Accordion answers slide shut as well as open.
 * Fixed: The Lottie block’s width now shows in the editor as it does on the page.
 * Fixed: Word by Word animates each word of formatted text separately instead of
   treating the formatted words as one.
 * Fixed: The Word by Word, Stagger Fade and Assemble effects show correctly on 
   sites that remove unused CSS.
 * Fixed: A Lottie animation on the first screen no longer stays on its poster when
   scripts arrive late.
 * Under the hood: Output escaping tightened throughout, following the WordPress.
   org review.

#### 1.6.0

 * Renamed: the plugin is now Grinner Blocks. Block titles, the inserter category,
   the settings panels and the admin menu use the new name, and the admin menu icon
   and settings heading show a G. Your blocks, settings, redirects and header/footer
   code carry over unchanged.
 * Changed: Grinner Blocks now requires PHP 8.0 or later.
 * New: Snap transition for the Image Rotator — each image changes in one step, 
   with no movement in between.
 * Improved: The Image Rotator’s Pixel Reveal transition now plays in the editor
   preview.
 * New: The editor warns you when two blocks on a page both ask to load first — 
   a Priority image, or a Lottie, Video Embed or Before / After block with „Above
   the fold“ on. Only one image can load first, and it should be the largest one
   visible before scrolling.
 * Improved: An image you set to Priority now keeps the page’s priority slot even
   when an „Above the fold“ block appears earlier on the page, and images too small
   to be the main image never take it.
 * Improved: An image block with no loading setting now leaves the choice to WordPress,
   which loads the first large images on a page immediately and the rest lazily.
   Previously such images were always lazy-loaded, including hero images at the 
   top of the page. Images further down the page still load lazily.
 * Improved: A Priority image on a block theme starts downloading as soon as the
   page begins to load.
 * Improved: Images WordPress loads immediately now carry the „ilm-eager“ marker,
   so optimisers that honour it don’t delay them.
 * Fixed: Line Reveal and Pixel Reveal now cover the text with your section’s background
   colour instead of white, so no pale line shows on coloured sections.
 * Fixed: Pixel Reveal and Line Reveal no longer paint outside the heading onto 
   neighbouring content, or widen the page on phones.
 * Under the hood: Per-block styles for the Logo Marquee, Scrolling Text, Image 
   Slider, Site Logo width and Accordion now come from stylesheets instead of style
   tags printed inside the page.

#### 1.5.1

 * New: The Countdown block now counts down live in the editor, to exactly the moment
   your site counts down to. Turn it off for one block with „Preview animation in
   editor“, or for every block with the Animate previews switch under Grinner Blocks
   Editor.
 * Improved: Faster hero images on block themes. When a Video Embed, Lottie or Before/
   After block has „Above the fold (hero)“ turned on, its image starts downloading
   as soon as the page begins to load, instead of when the browser reaches it. Before/
   After fetches its „after“ image, the one browsers measure as the page’s main 
   image. Works alongside LiteSpeed Cache, including its WebP images, without downloading
   anything twice.
 * Improved: Lighter pages on block themes. The shared stylesheets inherited from
   Twentig, about 13.5 KB, now load only on pages that use them; every other page
   loads about half a kilobyte.
 * Improved: A more accurate plugin listing. A new External services section explains
   when YouTube is contacted, what it receives and how to avoid the thumbnail request.
   The loading and optimiser claims now match what the plugin actually does, and
   the website links to a site that no longer resolves are gone.
 * Fixed: Grinner Blocks and the Twentig plugin can now be active on the same site;
   previously, activating both caused a fatal error. Saved settings carry over automatically
   when you update.
 * Fixed: Sections using Stagger children with the Drop or Swing entrance no longer
   stay blank on pages that also use a text animation.
 * Fixed: Parallax inside a Group with rounded corners and an image now moves as
   you scroll instead of freezing.
 * Fixed: The Gradient sweep and Image zoom hover effects now show on Group and 
   Columns blocks (including Row, Stack and Grid) that have a background colour 
   or image. Applied to Children, Image zoom scales each card’s own background.
 * Fixed: The Countdown’s Left and Right alignment now takes effect inside a vertical
   Stack, where the timer previously stayed centred.
 * Developers: The iltk_breakpoints, iltk_fonts and iltk_block_classes filters replace
   twentig_breakpoints, twentig_fonts and twentig_block_classes. The old names still
   fire after the new ones and will be removed in a future release.

#### 1.5.0

 * New: Grinner Text Rotator block — a line of text that cycles through a list, 
   one item at a time. Pick a fade, blur, zoom or clip reveal, or the Pixel Reveal
   and Decrypt effects, and choose how long each item stays on screen.
 * New: Grinner Image Rotator block — a stepped image carousel showing up to six
   images at a time, advancing automatically, with arrows, or both. Seven transitions,
   from Slide and Fade to Centre Stage, Carousel Flow and a Card Drop deck. Its 
   controls can stay visible, appear on hover or stay hidden, and hovering pauses
   the rotation unless you switch that off.
 * New: Script text effects for headings and paragraphs — Pixel Reveal, Line Reveal,
   Decrypt and Typewriter. They keep your inline text colours, hold the text’s exact
   layout so nothing around it moves, and stay still for visitors who prefer reduced
   motion. Decrypt’s pace and settle order are adjustable, and Typewriter’s blinking
   caret can be turned off.
 * New: Assemble entrance animation — words start scattered and blurred, then drift
   into place one after another.
 * New: Shuffle style for the number counter — each digit spins through random values
   before locking onto the final number.
 * New: „Above the fold“ control on the Grinner Lottie block — turn it on for a 
   hero animation so its poster image loads immediately as the page’s priority image,
   appearing at once while the animation initialises. Off by default; below-the-
   fold animations keep loading lazily.
 * Improved: Images from Grinner blocks now carry WordPress’s own responsive-image
   safety net, so they stay inside their space even before your page’s styles have
   finished loading.
 * Improved: New placeholder logos and images in the Logo Marquee, Image Slider 
   and Image Rotator, so a freshly inserted block looks finished before you add 
   your own.
 * Improved: Buttons with hover effects or decorations, clickable Group and Columns
   blocks, and the Before / After grip now respond visibly when pressed.
 * Improved: Every Grinner settings panel now uses one consistent spacing, so controls
   are easier to scan.
 * Improved: The caching FAQ now explains that on LiteSpeed-class optimisers with
   image lazy-loading, adding „ilm-eager“ to the lazy-load exclusions lets the images
   Grinner Blocks marks to load immediately — hero posters and above-the-fold marquees—
   load right away instead of being deferred.
 * Fixed: The Video Embed poster no longer appears oversized for a moment before
   settling on sites that load stylesheets in the background.
 * Fixed: On sites that delay JavaScript until the visitor interacts, the first 
   click on a video button now opens the lightbox instead of leaving for YouTube.

Earlier versions (1.4.2 and before) are listed in changelog.txt, included in the
plugin.

## Meta

 *  Version **1.7.0**
 *  Last updated **2 dnja**
 *  Active installations **Fewer than 10**
 *  WordPress version ** 6.5 abo nowša **
 *  Tested up to **7.1.3**
 *  PHP version ** 8.0 abo nowša **
 *  Language
 * [English (US)](https://wordpress.org/plugins/grinner-blocks/)
 * Tags
 * [animation](https://dsb.wordpress.org/plugins/tags/animation/)[blocks](https://dsb.wordpress.org/plugins/tags/blocks/)
   [countdown](https://dsb.wordpress.org/plugins/tags/countdown/)[gutenberg](https://dsb.wordpress.org/plugins/tags/gutenberg/)
   [landing page](https://dsb.wordpress.org/plugins/tags/landing-page/)
 *  [Rozšyrjony naglěd](https://dsb.wordpress.org/plugins/grinner-blocks/advanced/)

## Pógódnośenja

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/grinner-blocks/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/grinner-blocks/reviews/)

## Sobustatkujuce

 *   [ Haider Shah ](https://profiles.wordpress.org/shahofsheffield/)

## Pódpěra

Got something to say? Need help?

 [Forum pomocy pokazaś](https://wordpress.org/support/plugin/grinner-blocks/)