WordPress.org

Forums

Contact Form 7
[resolved] Convert PDF File (23 posts)

  1. umea
    Member
    Posted 1 year ago #

    Does anyone know if it’s possible to convert data, that has been filled in in a form by a 2nd party, to a pdf file. This pdf file should automatically be sent in the annex of an email that will be sent to a 3rd party.

    If so, could you explain how this can be done?

    I have been searching on the internet but have not been able to find a proper answer so far.

    Thanks in advance!

    https://wordpress.org/plugins/contact-form-7/

  2. thepofo
    Member
    Posted 1 year ago #

    Yes you can, working on the same solution at the moment.

    I would advice you to use fpdf. In the functions.php you create a new hook like this:

    add_action( 'wpcf7_before_send_mail', 'save_application_form');
    function save_application_form($cf7) {
    
    /* GET EXTERNAL CLASSES */
    require(TEMPLATEPATH.'/includes/fpdf.php');
    
    /* example code to generate the pdf
    $pdf = new FPDF();
    $pdf->AddPage();
    $pdf->SetFont('Arial','B',16);
    $pdf->Write(5,"Hello, World!\n\n\n");
    $pdf->Output(TEMPLATEPATH.'/file/pdf.pdf', 'F');
    
    /* add  the pdf as attach to the email
    $cf7->uploaded_files = array ( 'attachedfile' =>  TEMPLATEPATH.'/file/pdf.pdf' );
    
    }

    Attention points: don't forget to add [attachedfile] as parameter in the attachment field of your contact form

    I have been searching for a long time scraping pieces of information together to solve this for myself.
    Hope I can help you with this.

    Eric

  3. umea
    Member
    Posted 1 year ago #

    Thanks a lot with this information Eric! Hope I'll be able to manage it now.

    Peter

  4. umea
    Member
    Posted 1 year ago #

    Hey Eric,

    I tried to create a PDF as an attached file in the email but it did not succeed with the example you've given. It's the first time I work with php so I don't have any experience. Do you have any other tips or suggestions which might help?

    Thanks in advance!

    Peter

  5. thepofo
    Member
    Posted 1 year ago #

    Hey Peter,

    Can you post you code so I can have a look :)

    Thanks,
    Eric

  6. umea
    Member
    Posted 1 year ago #

    Hey Eric,

    In fact I literally copied your code in the functions.php. I don't have any knowledge about this at al... Maybe you know if there is an online manual which clearly describes how to work with this? I have tried this already on fpdf.org but unfortunaly didn't succeed so far.

    Thanks!,

    Peter

  7. thepofo
    Member
    Posted 1 year ago #

    Hey Peter,

    Basically you need to download the fpdf sources from the fdpf website and add it in your template folder. This is the reference I made in the source code above, in this case added to the includes folder

    require(TEMPLATEPATH.'/includes/fpdf.php');

    Copy the code as suggested to inject code at the moment the form is submitted

    add_action( 'wpcf7_before_send_mail', 'save_application_form');
    function save_application_form($cf7) {
    
    /* GET EXTERNAL CLASSES */
    require(TEMPLATEPATH.'/includes/fpdf.php');
    
    }

    Then add your pdf creation script. This is something very custom you need to build. You can get examples from the tutorials section on the fpdf website.

    Retrieving values from the submitted form:

    $values = $cf7->posted_data;
    echo $values['your-value'];

    your-value are the different form field names you use in the design of you pdf.

    Next save your pdf to disk in order to allow it to attach to the email notification. Don't worry, the Contact Form 7 plugin automatically deletes this files on successful submit of the email. The folder where you store this pdf should be writable by the script.

    $pdf->Output(TEMPLATEPATH.'/file/pdf.pdf', 'F');

    Then finally attach the PDF to the form submit action:

    $cf7->uploaded_files = array ( 'pdf' =>  TEMPLATEPATH.'/file/pdf.pdf');

    [pdf] would be added to the file attachments field on mail config.

    Basically this is the way you can generate and send a custom build pdf to the user.

    Hope this is more clear. However, you do need some experience creating your pdf file.

    Eric

  8. umea
    Member
    Posted 1 year ago #

    Hey Eric,

    Thank you very much for your help. It has not yet succeeded. Soon I go continue with this. I have now another question about working with contact form 7. I know perhaps it's not a difficult issue for you, but for me it is quite difficult. I'm just a beginner :).

    How can I put two text fields next to each other in contact form 7? (without table format)

    At the moment I have this:

    <p>Uw naam*
    [text* your-name class:uwnaam]</p>

    <p>Uw email*
    [text* your-email class:uwemail]</p>

    I like to have this two sections next to each other.

    I have already completed the following codes to change the width of these two sections (classes):

    Input.uwnaam{width: 250px;}
    Input.uwemail{width: 250px;}

    Thank you very much again! :)

  9. thepofo
    Member
    Posted 1 year ago #

    Hello Peter,

    Although a bit off topic, I would be glad to help you with this.

    Basically you need to enclose your fields in floating divs:

    <div class="formdiv">Uw naam*
    [text* your-name class:uwnaam]</div>
    <div class="formdiv">Uw email*
    [text* your-email class:uwemail]</div>

    Then in you stylesheet you should add float:left;

    .formdiv {float:left}
    Input.uwnaam{width: 250px;}
    Input.uwemail{width: 250px;}

    After that you can continue to style, don't forget to do a clear:both removing float elements when needed. Otherwise it might screw up your design.

    Btw, Zit jij in België of Nederland :)

  10. umea
    Member
    Posted 1 year ago #

    Thanks! It works. Now I have 3 textfields next to each other. How can I get another 3 textfields one row down? Now I have this text in contact form 7:

    <div class="formdiv">Uw naam*
    [text* your-name class:uwnaam]</div>
    <div class="formdiv">Uw email*
    [text* your-email class:uwemail]</div>
    <div class="formdiv">Uw achternaam*
    [text* your-name class:uwachternaam]</div>

    <p>Uw leeftijd*
    [text* your-email class:uwleeftijd]</p>

    And this code now I have in CSS:

    .formdiv {float:left}
    Input.uwnaam{width: 250px;margin-right: 50px;}
    Input.uwemail{width: 250px;margin-right: 50px;}
    input.uwachternaam{width: 250px;}

    And what do you mean with clear:both removing float elements?

    Thanks a lot!

    Btw, ik zit in Nederland, jij? :)

  11. umea
    Member
    Posted 1 year ago #

    Hello everyone,

    I'm not finished with this issue yet. Can someone help me further with my last question:

    And what do you mean with clear:both removing float elements?

    I have already two rows (each row with 3 coloms) below each other. But the field I would like to have below my second row is standing now next to the first row.

    I would also like to know how I can change the type, when im using formdiv, the type is changing automatically (become bigger)?

    I have done a lot of research about this issue but i'm still trying to solve this problem.

    For some people it is not difficult, but I'm just a beginner :)

    So, I hope someone can help me further.

    Thanks in advance!

  12. thepofo
    Member
    Posted 1 year ago #

    Can you give us the link of the link of the page? That way I can have a look and help you.

  13. umea
    Member
    Posted 1 year ago #

    Thank you for your quick response!

    Well, we aren't online with our website yet. But we can give you an example of our current situation regarding the input for contact form 7 and how to get fields next to each other.

    Firstly, we have followed your description about the structure within floating divs such as </div>. In both fields -> contact form 7 and CSS field.

    Maybe you can help us further if you see our current situation. I try to explain clearly :).

    This is our input in Contact form 7:

    <div class="formdiv">Uw voornaam*
    [text* Uwvoornaam class:uwvoornaam]</div>
    <div class="formdiv">Uw achternaam*
    [text* Uwachternaam class:uwachternaam]</div>
    <div class="formdiv">Uw email*
    [text* your-email class:uwemail]</div>
    <div class="formdiv">Uw leeftijd*
    [text* your-email class:uwleeftijd]</div>
    <div class="formdiv">Uw telefoonnummer*
    [tel* number class:uwtelefoonnummer]</div>
    <div class="formdiv">besteld op:*
    [date* date class:datum]</div>

    <p>Onderwerp
    [text your-subject class:onderwerp] </p>

    This is our input in CSS Field:

    .formdiv {float:left}
    Input.uwvoornaam{width: 250px;margin-right: 25px;}
    Input.uwemail{width: 250px;}
    input.uwachternaam{width: 250px;margin-right: 25px;}

    .formdiv {float:left}
    Input.uwleeftijd{width: 250px;margin-right: 25px;}
    Input.datum{width: 250px;}
    Input.uwtelefoonnummer{width: 250px;margin-right: 25px;}

    Each ".formdiv" (apply in CSS) represents one row consisting of 3 textfields (where someone can fill in things). So, we have in the current situation 2 rows, each row has 3 different textfields.

    The point is that in this situation the type of letters automatically where changed in a bigger size. Like.. from size 10 to 12. Also "onderwerp" in input contact form 7 is standing automatically next to the first row. We would like to get "onderwerp" automatacillaly below the second row.

    In addition, we hope you can explain to us what you meant with: clear:both removing float elements?

    I hope this is a clear explenation about our current situation. And we hope you can help us further. This is still a difficult issue for us.

    Thanks again! :)

  14. umea
    Member
    Posted 10 months ago #

    Hi,

    We would like to come back on the first question in this topic about convert to PDF. We are still working on this issue and we have a question about the connection between the send button and the concerning action (add action) after. We used the code as mentioned above in this topic in our php function. But when we use this code, the send button does not response in combination with the add action option -> "wpcf7_before_send_mail". It does not work unfortunately.

    We used the following code (see below) and we added the code to functions.php. Besides that, we added the FPDF files to the includes directory of contact-form-7. Maybe we have to move 'add_action( 'wpcf7_before_send_mail', 'save_application_form');' to another function?? Or there is something wrong with the code??

    We hope that someone can help us to solve this problem.

    The code that we used:

    add_action( 'wpcf7_before_send_mail', 'save_application_form');
    
    function save_application_form($cf7) {
    
    /* GET EXTERNAL CLASSES */
    require('http://www.umea.nl/wp-content/plugins/contact-form-7/includes/fpdf.php');
    
    /* example code to generate the pdf */
    $pdf = new FPDF();
    $pdf->AddPage();
    $pdf->SetFont('Arial','B',16);
    $pdf->Write(5,"Hello, World!\n\n\n");
    $pdf->Output('http://www.umea.nl/wp-content/plugins/contact-form-7/includes/file/pdf.pdf', 'F');
    
    /* add  the pdf as attach to the email */
    $cf7->uploaded_files = array ( 'attachedfile' => 'http://www.umea.nl/wp-content/plugins/contact-form-7/includes/file/pdf.pdf' );
    
    }

    Thanks in advance! :)

  15. thepofo
    Member
    Posted 10 months ago #

    Hello Peter,

    Can you look into the Apache error logs for me to see if you have any message, the code looks alright, the only thing I see is that you use hardcoded links to save your pdf, this might be an issue. Although, this should not block the submit button.

    Thanks,
    Eric

  16. Snerfus
    Member
    Posted 10 months ago #

    $cf7->uploaded_files no longer accesses the files, in CF7 3.9

    CF7 has changed the way to access post data and files, in 3.9

    [code]
    function my_wpcf7_before_send_mail($cf7) {
    $submission = WPCF7_Submission::get_instance();
    $files = $submission->uploaded_files();
    [/code]
    And $files will contain the array of the files.

  17. benbunch
    Member
    Posted 10 months ago #

    Hey, I stumbled across this thread in the hopes of integrating FPDF on a custom wordpress site.

    Basically I have a Custom Post Type and I want to give the user an option to click a button and a PDF would be created using the content from the CPT (ie. post thumbnail, title, custom tax terms, custom fields, etc...)

    I have been able to download FPDF and statically mess around with the classes, but I'm not sure how to implement this within the template for a CPT.

  18. umea
    Member
    Posted 10 months ago #

    Hey everybody,

    Thank you very much for the response. We tried to change the code wich has to do with CF7 update. It does not work so far. So, do I understand correctly.. when there is an update from CF7 we always have to change the code?

    At the moment, CF7 does not work. CF7 is still running a loop when we press the "send" button. Any other suggestions?

    Does someone know other options or plugins which can create a PDF file after filling in contact form 7 data?

    We hope that someone can help us :)

    Thanks in advance.

    Peter

  19. larssonk22
    Member
    Posted 7 months ago #

    Hi, I too am stuck on this last part like Umea.

    Any ideas?

    Thanks

  20. thepofo
    Member
    Posted 7 months ago #

    Can you share some code, like the function your use to build this.

    Would be easier to help you.

    Thanks,
    Eric

  21. larssonk22
    Member
    Posted 7 months ago #

    Hi thepofo, I've followed the instructions laid out in this thread. Just changing the file directories. I haven't added any code to the pdf itself, just left the write function as a hello world string so I could test it.

    The email is being sent and received now, but there is no attachment. I have extracted the fpdf zip into it's own folder in my theme's include folder, it doesn't seem as if a pdf is being generated.

    The following code is added to my function.php file

    add_action( 'wpcf7_before_send_mail', 'save_application_form');
    function save_application_form($cf7) {
    
    /* GET EXTERNAL CLASSES */
    require(TEMPLATEPATH . 'includes/fpdf/fpdf.php');
    
    $pdf = new FPDF();
    $pdf->AddPage();
    $pdf->SetFont('Arial','B',16);
    $pdf->Write("Hello, World! Is there anything below this?");
    $pdf->Output(TEMPLATEPATH . '/epdf/epdf.pdf', 'F');
    $cf7->uploaded_files = array ( 'attachedfile' =>  TEMPLATEPATH . '/epdf/epdf.pdf' );
    }
  22. jurestern
    Member
    Posted 6 months ago #

    Hi, is there any update on this, using this code sends the email without the attachment.

    Tanks, Jure

  23. korynorthrop
    Member
    Posted 4 months ago #

    I needed to accomplish the same thing and finally got the Contact Form 7 results to be converted to a PDF.

    add_action('wpcf7_before_send_mail', 'wpcf7_update_email_body');
    function wpcf7_update_email_body($contact_form) {
    
    $submission = WPCF7_Submission::get_instance();
    if ( $submission ) {
    /* DEFINE CONSTANT AND GET FPDF CLASSES */
    define ('FPDF_PATH',get_template_directory().'/fpdf/'); // MAKE SURE THIS POINTS TO THE DIRECTORY IN YOUR THEME FOLDER THAT HAS FPDF.PHP
    require(FPDF_PATH.'fpdf.php');
    
    $posted_data = $submission->get_posted_data();
    // SAVE FORM FIELD DATA AS VARIABLES
    $name = $posted_data["your-name"];
    $email = $posted_data["your-email"];
    $subject = $posted_data["your-subject"];
    $message = $posted_data["your-message"];
    
    $pdf = new FPDF();
    $pdf->AddPage();
    $pdf->SetFont('Arial','B',16);
    $pdf->Write(5,$name . "\n\n" . $email . "\n\n" . $subject . "\n\n" . $message);
    $pdf->Output(FPDF_PATH.'test.pdf', 'F'); // OUTPUT THE NEW PDF INTO THE SAME DIRECTORY DEFINED ABOVE
    
    }
    }
    
    add_filter( 'wpcf7_mail_components', 'mycustom_wpcf7_mail_components' );
    function mycustom_wpcf7_mail_components($components){
    if (empty($components['attachments'])) {
    $components['attachments'] = array(FPDF_PATH .'test.pdf'); // ATTACH THE NEW PDF THAT WAS SAVED ABOVE
    }
    return $components;
    }

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Contact Form 7
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic