Blokino – Block Effects & Custom Blocks

Blokino adds motion and interaction to WordPress blocks without ever hardcoding a style: every effect is opt-in per block, and every value (color, easing, duration) is read from the active theme’s design tokens (--tnt-*). Switching themes never breaks your content.

What it provides

• Effects on native blocks (tf* attributes). A “Blokino Effects” panel is added to Group, Columns, Cover, Image, Heading, Paragraph and Buttons. Choose an entrance animation (fade-up, clip-reveal, mask-up, blur-in, scale-in, slide, text-stagger), a hover effect (lift, glow, tilt, magnetic, image-zoom, underline-grow), a scroll effect (parallax, sticky-pin, reveal, progress), blend modes and animated borders. A block with no effect attribute stays completely clean.
• Custom blocks where the core falls short. Section (advanced backgrounds: video, gradient, mesh, overlay, shape dividers), Marquee (infinite band), Counter (animated number on scroll), Before/After (image comparator), Slider and Testimonials (Swiper-powered), Brand, Icon and Badge.
• A lightweight effects runtime. Effects are detected per page and their assets are enqueued only when a block on the page uses them. Reveal uses the native IntersectionObserver and scroll effects run on requestAnimationFrame — no third-party animation library. Swiper (MIT) is the only bundled library, loaded solely on pages with a slider. prefers-reduced-motion is always respected.
• An options panel + demo importer. Global settings, JSON import/export, sidebar layout controls, and a per-theme demo importer with a progress bar and one-click rollback.
• A free theme to start with. Blokmark, our free block theme on WordPress.org, is built for this engine: a designed home the moment you activate it, three looks, blog and page templates. The Themes screen installs it with WordPress’s own theme installer, then lists the premium themes.
• A Get started screen. Site status, the three steps to a finished site (theme → demo → effects) and the doors to the documentation.

Design principles

• Nothing hardcoded — no effect is applied unless a block attribute activates it.
• Motor/design separation — functionality lives here, presentation lives in each theme.
• Degrades with dignity — the engine ships sensible token defaults, so effects and blocks look good under any theme, not only the ones built for it.

Who makes it

Developed and maintained by TUNET Digital Agency (https://tunetdesign.com). Source and issue tracker: https://github.com/aitunet. Support: [email protected]

External services

Blokino works fully offline. It connects to an external service only in the three cases below, never in the background, and sends personal data only if you explicitly allow it (deactivation feedback with “You may contact me” ticked).

tunetdesign.com theme catalog — When you open Blokino → Themes in wp-admin, the plugin sends one GET request to https://tunetdesign.com/wp-json/tunet/v1/themes to list the themes designed for this engine (name, tagline, price, preview image, demo link). The request carries no site URL, no user data and a neutral user agent; the response is cached for 12 hours. The screen is optional — if you never open it, the request is never made. Service by TUNET Digital Agency: terms https://tunetdesign.com/terms/ · privacy https://tunetdesign.com/privacy/

Deactivation feedback (optional) — When you click Deactivate on Blokino in the Plugins screen, a dialog asks why you are leaving. Nothing is sent unless you pick a reason and press Submit & deactivate; Skip & deactivate deactivates right away and sends nothing. On submit, your site’s server sends one POST request to https://tunetdesign.com/wp-json/tunet-store/v1/feedback with the reason, the text you typed, the Blokino, WordPress and PHP versions, the admin language and the active theme’s name, with a neutral user agent. Your email address and your site’s URL are included only if you tick You may contact me about this. Answers are read by the plugin’s authors to fix what made people leave. Service by TUNET Digital Agency: terms https://tunetdesign.com/terms/ · privacy https://tunetdesign.com/privacy/

Google Fonts — Only if you choose a Google font family in Blokino → Settings → Typography, the front end and the editor load that family’s stylesheet from https://fonts.googleapis.com (and the font files from fonts.gstatic.com), like most themes and page builders do. Visitors’ browsers request the files directly from Google; the plugin sends nothing itself. Leave the typography setting on your theme’s fonts and no request to Google is made. Google Fonts terms https://developers.google.com/fonts/terms · privacy https://policies.google.com/privacy

Bundled library — Swiper 11 (MIT, https://github.com/nolimits4web/swiper) is included as a minified file and enqueued only on pages that contain a slider; its readable source lives in that repository. The plugin’s own JavaScript is shipped unminified. Full source: https://github.com/aitunet/blokino