Elementor MEDIA控件如何设置插件目录自定义默认图片

你只需要替换原有默认参数里Elementor自带占位图的取值，改为你插件目录下对应图片的可访问URL即可，注意不要硬编码路径，使用WordPress原生路径函数保证不同环境下的兼容性。

具体实现要点 #

• 替换默认值：删除原有\Elementor\Utils::get_placeholder_image_src()调用，改为自定义图片地址
• 正确获取插件内图片URL：使用WordPress原生plugin_dir_url()函数拼接路径，避免因插件目录名、站点结构变化导致图片失效
• 路径校验：注意区分服务器本地文件路径和Web访问URL，不要使用返回本地路径的plugin_dir_path()函数，会导致前端图片加载失败

代码示例 #

假设你的控件代码写在插件根目录的文件中，和assets文件夹处于同级目录，代码如下：

// 拼接自定义占位图的Web访问地址
$custom_placeholder = trailingslashit( plugin_dir_url( __FILE__ ) ) . 'assets/img/placeholder.png';

$repeater->add_control(
    'ferdaussk_team_profile_image',
    [
        'label' => esc_html__( 'Choose Image', 'ferdaussk' ),
        'type' => Controls_Manager::MEDIA,
        'default' => [
            'url' => $custom_placeholder,
        ],
    ]
);

子目录路径适配说明 #

如果你的控件代码存放在插件的子目录中，比如includes/widgets/team.php路径下，需要调整plugin_dir_url()的传入参数，向上回溯到插件根目录再拼接图片路径，示例：

// dirname第二个参数代表向上回溯的目录层级，根据你的实际文件位置调整即可
$custom_placeholder = trailingslashit( plugin_dir_url( dirname( __FILE__, 2 ) ) ) . 'assets/img/placeholder.png';

如果后续你需要基于图片ID做裁剪、获取不同尺寸图片的逻辑，可以提前把占位图上传到WordPress媒体库，在default参数中额外传入'id' => 媒体库中对应图片的ID即可，仅做默认展示的话只传url参数就能正常生效。

内容的提问来源于stack exchange，提问作者DARPON.ETZ