WordPress/CF7-根据位置定制联系人表单7 ajax loader gif

我在一个网站上使用Contact Form 7插件，它在每个页面的页脚中都有一个Contact Form，在一个专用Contact页面的主区域中也有一个Contact Form

我知道如何定制CF7中的ajax加载程序gif

函数my\u wpcf7\u ajax\u loader（）{
返回get_stylesheet_directory_uri（）。/images/my loader image.gif'；
}
添加过滤器（'wpcf7_ajax_加载器'，'my_wpcf7_ajax_加载器'）

…但我的问题是，我需要指定两个不同的加载程序图像-一个用于页脚表单，另一个用于联系人页面表单。（这样做的原因是，一个表单在白色背景上，另一个表单在红色背景上，尽管尝试了不同的方式，但我认为不可能有一个加载gif在两者上都很好。）
由于加载图像是一个带有
src
属性的
img
元素，css方法将没有帮助。

需要通过JavaScript更改
img
标记的
src
属性，并且无需修改contact 7表单插件的核心js（以便将来升级插件），我提供了以下JavaScript解决方案，通过bruteforce方法应用此更改

(function($) {
    setInterval(function() {
        if(typeof $.fn.wpcf7InitForm != "undefined") {
            //Contact Form 7 is loaded and initialized
            $loaderImage = $("#wpcf7-f52-o2 img.ajax-loader"); // modify your selector accordingly
            if(!$loaderImage.data("pathChanged")) {
                $loaderImage.attr("src", "ALTERNATIVE_IMAGE_PATH");
                $loaderImage.data("pathChanged", true);
            }
        }
    }, 2000);
})(jQuery);

尽管这可能不是最好的方法，但看看它是否有帮助。
我读了一篇文章，为你的问题提供了可靠的解决方案。他们给出了这个解决方案：

    // Change the URL to the ajax-loader image
function change_wpcf7_ajax_loader($content) {
    if ( is_page('contact') ) {
        $string = $content;
        $pattern = '/(<img class="ajax-loader" style="visibility: hidden;" alt="ajax loader" src=")(.*)(" \/>)/i';
        $replacement = "$1".get_template_directory_uri()."/images/ajax-loader.gif$3";
        $content =  preg_replace($pattern, $replacement, $string);
    }
    return $content;
}
add_filter( 'the_content', 'change_wpcf7_ajax_loader', 100 );

//将URL更改为ajax加载程序映像
函数更改\u wpcf7\u ajax\u加载程序（$content）{
如果（是第页（“联系人”）{
$string=$content；
$pattern='/（）/i'；
$replacement=“$1.get_template_directory_uri（）。”/images/ajax loader.gif$3”；
$content=preg_replace（$pattern，$replacement，$string）；
}
返回$content；
}
添加过滤器（“内容”，“更改wpcf7\U ajax\U加载程序”，100）；

文章链接：
以下是解决方案：

你有链接吗？您可能可以在css后台执行此操作。当然，以下是链接：。您可以使用FireBug删除将显示两个加载程序图像的
可见性
和
显示
属性。第一个（好的）加载程序映像位于DOM中“发送消息”按钮之后。另一个（坏的）加载程序映像位于DOM中“提交”按钮（在页脚）的正后方。为此干杯。巧合的是，我今天早些时候放弃了CF7，因为根据pingdom的速度测试，它会造成很大的延迟-/我认为我的问题中的原始代码，用
if（is_page（'contact'）{…}
包装将是一个更好的解决方案-但如果我在同一页面上有两个联系人表单，每个表单都需要不同的旋转gif，它仍然不能解决问题…谢谢，但我更喜欢PHP解决方案。@ban geoengineering，在这种情况下，您需要更改Contact Form 7插件的核心文件，这不是推荐的方法，因为一旦插件升级，更改将被覆盖。请参阅下面Denzorr的答案，因为有一个可用的钩子。
add_filter('wpcf7_ajax_loader', 'my_wpcf7_ajax_loader');

function my_wpcf7_ajax_loader () {
    return  network_home_url() . '/assets/themes/ips-helpdesk/images/ajax-loader.gif';
}