Title: Rotatile Author: Alexandre R. Published: November 2, 2026 Last modified: November 2, 2026 --- Search plugins ![](https://ps.w.org/rotatile/assets/banner-772x250.png?rev=3779267) ![](https://ps.w.org/rotatile/assets/icon-256x256.png?rev=3779267) # Rotatile By [Alexandre R.](https://profiles.wordpress.org/fyrins/) [Download](https://downloads.wordpress.org/plugin/rotatile.1.0.0.zip) * [Details](https://wordpress.org/plugins/rotatile/#description) * [Reviews](https://wordpress.org/plugins/rotatile/#reviews) * [Installation](https://wordpress.org/plugins/rotatile/#installation) * [Development](https://wordpress.org/plugins/rotatile/#developers) [Support](https://wordpress.org/support/plugin/rotatile/) ## Description Rotatile adds a Rotation panel to the block inspector. Pick an angle, watch the block tilt in the editor, and that is the whole feature. There is no settings page, no account, no dashboard notice and no outgoing request. Out of the box the panel is offered on the Image block and nothing else. That restriction is the point rather than an oversight: a tilted paragraph is a paragraph people have to tilt their head to read. If your design needs another block type, one filter opens it up. **What it does not touch** The angle is kept in the block comment, not in the saved markup. Your post content stays byte for byte what the block itself produced, and the transform is added while the page is being built. Two things follow from that: * Deactivating the plugin does not invalidate a single block. The tilt stops, the content is intact, and the editor raises no “this block contains unexpected content” warning. * Nothing is written twice. The rotation exists in one place and is applied once, on the server. **Things worth knowing before you tilt something** A CSS transform has consequences that have nothing to do with this plugin, and they are worth saying out loud: * A rotated element still occupies its original, unrotated layout box. The visible corners stick out of it and can overlap whatever sits next to the block. Give the block some breathing room rather than expecting the page to make room for it. * A transform creates a containing block and a stacking context. A descendant with` position: fixed` stops being fixed to the viewport, and `z-index` inside the block is measured against the block instead of the page. * A block sitting inside the normal content width does not push the page sideways, even at 45 degrees. A block set to full-width alignment at a large angle does, and that is worth avoiding: a page that scrolls both up and down and left to right is hard to use and fails an accessibility requirement. Keep rotation for blocks inside the content width, or keep the angle small on a block that spans the whole viewport. **Front end** No JavaScript. One small stylesheet, requested only on pages that actually contain a rotated block, carrying a transform origin and a transition. The transition switches itself off for anyone whose system asks for reduced motion. **Filters** Everything is configured in code. `rotatile_supported_blocks` sets the block types,` rotatile_min_angle` and `rotatile_max_angle` set the range, `rotatile_step` sets the increment, `rotatile_default_angle` sets the starting value, and `rotatile_transition_duration` sets or removes the transition. The development README documents each one with an example. **Source code and build** The editor script shipped in `build/` is compiled from `src/editor.js`. The uncompiled source, the build configuration and the full history live in the public repository: https://github.com/Fyrins/rotatile The toolchain is [@wordpress/scripts](https://www.npmjs.com/package/@wordpress/scripts), the build tool maintained by the WordPress project, and nothing else. To reproduce the shipped file: ``` git clone https://github.com/Fyrins/rotatile.git cd rotatile npm install npm run build ``` The front-end stylesheet is not compiled: `assets/css/rotatile.css` is written by hand and shipped as it reads. ## Screenshots [⌊The Rotation panel in the block inspector, with the angle control and the reset button.⌉⌊The Rotation panel in the block inspector, with the angle control and the reset button.⌉[ The Rotation panel in the block inspector, with the angle control and the reset button. [⌊Dragging the angle control tilts the block in the editor straight away.⌉⌊Dragging the angle control tilts the block in the editor straight away.⌉[ Dragging the angle control tilts the block in the editor straight away. [⌊The same block on the front end, rotated by a server-rendered CSS transform.⌉⌊ The same block on the front end, rotated by a server-rendered CSS transform.⌉[ The same block on the front end, rotated by a server-rendered CSS transform. ## Installation 1. In your admin, go to Plugins, then Add New Plugin, and search for Rotatile. 2. Install and activate it. 3. Edit a post or a template, select an Image block, and open Rotation in the block settings sidebar. There is nothing to configure afterwards. A manual install works the same way: upload the folder to `wp-content/plugins` and activate it. ## FAQ ### Why is only the Image block supported? Because rotating text is a readability problem rather than a design feature. Anyone who genuinely needs another block type can say so in code, and that decision then lives in their theme instead of being the plugin’s default. ### How do I make another block type rotatable? Add this to your theme’s `functions.php` or to a small plugin of your own: ``` add_filter( 'rotatile_supported_blocks', function ( $blocks ) { $blocks[] = 'core/group'; return $blocks; } ); ``` ### Does it change my saved post content? No. The angle lives in the block comment, which block validation ignores. The markup stored in your database is exactly what the block’s own save function wrote. ### What happens to my rotated blocks if I deactivate the plugin? They stop being rotated, and that is all. No block is invalidated, no content is lost, and there is no cleanup to do. ### My rotated image overlaps the text below it. Is that a bug? No, that is how CSS transforms work. The layout box stays where it was and only the paint is rotated, so the corners of a tilted element reach outside their box. Add spacing around the block, or use a smaller angle. ### My page scrolls sideways now. Check whether the rotated block is set to full-width alignment. A block that already spans the viewport has nowhere to put its rotated corners, so they end up past the edge of the page and the browser offers a horizontal scrollbar. A block inside the normal content width does not do this, even at 45 degrees. Either drop the full- width alignment or use a smaller angle. ### Something inside my rotated block used to be sticky or fixed and now it is not. A transform turns the element into a containing block, so `position: fixed` inside it becomes relative to the block rather than to the viewport. That is a browser rule and the plugin cannot opt out of it. Rotate the inner element instead of the container, or drop the fixed positioning. ### Can I turn the transition off? Yes, and it is already off for anyone who has asked their operating system for reduced motion. To remove it for everybody: ``` add_filter( 'rotatile_transition_duration', '__return_empty_string' ); ``` ### Does it phone home? No. There is no telemetry, no external asset and no outgoing request of any kind, and no option is written to your database. ### I heard WordPress is adding its own rotation setting. It is being worked on in the Gutenberg project, and it is not part of WordPress 7.2. If it ships in a later release, it will store its angle somewhere else and use the CSS `rotate` property rather than `transform`, so the two do not break each other. They do add up, though: set the angle in one place only. Once the core setting is available on your site, it is the better choice for new content. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “Rotatile” is open source software. The following people have contributed to this plugin. Contributors * [ Alexandre R. ](https://profiles.wordpress.org/fyrins/) [Translate “Rotatile” into your language.](https://translate.wordpress.org/projects/wp-plugins/rotatile) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/rotatile/), check out the [SVN repository](https://plugins.svn.wordpress.org/rotatile/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/rotatile/) by [RSS](https://plugins.trac.wordpress.org/log/rotatile/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.0.0 * First release. * Rotation panel in the block inspector, with a free angle, a live preview and a reset button. * Server-side rendering through `render_block` and the HTML Tag Processor, with nothing written to the saved markup. * Stylesheet loaded only on pages that contain a rotated block. * Transition neutralised under `prefers-reduced-motion`. ## Meta * Version **1.0.0** * Last updated **10 hours ago** * Active installations **Fewer than 10** * WordPress version ** 6.6 or higher ** * Tested up to **7.1.4** * PHP version ** 7.4 or higher ** * Tags * [block-editor](https://wordpress.org/plugins/tags/block-editor/)[gutenberg](https://wordpress.org/plugins/tags/gutenberg/) [image](https://wordpress.org/plugins/tags/image/)[rotate](https://wordpress.org/plugins/tags/rotate/) [transform](https://wordpress.org/plugins/tags/transform/) * [Advanced View](https://wordpress.org/plugins/rotatile/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/rotatile/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/rotatile/reviews/) ## Contributors * [ Alexandre R. ](https://profiles.wordpress.org/fyrins/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/rotatile/)