How To Create Jpg To Pdf 1 Webpage Easy Method

Last Updated: January 20, 2026

Today i would tell you how to create a JPG to PDF converter is a practical web development project that combines file handling, image processing, and PDF generation. This guide will walk you through the steps of creating a simple JPG to PDF converter using HTML, PHP, and the FPDF library. We’ll also explain parts of the code to help you understand how everything comes together.

Step 1: Setting Up the HTML Structure

First, we’ll create a simple HTML structure that will serve as the user interface for the converter. The interface will include a form where users can upload a JPG file and submit it for conversion.

Here’s how the basic HTML structure looks:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JPG to PDF Converter</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-5">
        <h2 class="text-center">Convert JPG to PDF</h2>
        <!-- PHP code will be integrated here -->
    </div>
</body>
</html>

Step 2: Handling the File Upload

Next, we’ll use PHP to handle the file upload. When a user uploads a JPG file, PHP will process it. We use the $_FILES array to get details about the uploaded file, such as its temporary location and name.

Here’s how we check if a file was uploaded and get its details:

Also check How to Create a Website Rank Checker Using PHP, Bootstrap, and CSS in WordPress

Step 3: Verifying the File Type

Before converting the file, we need to ensure it is a valid JPG file. We do this by checking the file extension:

Step 4: Converting JPG to PDF with FPDF

To convert the JPG image into a PDF, we use the FPDF library. This library allows us to create PDFs in a flexible and straightforward manner.

  1. Include the FPDF Library: Ensure you have the FPDF library installed in your project.
  2. Create a PDF Instance and Add a Page:
  1. Set the Page Dimensions and Insert the Image:
require('fpdf/fpdf.php');$pdf = new FPDF();$pdf->AddPage();
list($width, $height) = getimagesize($jpgFile);
$pdf->SetAutoPageBreak(false);
$pdf->Image($jpgFile, 0, 0, $pdf->GetPageWidth(), $pdf->GetPageHeight(), strtoupper($extension));
  1. Output the PDF:
$pdf->Output('F', $pdfFileName);

Step 5: Displaying the Download Option

After the conversion, we provide a link for the user to download the newly created PDF. This is done with the following code:

echo '<div class="container mt-5 text-center">';
echo '<h3>Conversion Successful!</h3>';
echo '<a href="' . $pdfFileName . '" class="btn btn-success" download>Download PDF</a>';
echo '<br><br>'; // Adding some space between the buttons
echo '<a href="" class="btn btn-primary">Convert Another Image</a>';
echo '</div>';

Full Code Integration

Now, let’s integrate everything:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JPG to PDF Converter</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-5">
        <h2 class="text-center">Convert JPG to PDF</h2>

        <?php
        if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['jpgFile'])) {
            $jpgFile = $_FILES['jpgFile']['tmp_name'];
            $jpgFileName = $_FILES['jpgFile']['name'];
            $extension = pathinfo($jpgFileName, PATHINFO_EXTENSION);
            $pdfFileName = pathinfo($jpgFileName, PATHINFO_FILENAME) . '.pdf';

            if ($extension == 'jpg' || $extension == 'jpeg') {
                require('fpdf/fpdf.php');
                $pdf = new FPDF();
                $pdf->AddPage();
                list($width, $height) = getimagesize($jpgFile);
                $pdf->SetAutoPageBreak(false);
                $pdf->Image($jpgFile, 0, 0, $pdf->GetPageWidth(), $pdf->GetPageHeight(), strtoupper($extension));
                $pdf->Output('F', $pdfFileName);

                echo '<div class="container mt-5 text-center">';
                echo '<h3>Conversion Successful!</h3>';
                echo '<a href="' . $pdfFileName . '" class="btn btn-success" download>Download PDF</a>';
                echo '<br><br>';
                echo '<a href="" class="btn btn-primary">Convert Another Image</a>';
                echo '</div>';
            } else {
                echo '<div class="alert alert-danger">Error: Only JPG files are supported.</div>';
            }
        } else {
            echo '
            <form action="" method="post" enctype="multipart/form-data">
                <div class="mb-3">
                    <label for="jpgFile" class="form-label">Upload JPG File</label>
                    <input class="form-control" type="file" name="jpgFile" id="jpgFile" accept=".jpg,.jpeg" required>
                </div>
                <button type="submit" class="btn btn-primary">Convert to PDF</button>
            </form>
            ';
        }
        ?>

    </div>
</body>
</html>

Final Thoughts

This guide provides a straightforward approach to building a JPG to PDF converter using HTML, PHP, and FPDF. By understanding each part of the code, you can customize and expand this basic converter to meet more complex requirements, such as handling multiple images or adding more PDF customization options.


Demo

Leave a Comment

//
Our customer support team is here to answer your questions. Ask us anything!
👋 Hi, how can I help?