WordPress.org

Make WordPress Core


Ignore:
Timestamp:
06/16/2015 10:07:08 PM (6 years ago)
Author:
ocean90
Message:

Add menu management to the Customizer.

This brings in the Menu Customizer plugin: https://wordpress.org/plugins/menu-customizer/.

props celloexpressions, westonruter, valendesigns, voldemortensen, ocean90, adamsilverstein, kucrut, jorbin, designsimply, afercia, davidakennedy, obenland.
see #32576.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/class-wp-customize-control.php

    r32657 r32806  
    14031403    }
    14041404}
     1405
     1406/**
     1407 * Customize Nav Menus Panel Class
     1408 *
     1409 * Needed to add screen options.
     1410 *
     1411 * @since 4.3.0
     1412 */
     1413class WP_Customize_Nav_Menus_Panel extends WP_Customize_Panel {
     1414
     1415    /**
     1416     * Control type.
     1417     *
     1418     * @since 4.3.0
     1419     *
     1420     * @access public
     1421     * @var string
     1422     */
     1423    public $type = 'nav_menus';
     1424
     1425    /**
     1426     * Render screen options for Menus.
     1427     *
     1428     * @since 4.3.0
     1429     */
     1430    public function render_screen_options() {
     1431        // Essentially adds the screen options.
     1432        add_filter( 'manage_nav-menus_columns', array( $this, 'wp_nav_menu_manage_columns' ) );
     1433
     1434        // Display screen options.
     1435        $screen = WP_Screen::get( 'nav-menus.php' );
     1436        $screen->render_screen_options();
     1437    }
     1438
     1439    /**
     1440     * Returns the advanced options for the nav menus page.
     1441     *
     1442     * Link title attribute added as it's a relatively advanced concept for new users.
     1443     *
     1444     * @since 4.3.0
     1445     *
     1446     * @return array The advanced menu properties.
     1447     */
     1448    function wp_nav_menu_manage_columns() {
     1449        return array(
     1450            '_title'      => __( 'Show advanced menu properties' ),
     1451            'cb'          => '<input type="checkbox" />',
     1452            'link-target' => __( 'Link Target' ),
     1453            'attr-title'  => __( 'Title Attribute' ),
     1454            'css-classes' => __( 'CSS Classes' ),
     1455            'xfn'         => __( 'Link Relationship (XFN)' ),
     1456            'description' => __( 'Description' ),
     1457        );
     1458    }
     1459
     1460    /**
     1461     * An Underscore (JS) template for this panel's content (but not its container).
     1462     *
     1463     * Class variables for this panel class are available in the `data` JS object;
     1464     * export custom variables by overriding {@see WP_Customize_Panel::json()}.
     1465     *
     1466     * @since 4.3.0
     1467     *
     1468     * @see WP_Customize_Panel::print_template()
     1469     *
     1470     * @since 4.3.0
     1471     */
     1472    protected function content_template() {
     1473        ?>
     1474        <li class="panel-meta customize-info accordion-section <# if ( ! data.description ) { #> cannot-expand<# } #>">
     1475            <button type="button" class="customize-panel-back" tabindex="-1">
     1476                <span class="screen-reader-text"><?php _e( 'Back' ); ?></span>
     1477            </button>
     1478            <div class="accordion-section-title">
     1479                <span class="preview-notice">
     1480                    <?php
     1481                        /* translators: %s is the site/panel title in the Customizer */
     1482                        printf( __( 'You are customizing %s' ), '<strong class="panel-title">{{ data.title }}</strong>' );
     1483                    ?>
     1484                </span>
     1485                <button type="button" class="customize-screen-options-toggle" aria-expanded="false">
     1486                    <span class="screen-reader-text"><?php _e( 'Menu Options' ); ?></span>
     1487                </button>
     1488                <button type="button" class="customize-help-toggle dashicons dashicons-editor-help" aria-expanded="false">
     1489                    <span class="screen-reader-text"><?php _e( 'Help' ); ?></span>
     1490                </button>
     1491            </div>
     1492            <# if ( data.description ) { #>
     1493            <div class="description customize-panel-description">{{{ data.description }}}</div>
     1494            <# } #>
     1495            <?php $this->render_screen_options(); ?>
     1496        </li>
     1497        <?php
     1498    }
     1499}
     1500
     1501/**
     1502 * Customize Nav Menu Control Class
     1503 *
     1504 * @since 4.3.0
     1505 */
     1506class WP_Customize_Nav_Menu_Control extends WP_Customize_Control {
     1507
     1508    /**
     1509     * Control type.
     1510     *
     1511     * @since 4.3.0
     1512     *
     1513     * @access public
     1514     * @var string
     1515     */
     1516    public $type = 'nav_menu';
     1517
     1518    /**
     1519     * The nav menu setting.
     1520     *
     1521     * @since 4.3.0
     1522     *
     1523     * @var WP_Customize_Nav_Menu_Setting
     1524     */
     1525    public $setting;
     1526
     1527    /**
     1528     * Don't render the control's content - it uses a JS template instead.
     1529     *
     1530     * @since 4.3.0
     1531     */
     1532    public function render_content() {}
     1533
     1534    /**
     1535     * JS/Underscore template for the control UI.
     1536     *
     1537     * @since 4.3.0
     1538     */
     1539    public function content_template() {
     1540        ?>
     1541        <button type="button" class="button-secondary add-new-menu-item">
     1542            <?php _e( 'Add Items' ); ?>
     1543        </button>
     1544        <button type="button" class="not-a-button reorder-toggle">
     1545            <span class="reorder"><?php _ex( 'Reorder', 'Reorder menu items in Customizer' ); ?></span>
     1546            <span class="reorder-done"><?php _ex( 'Done', 'Cancel reordering menu items in Customizer' ); ?></span>
     1547        </button>
     1548        <span class="add-menu-item-loading spinner"></span>
     1549        <span class="menu-delete-item">
     1550            <button type="button" class="not-a-button menu-delete">
     1551                <?php _e( 'Delete menu' ); ?> <span class="screen-reader-text">{{ data.menu_name }}</span>
     1552            </button>
     1553        </span>
     1554        <?php if ( current_theme_supports( 'menus' ) ) : ?>
     1555        <ul class="menu-settings">
     1556            <li class="customize-control">
     1557                <span class="customize-control-title"><?php _e( 'Menu locations' ); ?></span>
     1558            </li>
     1559
     1560            <?php foreach ( get_registered_nav_menus() as $location => $description ) : ?>
     1561            <li class="customize-control customize-control-checkbox assigned-menu-location">
     1562                <label>
     1563                    <input type="checkbox" data-menu-id="{{ data.menu_id }}" data-location-id="<?php echo esc_attr( $location ); ?>" class="menu-location" /> <?php echo $description; ?>
     1564                    <span class="theme-location-set"><?php printf( _x( '(Current: %s)', 'Current menu location' ), '<span class="current-menu-location-name-' . esc_attr( $location ) . '"></span>' ); ?></span>
     1565                </label>
     1566            </li>
     1567            <?php endforeach; ?>
     1568
     1569        </ul>
     1570        <?php endif; ?>
     1571        <p>
     1572            <label>
     1573                <input type="checkbox" class="auto_add">
     1574                <?php _e( 'Automatically add new top-level pages to this menu.' ) ?>
     1575            </label>
     1576        </p>
     1577        <?php
     1578    }
     1579
     1580    /**
     1581     * Return params for this control.
     1582     *
     1583     * @since 4.3.0
     1584     *
     1585     * @return array
     1586     */
     1587    function json() {
     1588        $exported            = parent::json();
     1589        $exported['menu_id'] = $this->setting->term_id;
     1590
     1591        return $exported;
     1592    }
     1593}
     1594
     1595/**
     1596 * Customize control to represent the name field for a given menu.
     1597 *
     1598 * @since 4.3.0
     1599 */
     1600class WP_Customize_Nav_Menu_Item_Control extends WP_Customize_Control {
     1601
     1602    /**
     1603     * Control type.
     1604     *
     1605     * @since 4.3.0
     1606     *
     1607     * @access public
     1608     * @var string
     1609     */
     1610    public $type = 'nav_menu_item';
     1611
     1612    /**
     1613     * The nav menu item setting.
     1614     *
     1615     * @since 4.3.0
     1616     *
     1617     * @var WP_Customize_Nav_Menu_Item_Setting
     1618     */
     1619    public $setting;
     1620
     1621    /**
     1622     * Constructor.
     1623     *
     1624     * @since 4.3.0
     1625     *
     1626     * @uses WP_Customize_Control::__construct()
     1627     *
     1628     * @param WP_Customize_Manager $manager An instance of the WP_Customize_Manager class.
     1629     * @param string               $id      The control ID.
     1630     * @param array                $args    Optional. Overrides class property defaults.
     1631     */
     1632    public function __construct( $manager, $id, $args = array() ) {
     1633        parent::__construct( $manager, $id, $args );
     1634    }
     1635
     1636    /**
     1637     * Don't render the control's content - it's rendered with a JS template.
     1638     *
     1639     * @since 4.3.0
     1640     */
     1641    public function render_content() {}
     1642
     1643    /**
     1644     * JS/Underscore template for the control UI.
     1645     *
     1646     * @since 4.3.0
     1647     */
     1648    public function content_template() {
     1649        ?>
     1650        <dl class="menu-item-bar">
     1651            <dt class="menu-item-handle">
     1652                <span class="item-type">{{ data.item_type_label }}</span>
     1653                <span class="item-title">
     1654                    <span class="spinner"></span>
     1655                    <span class="menu-item-title">{{ data.title }}</span>
     1656                </span>
     1657                <span class="item-controls">
     1658                    <button type="button" class="not-a-button item-edit"><span class="screen-reader-text"><?php _e( 'Edit Menu Item' ); ?></span></button>
     1659                    <button type="button" class="not-a-button item-delete submitdelete deletion"><span class="screen-reader-text"><?php _e( 'Remove Menu Item' ); ?></span></button>
     1660                </span>
     1661            </dt>
     1662        </dl>
     1663
     1664        <div class="menu-item-settings" id="menu-item-settings-{{ data.menu_item_id }}">
     1665            <# if ( 'custom' === data.item_type ) { #>
     1666            <p class="field-url description description-thin">
     1667                <label for="edit-menu-item-url-{{ data.menu_item_id }}">
     1668                    <?php _e( 'URL' ); ?><br />
     1669                    <input class="widefat code edit-menu-item-url" type="text" id="edit-menu-item-url-{{ data.menu_item_id }}" name="menu-item-url" />
     1670                </label>
     1671            </p>
     1672        <# } #>
     1673            <p class="description description-thin">
     1674                <label for="edit-menu-item-title-{{ data.menu_item_id }}">
     1675                    <?php _e( 'Navigation Label' ); ?><br />
     1676                    <input type="text" id="edit-menu-item-title-{{ data.menu_item_id }}" class="widefat edit-menu-item-title" name="menu-item-title" />
     1677                </label>
     1678            </p>
     1679            <p class="field-link-target description description-thin">
     1680                <label for="edit-menu-item-target-{{ data.menu_item_id }}">
     1681                    <input type="checkbox" id="edit-menu-item-target-{{ data.menu_item_id }}" class="edit-menu-item-target" value="_blank" name="menu-item-target" />
     1682                    <?php _e( 'Open link in a new tab' ); ?>
     1683                </label>
     1684            </p>
     1685            <p class="field-attr-title description description-thin">
     1686                <label for="edit-menu-item-attr-title-{{ data.menu_item_id }}">
     1687                    <?php _e( 'Title Attribute' ); ?><br />
     1688                    <input type="text" id="edit-menu-item-attr-title-{{ data.menu_item_id }}" class="widefat edit-menu-item-attr-title" name="menu-item-attr-title" />
     1689                </label>
     1690            </p>
     1691            <p class="field-css-classes description description-thin">
     1692                <label for="edit-menu-item-classes-{{ data.menu_item_id }}">
     1693                    <?php _e( 'CSS Classes' ); ?><br />
     1694                    <input type="text" id="edit-menu-item-classes-{{ data.menu_item_id }}" class="widefat code edit-menu-item-classes" name="menu-item-classes" />
     1695                </label>
     1696            </p>
     1697            <p class="field-xfn description description-thin">
     1698                <label for="edit-menu-item-xfn-{{ data.menu_item_id }}">
     1699                    <?php _e( 'Link Relationship (XFN)' ); ?><br />
     1700                    <input type="text" id="edit-menu-item-xfn-{{ data.menu_item_id }}" class="widefat code edit-menu-item-xfn" name="menu-item-xfn" />
     1701                </label>
     1702            </p>
     1703            <p class="field-description description description-thin">
     1704                <label for="edit-menu-item-description-{{ data.menu_item_id }}">
     1705                    <?php _e( 'Description' ); ?><br />
     1706                    <textarea id="edit-menu-item-description-{{ data.menu_item_id }}" class="widefat edit-menu-item-description" rows="3" cols="20" name="menu-item-description">{{ data.description }}</textarea>
     1707                    <span class="description"><?php _e( 'The description will be displayed in the menu if the current theme supports it.' ); ?></span>
     1708                </label>
     1709            </p>
     1710
     1711            <div class="menu-item-actions description-thin submitbox">
     1712                <# if ( 'custom' != data.item_type && '' != data.original_title ) { #>
     1713                <p class="link-to-original">
     1714                    <?php printf( __( 'Original: %s' ), '<a class="original-link" href="{{ data.url }}">{{{ data.original_title }}}</a>' ); ?>
     1715                </p>
     1716                <# } #>
     1717
     1718                <button type="button" class="not-a-button item-delete submitdelete deletion"><?php _e( 'Remove' ); ?></button>
     1719                <span class="spinner"></span>
     1720            </div>
     1721            <input type="hidden" name="menu-item-db-id[{{ data.menu_item_id }}]" class="menu-item-data-db-id" value="{{ data.menu_item_id }}" />
     1722            <input type="hidden" name="menu-item-parent-id[{{ data.menu_item_id }}]" class="menu-item-data-parent-id" value="{{ data.parent }}" />
     1723        </div><!-- .menu-item-settings-->
     1724        <ul class="menu-item-transport"></ul>
     1725        <?php
     1726    }
     1727
     1728    /**
     1729     * Return params for this control.
     1730     *
     1731     * @since 4.3.0
     1732     *
     1733     * @return array
     1734     */
     1735    function json() {
     1736        $exported                 = parent::json();
     1737        $exported['menu_item_id'] = $this->setting->post_id;
     1738
     1739        return $exported;
     1740    }
     1741}
     1742
     1743/**
     1744 * Customize Menu Location Control Class
     1745 *
     1746 * This custom control is only needed for JS.
     1747 *
     1748 * @since 4.3.0
     1749 */
     1750class WP_Customize_Nav_Menu_Location_Control extends WP_Customize_Control {
     1751
     1752    /**
     1753     * Control type.
     1754     *
     1755     * @since 4.3.0
     1756     *
     1757     * @access public
     1758     * @var string
     1759     */
     1760    public $type = 'nav_menu_location';
     1761
     1762    /**
     1763     * Location ID.
     1764     *
     1765     * @since 4.3.0
     1766     *
     1767     * @access public
     1768     * @var string
     1769     */
     1770    public $location_id = '';
     1771
     1772    /**
     1773     * Refresh the parameters passed to JavaScript via JSON.
     1774     *
     1775     * @since 4.3.0
     1776     *
     1777     * @uses WP_Customize_Control::to_json()
     1778     */
     1779    public function to_json() {
     1780        parent::to_json();
     1781        $this->json['locationId'] = $this->location_id;
     1782    }
     1783
     1784    /**
     1785     * Render content just like a normal select control.
     1786     *
     1787     * @since 4.3.0
     1788     */
     1789    public function render_content() {
     1790        if ( empty( $this->choices ) ) {
     1791            return;
     1792        }
     1793        ?>
     1794        <label>
     1795            <?php if ( ! empty( $this->label ) ) : ?>
     1796            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
     1797            <?php endif; ?>
     1798
     1799            <?php if ( ! empty( $this->description ) ) : ?>
     1800            <span class="description customize-control-description"><?php echo $this->description; ?></span>
     1801            <?php endif; ?>
     1802
     1803            <select <?php $this->link(); ?>>
     1804                <?php
     1805                foreach ( $this->choices as $value => $label ) :
     1806                    echo '<option value="' . esc_attr( $value ) . '"' . selected( $this->value(), $value, false ) . '>' . $label . '</option>';
     1807                endforeach;
     1808                ?>
     1809            </select>
     1810        </label>
     1811        <?php
     1812    }
     1813}
     1814
     1815/**
     1816 * Customize control to represent the name field for a given menu.
     1817 *
     1818 * @since 4.3.0
     1819 */
     1820class WP_Customize_Nav_Menu_Name_Control extends WP_Customize_Control {
     1821
     1822    /**
     1823     * Type of control, used by JS.
     1824     *
     1825     * @since 4.3.0
     1826     *
     1827     * @var string
     1828     */
     1829    public $type = 'nav_menu_name';
     1830
     1831    /**
     1832     * No-op since we're using JS template.
     1833     *
     1834     * @since 4.3.0
     1835     */
     1836    protected function render_content() {}
     1837
     1838    /**
     1839     * Render the Underscore template for this control.
     1840     *
     1841     * @since 4.3.0
     1842     */
     1843    protected function content_template() {
     1844        ?>
     1845        <label>
     1846            <input type="text" class="menu-name-field live-update-section-title" />
     1847        </label>
     1848        <?php
     1849    }
     1850}
     1851
     1852/**
     1853 * Customize control class for new menus.
     1854 *
     1855 * @since 4.3.0
     1856 */
     1857class WP_New_Menu_Customize_Control extends WP_Customize_Control {
     1858
     1859    /**
     1860     * Control type.
     1861     *
     1862     * @since 4.3.0
     1863     *
     1864     * @access public
     1865     * @var string
     1866     */
     1867    public $type = 'new_menu';
     1868
     1869    /**
     1870     * Render the control's content.
     1871     *
     1872     * @since 4.3.0
     1873     */
     1874    public function render_content() {
     1875        ?>
     1876        <button type="button" class="button button-primary" id="create-new-menu-submit"><?php _e( 'Create Menu' ); ?></button>
     1877        <span class="spinner"></span>
     1878        <?php
     1879    }
     1880}
Note: See TracChangeset for help on using the changeset viewer.