Title: Site Grayscale Toggle Author: natthasath Published: 2025년 11월 11일 Last modified: 2025년 11월 11일 --- 플러그인 검색 ![](https://ps.w.org/site-grayscale-toggle/assets/banner-772x250.png?rev=3393335) 이 플러그인은 **최근 3개의 주요 워드프레스 출시와 시험 되지 않았습니다**. 워드프레스의 좀 더 최근 버전으로 이용할 때 더 이상 관리되지 않고 지원되지 않고 호환성 문제가 있을 수 있습니다. ![](https://ps.w.org/site-grayscale-toggle/assets/icon-256x256.png?rev=3393338) # Site Grayscale Toggle 작성자: [natthasath](https://profiles.wordpress.org/natthasath/) [다운로드](https://downloads.wordpress.org/plugin/site-grayscale-toggle.zip) * [세부사항](https://ko.wordpress.org/plugins/site-grayscale-toggle/#description) * [평가](https://ko.wordpress.org/plugins/site-grayscale-toggle/#reviews) * [설치](https://ko.wordpress.org/plugins/site-grayscale-toggle/#installation) * [개발](https://ko.wordpress.org/plugins/site-grayscale-toggle/#developers) [지원](https://wordpress.org/support/plugin/site-grayscale-toggle/) ## 설명 **Site Grayscale Toggle** lets you turn your entire site grayscale and give visitors a clear on/off switch. It’s built to be **CSP-friendly (no inline JS)** and to avoid a flash-of-unstyled-content by injecting the initial state on the server side. **Features:** – **Grayscale filter site-wide** via `html.is-grayscale { filter: grayscale(var(--sgt-level)); }`. – **Intensity control (0–100)** from Settings Site Grayscale. – **Show/Hide floating toggle button** (bottom-right by default).–** Shortcode**: `[grayscale_toggle]` to place the switch anywhere (headers, menus, footers, blocks, widgets). – **Remembers visitor preference** with `localStorage` across pages. – **CSP-safe**: no inline JS; initial state added server-side to ` ` to avoid FOUC. – Lightweight, theme-agnostic; works alongside most caching/ CDN plugins. Use cases include memorial/monochrome modes, accessibility preferences, or design experiments that you want users to control. ## 설치 1. Upload the plugin ZIP via **Plugins Add New Upload Plugin** and click **Activate**. 2. Go to **Settings Site Grayscale** and configure: 3. * **Enable grayscale by default** * **Grayscale intensity (0–100)** * **Show floating toggle button** 4. (Optional) Place the toggle anywhere with the shortcode: `[grayscale_toggle]` You can customize labels/classes: `[grayscale_toggle label_on="Grayscale: ON" label_off ="Grayscale: OFF" class="my-btn"]` ## FAQ ### Why did enabling grayscale not change my site? Check two things: 1) **Intensity** isn’t set to `0` (go to Settings Site Grayscale set to `100` to test). 2) **Visitor preference** may be stored as `off`. Clear it in the browser console: `js localStorage.removeItem('sgt_pref'); location.reload(); ### Does it work under strict Content-Security-Policy (CSP)? Yes. v1.1.1 removes inline JS and injects the initial class/attributes server-side, so CSP rules that block inline scripts won’t prevent grayscale from applying. ### How do I hide the floating button and use only the shortcode? Uncheck **Show floating toggle button** in Settings Site Grayscale, then place `[ grayscale_toggle]` where you want. ### Can I exclude some elements from being grayscaled? Yes, add CSS like this in your theme or a customizer: `css html.is-grayscale .no- gray { -webkit-filter: none !important; filter: none !important; } Then add the class no-gray to elements you want to keep in color. ### Will it conflict with caching/CDN plugins? Generally no. If you don’t see changes, clear/purge caches and your CDN. ### Is there WP-CLI support? You can manage options via WP-CLI: `bash wp option update sgt_default_on 1 wp option update sgt_intensity 100 wp option update sgt_show_button 1 ## 후기 이 플러그인에 대한 평가가 없습니다. ## 기여자 & 개발자 “Site Grayscale Toggle”(은)는 오픈 소스 소프트웨어입니다. 다음의 사람들이 이 플러그인에 기여하였습니다. 기여자 * [ natthasath ](https://profiles.wordpress.org/natthasath/) [자국어로 “Site Grayscale Toggle”(을)를 번역하세요.](https://translate.wordpress.org/projects/wp-plugins/site-grayscale-toggle) ### 개발에 관심이 있으십니까? [코드 탐색하기](https://plugins.trac.wordpress.org/browser/site-grayscale-toggle/) 는, [SVN 저장소](https://plugins.svn.wordpress.org/site-grayscale-toggle/)를 확인하시거나, [개발 기록](https://plugins.trac.wordpress.org/log/site-grayscale-toggle/)을 [RSS](https://plugins.trac.wordpress.org/log/site-grayscale-toggle/?limit=100&mode=stop_on_copy&format=rss) 로 구독하세요. ## 변경이력 #### 1.1.1 * **CSP-safe:** removed inline JS and moved bootstrap to server-side attribute/ class injection. * Preserved intensity (0–100), show/hide floating button, and shortcode features. #### 1.1.0 * Added intensity control (0–100). * Added show/hide floating toggle button setting. #### 1.0.0 * Initial release with grayscale and front-end toggle button + shortcode. ## 기초 * 버전 **1.1.1** * 최근 업데이트: **10개월 전** * 활성화된 설치 **10+** * 다음까지 시험됨: **6.8.8** * 언어 * [English (US)](https://wordpress.org/plugins/site-grayscale-toggle/) * 태그: * [accessibility](https://ko.wordpress.org/plugins/tags/accessibility/)[filter](https://ko.wordpress.org/plugins/tags/filter/) [grayscale](https://ko.wordpress.org/plugins/tags/grayscale/)[toggle](https://ko.wordpress.org/plugins/tags/toggle/) [ui](https://ko.wordpress.org/plugins/tags/ui/) * [고급 보기](https://ko.wordpress.org/plugins/site-grayscale-toggle/advanced/) ## 평점 아직 제출된 리뷰가 없습니다. [Your review](https://wordpress.org/support/plugin/site-grayscale-toggle/reviews/#new-post) [모든 리뷰 보기](https://wordpress.org/support/plugin/site-grayscale-toggle/reviews/) ## 기여자 * [ natthasath ](https://profiles.wordpress.org/natthasath/) ## 지원 할 말 있으신가요? 도움이 필요하신가요? [지원 포럼 보기](https://wordpress.org/support/plugin/site-grayscale-toggle/)