WordPress 菜单项添加图片上传选项字段

想要在WordPress菜单中添加图片上传功能,你可以使用自定义菜单项(Custom Menu Items)功能和 WordPress 提供的媒体上传功能。下面是一个示例代码:

1、首先,在你的主题的 functions.php 文件中添加以下代码:

// 注册菜单项类型为 "图片"
function register_menu_item_type_image() {
    $args = array(
        'label' => __( '图片', 'textdomain' ),
    );
    register_nav_menu_item_type( 'image', $args );
}
add_action( 'init', 'register_menu_item_type_image' );
 
// 显示菜单项类型为 "图片" 的字段
function add_menu_item_fields_image( $item_id, $item, $depth, $args ) {
    if ( $item->type == 'image' ) {
        $image_url = get_post_meta( $item_id, '_menu_item_image_url', true );
        ?>
        

在菜单编辑器中创建一个自定义链接,并将链接类型设置为 "图片"。然后,你将能够看到一个名为 "图片选择" 的字段和一个 "上传图片" 按钮。

点击 "上传图片" 按钮,将弹出一个媒体上传框,在那里你可以上传或选择一张图片。选择了图片后,它将显示在字段下方的图片预览区域,并且图片的 URL 将被保存到隐藏字段中。

请注意,这只是一个简单的示例代码,你可以根据自己的需求和设计来扩展和美化菜单项的图片上传功能。

要在前端调用 WordPress 菜单中上传的图片,你可以使用以下方法:

获取菜单项的图片 URL:在你的主题文件中,你可以使用 get_post_meta() 函数来获取菜单项的图片 URL。

$menu_item_id = 1; // 替换为你菜单项的 ID
$image_url = get_post_meta( $menu_item_id, '_menu_item_image_url', true );

在需要显示图片的位置使用 标签:使用获取到的菜单项图片 URL,你可以将它应用于 HTML 标签的 src 属性,以在前端显示图片。

菜单项图片

将上述代码嵌入到你希望显示图片的地方,确保将 $menu_item_id 替换为相应的菜单项 ID。这样就能够在前端页面上显示菜单项上传的图片了。

你可能感兴趣的:(WordPress,WordPress,WordPress菜单,WordPress教程,WordPress主题,wordpress菜单添加图片,wordpress菜单添加图标,wordpress菜单图标)