在现有 wp 主题中生成单选按钮的代码

Question

朋友和邻居们晚上好，

我目前正在使用 MAMP v6.6 在我的本地自定义和构建 wordpress 主题 运行 macOS Monterey 12.2 的 2017 iMac（Retina ~ 27 英寸）

同时使用：

• Apache Netbeans 12.6
• MySQL 工作台 8.0
• Xdebug（一旦我弄清楚如何安装）

（不太清楚如何安装 PECL - 我在网上找到的行命令没有这样做 - 为了安装 Xdebug，但正在努力）

我在现有的高级 wordpress 主题（VEGA by themepunch）中添加了第三个“菜单布局”选项……。菜单中心，通过将一些 PHP 代码添加到“template-menu.php”、“functions.php”和“menu.lib.php”文件中，使菜单在徽标下方居中。

但是，这不会在“标题”选项卡下的“主题设置”面板（位于左侧列 Wordpress 仪表板菜单中）中为该选项生成单选按钮（请参阅参考 jpeg）

请参阅随附的参考图片以获取更多信息。

这是通过 wordpress 仪表板左侧菜单访问的“主题设置”中的 html 源代码：

<!---  html source code for ‘menu layouts’ in menu settings under header tab --->

<div class="rm_input rm_select">
    
    <label for="pp_menu_layout">Menu layouts</label>
        <br/>

    <div style="margin-top:5px;float:left;width:300px">
        
        <div style="float:left;margin:0 20px 20px 0">
            
        <input style="float:left;" id="pp_menu_layout" name="pp_menu_layout" type="radio"
        checked="checked"           value="1"/>
            
            <div style="float:left;width:90%;"><img src="http://localhost:8888/wordpress/wp-content/themes/vega/functions/images/menu1.png"/>
            </div>
            
        </div>
        
        <div style="float:left;margin:0 20px 20px 0">
            
        <input style="float:left;" id="pp_menu_layout" name="pp_menu_layout" type="radio"
                    value="2"/>
            
            <div style="float:left;width:90%;">
            
                <img src="http://localhost:8888/wordpress/wp-content/themes/vega/functions/images/menu2.png"/>
            
            </div>
        
        </div>
    
    <small></small>
    
    <div class="clearfix">
        
        </div>
    
    </div>
    
</div>

这可能是相当容易的事情，但是，如果有人可以就在什么文件中添加什么代码以生成我的第三个“菜单布局选项”的单选按钮提供一些指导或推测，那将不胜感激。

Answer 1

你好朋友和邻居，

通过仔细检查 VEGA 高级 wordpress 主题中的每个文件，我能够找出这个答案。当我打开 admin.lib.php 文件时，我意识到它与“主题设置”菜单面板直接相关。 所以我向下滚动直到我到达 PHP 代码的 MENU SETTINGS-->Menu Layouts 部分。在那里，我刚刚复制了数组中的值“2”菜单选项并将其粘贴到下一行的下方。然后添加数字 3 代替粘贴代码中的数字 2。

    "desc" => "",
    "id" => SHORTNAME."_menu_layout",
    "type" => "radio",
    "options" => array(
        '1' => '<div style="float:left;width:90%;"><img src="'.get_template_directory_uri().'/functions/images/menu1.png"/></div>',
        '2' => '<div style="float:left;width:90%;"><img src="'.get_template_directory_uri().'/functions/images/menu2.png"/></div>',
        '3' => '<div style="float:left;width:90%;"><img src="'.get_template_directory_uri().'/functions/images/menu3.png"/></div>',
    ),

我已经为菜单布局三 (menu3.png) 创建了一个缩略图 jpeg，并将其放入 /functions/images 目录中。

这为我在“主题设置”-->“标题选项卡”菜单中的自定义菜单布局生成了一个新的单选按钮和缩略图。