4x6 Photo Cards with first and last name.
Chef Paul Irminger
Imports: 2

Creates 4x6 cards of each member of a list. We use these to create a visible org chart of where people in our church are serving and who is leading their team. I have limited knowledge of coding and used chatgpt for this. Export as PDF instead of HTML to make printing easier. How to use after importing to planning center. Go to planning center people -> lists -> choose your list -> hit the printer icon (print list) -> choose this recipe - save as PDF (html doesn't separate them into different pages as well) -> Click the blue hyperlinked file to the right of the "print list" button. Once you have your PDF on your computer. Open the PDF in adobe -> File -> Export A PDF -> Images -> JPEG -> (Click the create a folder button because it will create as many images as there are pages) Name the default name of the files -> hit save -> upload the folder of images to wherever you print photos.

Import to Planning Center
Preview

Report Preview
Copy Code Import to Planning Center 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Profile Photos</title>
    <style>
        /* Ensure the photo fills the entire printed page */
        @page {
            margin: 0; /* Remove default margins for full-page printing */
        }
        
        body {
            margin: 0;
            padding: 0;
            background-color: white;
        }
        
        /* Ensure each profile photo takes up the full page */
        .profile-page {
            width: 100vw;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
            page-break-after: always; /* Ensures a page break after each profile */
        }
        
        /* Full-page profile photo container */
        .profile-photo {
            width: 100vw;
            height: 100vh;
            overflow: hidden;
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
        }
        
        /* Make the image fill the entire page */
        .profile-photo img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures the image fills the space without distortion */
        }
        
        /* Name box positioned at the bottom */
        .name-box {
            position: absolute;
            bottom: 0;
            width: 100%;
            background-color: #2D4C9B; /* Dark blue background */
            color: white; /* White text for contrast */
            text-align: center;
            padding: 15px 0;
            font-size: 36px;
            font-family: 'Avenir', sans-serif; /* Modern, clean font */
        }
    </style>
</head>
<body>
    {% for person in people %}
        {% if person.photo_url and person.photo_url != '' %}
            <!-- Each person gets a full-page photo with a page break after -->
            <div class="profile-page">
                <div class="profile-photo">
                    <img src="{{ person.photo_url }}" alt="{{ person.first_name }} {{ person.last_name }}">
                    <div class="name-box">{{ person.first_name }} {{ person.last_name }}</div>
                </div>
            </div>
        {% endif %}
    {% endfor %}
</body>
</html>

Chef Paul Irminger February 2025