{"id":283027,"date":"2026-02-26T14:29:19","date_gmt":"2026-02-26T14:29:19","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/hide-block-on-mobile\/"},"modified":"2026-02-26T14:28:44","modified_gmt":"2026-02-26T14:28:44","slug":"triopsi-block-visibility","status":"publish","type":"plugin","link":"https:\/\/ml.wordpress.org\/plugins\/triopsi-block-visibility\/","author":17178931,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"2.0.0","stable_tag":"2.0.0","tested":"6.9.4","requires":"6.9","requires_php":"8.0","requires_plugins":null,"header_name":"Triopsi Block Visibility","header_author":"triopsi","header_description":"Adds a toggle to the block inspector allowing you to hide individual blocks on mobile devices by applying a `hide-mobile` CSS class.","assets_banners_color":"455161","last_updated":"2026-02-26 14:28:44","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"","header_author_uri":"https:\/\/triopsi.dev","rating":0,"author_block_rating":0,"active_installs":0,"downloads":201,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"2.0.0":{"tag":"2.0.0","author":"triopsi","date":"2026-02-26 14:28:44"}},"upgrade_notice":[],"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3470372,"resolution":"128x128","location":"assets","locale":""},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3470372,"resolution":"256x256","location":"assets","locale":""}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3470372,"resolution":"1544x500","location":"assets","locale":""},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3470372,"resolution":"772x250","location":"assets","locale":""},"banner.svg":{"filename":"banner.svg","revision":3470372,"resolution":false,"location":"assets","locale":false}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["2.0.0"],"block_files":[],"assets_screenshots":[],"screenshots":{"1":"The Responsive panel in the block inspector with \"Hide on mobile\" and \"Hide on desktop\" toggle controls","2":"Visual indicators in the editor showing which blocks are hidden on mobile (black outline) and desktop (blue outline)"},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[1220,148076,1244,841,606],"plugin_category":[],"plugin_contributors":[181167],"plugin_business_model":[],"class_list":["post-283027","plugin","type-plugin","status-publish","hentry","plugin_tags-block","plugin_tags-gutenberg","plugin_tags-hide","plugin_tags-mobile","plugin_tags-responsive","plugin_contributors-triopsi","plugin_committers-triopsi"],"banners":{"banner":"https:\/\/ps.w.org\/triopsi-block-visibility\/assets\/banner-772x250.png?rev=3470372","banner_2x":"https:\/\/ps.w.org\/triopsi-block-visibility\/assets\/banner-1544x500.png?rev=3470372","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/triopsi-block-visibility\/assets\/icon-128x128.png?rev=3470372","icon_2x":"https:\/\/ps.w.org\/triopsi-block-visibility\/assets\/icon-256x256.png?rev=3470372","generated":false},"screenshots":[],"raw_content":"<!--section=description-->\n<p>Triopsi Block Visibility extends the WordPress block editor (Gutenberg) by adding responsive visibility controls to every block's settings sidebar. Control which blocks appear on mobile devices, desktop devices, or both.<\/p>\n\n<p><strong>Key Features:<\/strong><\/p>\n\n<ul>\n<li><strong>Hide on Mobile<\/strong> - Hide blocks on screens smaller than 768px<\/li>\n<li><strong>Hide on Desktop<\/strong> - Hide blocks on screens larger than 768px<\/li>\n<li><strong>Works with all Blocks<\/strong> - Compatible with core blocks and third-party blocks<\/li>\n<li><strong>Visual Indicators<\/strong> - See which blocks are hidden directly in the editor<\/li>\n<li><strong>No Configuration<\/strong> - Install, activate, and start using immediately<\/li>\n<li><strong>Simple Toggle Controls<\/strong> - Easy-to-use switches in the block inspector<\/li>\n<li><strong>CSS-Based<\/strong> - Lightweight solution using CSS classes<\/li>\n<\/ul>\n\n<p>Perfect for creating responsive designs where certain content should only appear on specific devices. For example, show a detailed table only on desktop while displaying a simplified version on mobile.<\/p>\n\n<p>Both options can be used simultaneously if needed (useful for draft content or A\/B testing).<\/p>\n\n<!--section=installation-->\n<h4>Automatic Installation<\/h4>\n\n<ol>\n<li>Log in to your WordPress admin panel<\/li>\n<li>Navigate to Plugins &gt; Add New<\/li>\n<li>Search for \"Triopsi Block Visibility\"<\/li>\n<li>Click \"Install Now\" and then \"Activate\"<\/li>\n<\/ol>\n\n<p>* <strong>Center on Mobile<\/strong> - Center blocks on screens smaller than 768px<\/p>\n\n<h4>Manual Installation<\/h4>\n\n<ol>\n<li>Download the plugin files<\/li>\n<li>Upload the <code>triopsi-block-visibility<\/code> folder to the <code>\/wp-content\/plugins\/<\/code> directory<\/li>\n<li>Activate the plugin through the 'Plugins' screen in WordPress<\/li>\n<\/ol>\n\n<h4>After Activation<\/h4>\n\n<ol>\n<li>Edit any post or page with the block editor (Gutenberg)<\/li>\n<li>Select any block<\/li>\n<li>Look for the \"Responsive\" panel in the right sidebar (Block settings)<\/li>\n<li>Toggle \"Hide on mobile\" or \"Hide on desktop\" as needed<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20this%20work%20with%20all%20blocks%3F\"><h3>Does this work with all blocks?<\/h3><\/dt>\n<dd><p>Yes! The plugin adds the responsive controls to all Gutenberg blocks, including core blocks (like Paragraph, Image, Heading) and third-party blocks from other plugins.<\/p><\/dd>\n<dt id=\"what%20is%20the%20breakpoint%20for%20mobile%20vs%20desktop%3F\"><h3>What is the breakpoint for mobile vs desktop?<\/h3><\/dt>\n<dd><p>The plugin uses 768px as the breakpoint:\n* Mobile: max-width 768px\n* Desktop: min-width 769px<\/p><\/dd>\n<dt id=\"can%20i%20use%20both%20options%20at%20the%20same%20time%3F\"><h3>Can I use both options at the same time?<\/h3><\/dt>\n<dd><p>Yes, you can enable both \"Hide on mobile\" and \"Hide on desktop\" simultaneously. This is useful for draft content that you want to temporarily hide everywhere, or for A\/B testing purposes.<\/p><\/dd>\n<dt id=\"will%20this%20affect%20my%20page%20performance%3F\"><h3>Will this affect my page performance?<\/h3><\/dt>\n<dd><p>The plugin is very lightweight and uses only CSS to hide blocks. There is no JavaScript overhead on the frontend, so performance impact is minimal.<\/p><\/dd>\n<dt id=\"can%20i%20see%20which%20blocks%20are%20hidden%20in%20the%20editor%3F\"><h3>Can I see which blocks are hidden in the editor?<\/h3><\/dt>\n<dd><p>Yes! Blocks with visibility settings show visual indicators in the editor:\n* \"Hide on mobile\" - black dashed outline with label\n* \"Hide on desktop\" - blue dashed outline with label\n* Both enabled - purple dashed outline with combined label<\/p><\/dd>\n<dt id=\"does%20this%20plugin%20create%20custom%20blocks%3F\"><h3>Does this plugin create custom blocks?<\/h3><\/dt>\n<dd><p>No, this plugin doesn't create any new blocks. It adds functionality to existing blocks by extending the block inspector with responsive visibility controls.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>0.1.0<\/h4>\n\n<ul>\n<li>Initial release<\/li>\n<li>Hide blocks on mobile devices (max-width: 768px)<\/li>\n<li>Hide blocks on desktop devices (min-width: 769px)<\/li>\n<li>Visual indicators in the editor<\/li>\n<li>Works with all Gutenberg blocks<\/li>\n<li>i18n ready for translations<\/li>\n<\/ul>\n\n<h4>1.1.0<\/h4>\n\n<ul>\n<li>Added option to register a plugin-wide toggle for enabling\/disabling the responsive controls.<\/li>\n<li>Accessibility improvements for toggle controls in the block inspector.<\/li>\n<li>Fixed editor outline color regression and label overlap in tight editor layouts.<\/li>\n<li>Reduced CSS specificity to play nicer with theme styles.<\/li>\n<li>Added \"Center on Mobile\" option to center blocks on screens smaller than 768px.<\/li>\n<li>Improved editor visual indicators and labels for better clarity.<\/li>\n<li>Fixed duplicate CSS class issue when toggling visibility repeatedly.<\/li>\n<li>Improved sanitization and escaping for saved block attributes.<\/li>\n<li>Compatibility fixes for PHP 8.0+ and WordPress 6.8.<\/li>\n<li>Minor performance and CSS optimizations.<\/li>\n<li>Polished inspector UI and accessibility (ARIA labels).<\/li>\n<li>Persist block visibility classes server-side to ensure frontend\/backward compatibility.<\/li>\n<li>Ensured compatibility with a wide range of third-party blocks.<\/li>\n<li>Added translations scaffolding and updated textdomain usage.<\/li>\n<\/ul>\n\n<h4>1.1.1<\/h4>\n\n<ul>\n<li>Update Readme. Ready for WordPress Plugin review<\/li>\n<\/ul>\n\n<h4>1.1.2<\/h4>\n\n<ul>\n<li>Fix delete unlesed files<\/li>\n<\/ul>\n\n<h4>1.1.3<\/h4>\n\n<ul>\n<li>Fix via plugin checker<\/li>\n<\/ul>\n\n<h4>2.0.0<\/h4>\n\n<ul>\n<li>Change name and slug<\/li>\n<\/ul>","raw_excerpt":"Control block visibility on mobile and desktop devices with simple toggle controls in the Gutenberg editor.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/283027","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=283027"}],"author":[{"embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/triopsi"}],"wp:attachment":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=283027"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=283027"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=283027"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=283027"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=283027"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=283027"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}