# customize-direct-manipulation

**Repository Path**: mirrors_Automattic/customize-direct-manipulation

## Basic Information

- **Project Name**: customize-direct-manipulation
- **Description**: Click-to-edit in the WordPress Customizer
- **Primary Language**: Unknown
- **License**: GPL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-08
- **Last Updated**: 2026-06-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

A WordPress plugin that adds small icons to the customizer preview that open the respective section in the sidebar.

![Demo](https://cldup.com/MvlYi8umPJ.gif)

# Installation

1. Visit the [Releases page](https://github.com/Automattic/customize-direct-manipulation/releases) and download the latest release (not the source code).
2. Navigate to Plugins → Add New in your WordPress site's admin area and click the "Upload Plugin" button at the top in order to upload the ZIP file. If this button doesn't exist due to file permissions, you can [install it manually](https://codex.wordpress.org/Managing_Plugins#Manual_Plugin_Installation).
3. Activate the plugin, either from the page that shows up after uploading the ZIP file or from your plugins list if you uploaded the plugin manually.
4. Navigate to Appearance → Customize from your WordPress menu.
5. Click the small icons to activate the appropriate controls in the sidebar.

![Customizer with CDM active](https://cldup.com/aJXdAxaVNE.png)

# Contributing

1. Clone this repo and install it on a WordPress site. You can clone the repo directly into your `/wp-content/plugins` directory.
2. After cloning, run `npm install` and then `npm run dist` to compile the JavaScript.
3. To start a watcher process for development, run `npm start`.
4. If you want to see detailed info in your browser console, enable debugging by running the following command in the console and then reloading the page: `localStorage.setItem('debug', 'cdm:*');`.

# Testing

Run `npm install` and then `npm test` to run the test suite.

[![Circle CI](https://circleci.com/gh/Automattic/customize-direct-manipulation.svg?style=svg)](https://circleci.com/gh/Automattic/customize-direct-manipulation)