提交后下载文件联系表格7 Wordpress

时间:2016-03-18 21:29:46

标签: javascript wordpress contact-form-7

我知道如何在wordpress中提交联系表单7构建表单后将表单重定向到另一个页面。所以我可以将它重定向到pdf文件。 (然后在浏览器中打开)

但我希望在提交后直接下载。没有重定向。

我用来将表单重定向到pdf文件的代码是:

on_sent_ok: "location = 'url to pdf file here';"

形式将消失并说出的完美方式 a感谢您注意表单的位置并开始下载PDF文件

2 个答案:

答案 0 :(得分:1)

您可以通过在PDF目录中添加此.htaccess文件来强制直接下载pdf而不是在服务器上查看。

.htaccess - 这将强制下载PDF

<FilesMatch "\.(?i:pdf)$">
   ForceType application/octet-stream
   Header set Content-Disposition attachment
</FilesMatch>

或者你可以试试javascript(未经测试)

function force_download( file ) {
    pdf = window.open(file, '', 'left=100,screenX=100');
    pdf.document.execCommand('SaveAs', 'null', 'myfile.pdf');
    pdf.close();
 }
 on_sent_ok: "force_download('pdf_url_here');"

答案 1 :(得分:1)

由于on_sent_ok已被弃用,因此以下示例可为您提供灵感。 我需要在网站所有案例研究的内容之后添加一个下载CTA,但是要“交换”用户数据:

  • 在您的页面上显示一个CF7表单,在所有案例研究中,我在内容类型之后都插入了同一个表单
  • 找到一种供人们下载所需的PDF URL的方法,因为对我来说,所有案例研究都具有不同的PDF,我只是添加了一个ACF字段,仅对PDF进行了过滤,它返回了文件URL。
  • 基于CF7 Dom events,选择您希望使下载生效的操作,因为我没有发送任何确认电子邮件,所以我希望处理wpcf7submit事件。请注意,只有在表单通过验证后,才会触发wpcf7submit事件

所以代码看起来像这样:

<?php 
// For simplicity, using an anonymous functions
add_action( 'wp_print_footer_scripts', function () {
    // Check the wanted singular post type loading
    if ( is_admin() || ! is_singular( 'case-study' ) ) {
        return;
    }

    // Check if the ACF PDF field is not empty for use
    $pdf_link = get_field( 'pdf' );
    if ( empty( $pdf_link ) ) {
        return;
    }

    // Hook on the "wpcf7submit" CF7 Dom event to force the download
    printf( "<script>document.addEventListener( 'wpcf7submit', function( event ) { window.open('%s'); }, false );</script>", $pdf_link );
} );