Custom Menu vg-origon (ok)
// Bước 1:
class rc_sweet_custom_menu {
function __construct() {
// add custom menu fields to menu
add_filter('wp_setup_nav_menu_item', array($this, 'rc_scm_add_custom_nav_fields'));
// save menu custom fields
add_action('wp_update_nav_menu_item', array($this, 'rc_scm_update_custom_nav_fields'), 10, 3);
// edit menu walker
add_filter('wp_edit_nav_menu_walker', array($this, 'rc_scm_edit_walker'), 10, 2);
}
function rc_scm_add_custom_nav_fields($menu_item) {
$menu_item->background_url = get_post_meta($menu_item->ID, '_menu_item_background_url', true);
return $menu_item;
}
function rc_scm_update_custom_nav_fields($menu_id, $menu_item_db_id, $args) {
if(!empty($_REQUEST['menu-item-background_url'])) {
$background_url_value = $_REQUEST['menu-item-background_url'][$menu_item_db_id];
update_post_meta($menu_item_db_id, '_menu_item_background_url', $background_url_value);
}
}
function rc_scm_edit_walker($walker,$menu_id) {
return 'Walker_Nav_Menu_Edit_Custom';
}
}
$GLOBALS['sweet_custom_menu'] = new rc_sweet_custom_menu();
// Bước 2:
class Walker_Nav_Menu_Edit_Custom extends Walker_Nav_Menu {
function start_lvl(&$output, $depth = 0, $args = array()) {
}
function end_lvl(&$output, $depth = 0, $args = array()) {
}
function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
global $_wp_nav_menu_max_depth;
$_wp_nav_menu_max_depth = $depth > $_wp_nav_menu_max_depth ? $depth : $_wp_nav_menu_max_depth;
$indent = ($depth) ? str_repeat("\t", $depth) : '';
ob_start();
$item_id = esc_attr($item->ID);
$removed_args = array(
'action',
'customlink-tab',
'edit-menu-item',
'menu-item',
'page-tab',
'_wpnonce',
);
$original_title = '';
if('taxonomy' == $item->type) {
$original_title = get_term_field('name', $item->object_id, $item->object, 'raw');
if(is_wp_error($original_title))
$original_title = false;
} elseif('post_type' == $item->type) {
$original_object = get_post($item->object_id);
$original_title = $original_object->post_title;
}
$classes = array(
'menu-item menu-item-depth-' . $depth,
'menu-item-' . esc_attr($item->object),
'menu-item-edit-' .((isset($_GET['edit-menu-item']) && $item_id == $_GET['edit-menu-item']) ? 'active' : 'inactive'),
);
$title = $item->title;
if(! empty($item->_invalid)) {
$classes[] = 'menu-item-invalid';
/* translators: %s: title of menu item which is invalid */
$title = sprintf(__('%s(Invalid)', 'vg-oregon'), $item->title);
} elseif(isset($item->post_status) && 'draft' == $item->post_status) {
$classes[] = 'pending';
/* translators: %s: title of menu item in draft status */
$title = sprintf(__('%s(Pending)', 'vg-oregon'), $item->title);
}
$title = empty($item->label) ? $title : $item->label;
?>
<li id="menu-item-<?php echo esc_attr($item_id); ?>" class="<?php echo implode(' ', $classes); ?>">
<dl class="menu-item-bar">
<dt class="menu-item-handle">
<span class="item-title"><?php echo esc_html($title); ?></span>
<span class="item-controls">
<span class="item-type"><?php echo esc_html($item->type_label); ?></span>
<span class="item-order hide-if-js">
<a href="<?php
echo wp_nonce_url(
add_query_arg(
array(
'action' => 'move-up-menu-item',
'menu-item' => $item_id,
),
remove_query_arg($removed_args, admin_url('nav-menus.php'))
),
'move-menu_item'
);
?>" class="item-move-up"><abbr title="<?php esc_attr_e('Move up', 'vg-oregon'); ?>">↑</abbr></a>
|
<a href="<?php
echo wp_nonce_url(
add_query_arg(
array(
'action' => 'move-down-menu-item',
'menu-item' => $item_id,
),
remove_query_arg($removed_args, admin_url('nav-menus.php'))
),
'move-menu_item'
);
?>" class="item-move-down"><abbr title="<?php esc_attr_e('Move down', 'vg-oregon'); ?>">↓</abbr></a>
</span>
<a class="item-edit" id="edit-<?php echo esc_attr($item_id); ?>" title="<?php esc_attr_e('Edit Menu Item', 'vg-oregon'); ?>" href="<?php
echo(isset($_GET['edit-menu-item']) && $item_id == $_GET['edit-menu-item']) ? admin_url('nav-menus.php') : add_query_arg('edit-menu-item', $item_id, remove_query_arg($removed_args, admin_url('nav-menus.php#menu-item-settings-' . $item_id)));
?>"><?php esc_html_e('Edit Menu Item', 'vg-oregon'); ?></a>
</span>
</dt>
</dl>
<div class="menu-item-settings" id="menu-item-settings-<?php echo esc_attr($item_id); ?>">
<?php if('custom' == $item->type) : ?>
<p class="field-url description description-wide">
<label for="edit-menu-item-url-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('URL', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-url-<?php echo esc_attr($item_id); ?>" class="widefat code edit-menu-item-url" name="menu-item-url[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->url); ?>" />
</label>
</p>
<?php endif; ?>
<p class="description description-thin">
<label for="edit-menu-item-title-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('Navigation Label', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-title-<?php echo esc_attr($item_id); ?>" class="widefat edit-menu-item-title" name="menu-item-title[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->title); ?>" />
</label>
</p>
<p class="description description-thin">
<label for="edit-menu-item-attr-title-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('Title Attribute', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-attr-title-<?php echo esc_attr($item_id); ?>" class="widefat edit-menu-item-attr-title" name="menu-item-attr-title[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->post_excerpt); ?>" />
</label>
</p>
<p class="field-link-target description">
<label for="edit-menu-item-target-<?php echo esc_attr($item_id); ?>">
<input type="checkbox" id="edit-menu-item-target-<?php echo esc_attr($item_id); ?>" value="_blank" name="menu-item-target[<?php echo esc_attr($item_id); ?>]"<?php checked($item->target, '_blank'); ?> />
<?php esc_html_e('Open link in a new window/tab', 'vg-oregon'); ?>
</label>
</p>
<p class="field-css-classes description description-thin">
<label for="edit-menu-item-classes-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('CSS Classes(optional)', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-classes-<?php echo esc_attr($item_id); ?>" class="widefat code edit-menu-item-classes" name="menu-item-classes[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr(implode(' ', $item->classes)); ?>" />
</label>
</p>
<p class="field-xfn description description-thin">
<label for="edit-menu-item-xfn-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('Link Relationship(XFN)', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-xfn-<?php echo esc_attr($item_id); ?>" class="widefat code edit-menu-item-xfn" name="menu-item-xfn[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->xfn); ?>" />
</label>
</p>
<p class="field-description description description-wide">
<label for="edit-menu-item-description-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('Description', 'vg-oregon'); ?><br />
<textarea id="edit-menu-item-description-<?php echo esc_attr($item_id); ?>" class="widefat edit-menu-item-description" rows="3" cols="20" name="menu-item-description[<?php echo esc_attr($item_id); ?>]"><?php echo esc_html($item->description); // textarea_escaped ?></textarea>
<span class="description"><?php esc_html_e('The description will be displayed in the menu if the current theme supports it.', 'vg-oregon'); ?></span>
</label>
</p>
<?php
/* New fields insertion starts here */
?>
<p class="field-background-url description description-wide">
<label for="edit-menu-item-background_url-<?php echo esc_attr($item_id); ?>">
<?php esc_html_e('Background URL', 'vg-oregon'); ?><br />
<input type="text" id="edit-menu-item-background_url-<?php echo esc_attr($item_id); ?>" class="widefat code edit-menu-item-custom" name="menu-item-background_url[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->background_url); ?>" />
</label>
</p>
<?php
/* New fields insertion ends here */
?>
<div class="menu-item-actions description-wide submitbox">
<?php if('custom' != $item->type && $original_title !== false) : ?>
<p class="link-to-original">
<?php printf(__('Original: %s', 'vg-oregon'), '<a href="' . esc_attr($item->url) . '">' . esc_html($original_title) . '</a>'); ?>
</p>
<?php endif; ?>
<a class="item-delete submitdelete deletion" id="delete-<?php echo esc_attr($item_id); ?>" href="<?php
echo wp_nonce_url(
add_query_arg(
array(
'action' => 'delete-menu-item',
'menu-item' => $item_id,
),
remove_query_arg($removed_args, admin_url('nav-menus.php'))
),
'delete-menu_item_' . $item_id
); ?>"><?php esc_html_e('Remove', 'vg-oregon'); ?></a> <span class="meta-sep"> | </span> <a class="item-cancel submitcancel" id="cancel-<?php echo esc_attr($item_id); ?>" href="<?php echo esc_url(add_query_arg(array('edit-menu-item' => $item_id, 'cancel' => time()), remove_query_arg($removed_args, admin_url('nav-menus.php'))));
?>#menu-item-settings-<?php echo esc_attr($item_id); ?>"><?php esc_html_e('Cancel', 'vg-oregon'); ?></a>
</div>
<div style="clear: both;"></div>
<input class="menu-item-data-db-id" type="hidden" name="menu-item-db-id[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item_id); ?>" />
<input class="menu-item-data-object-id" type="hidden" name="menu-item-object-id[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->object_id); ?>" />
<input class="menu-item-data-object" type="hidden" name="menu-item-object[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->object); ?>" />
<input class="menu-item-data-parent-id" type="hidden" name="menu-item-parent-id[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->menu_item_parent); ?>" />
<input class="menu-item-data-position" type="hidden" name="menu-item-position[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->menu_order); ?>" />
<input class="menu-item-data-type" type="hidden" name="menu-item-type[<?php echo esc_attr($item_id); ?>]" value="<?php echo esc_attr($item->type); ?>" />
</div><!-- .menu-item-settings-->
<ul class="menu-item-transport"></ul>
<?php
$output .= ob_get_clean();
}
}
// Bước 3:
class rc_scm_walker extends Walker_Nav_Menu
{
function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0)
{
global $wp_query;
$indent = ($depth) ? str_repeat("\t", $depth) : '';
$class_names = $value = '';
$classes = empty($item->classes) ? array() :(array) $item->classes;
$class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item));
$class_names = ' class="'. esc_attr($class_names) . '"';
if($args->background_url != "") {
$img = $args->background_url;
} else {
$img = "";
}
$output .= $indent . '<li id="vg-oregon-menu-item-'. $item->ID . '"' . $value . $class_names.'>';
$attributes = ! empty($item->attr_title) ? ' title="' . esc_attr($item->attr_title) .'"' : '';
$attributes .= ! empty($item->target) ? ' target="' . esc_attr($item->target ) .'"' : '';
$attributes .= ! empty($item->xfn) ? ' rel="' . esc_attr($item->xfn ) .'"' : '';
$attributes .= ! empty($item->url) ? ' href="' . esc_attr($item->url ) .'"' : '';
$prepend = '';
$append = '';
if($depth != 0)
{
$description = $append = $prepend = "";
}
$item_output = $args->before;
if($img !="") {
$output .= '<img class ="'.$class_names.'" src="'.$img.'" alt="Lionel Phạm">';
}
$item_output .= '<a'. $attributes .'>';
$item_output .= $args->link_before .$prepend.apply_filters('the_title', $item->title, $item->ID).$append;
$item_output .= '</a>';
$item_output .= $args->after;
$output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
apply_filters('walker_nav_menu_start_lvl', $item_output, $depth, $args->background_url = $item->background_url);
}
}PreviousHướng dẫn tạo button add sản phẩm đến danh sách wishlist (ok)NextLam menu có background (ok)
Last updated