├── README.md ├── LICENSE.txt ├── self_mailers ├── 6x18_inside.html ├── 12x9_inside.html ├── 6x18_outside.html ├── 12x9_outside.html ├── 11x9_outside.html └── 11x9_inside.html ├── postcards ├── 4x6_front.html ├── 6x9-front.html ├── 6x11-front.html ├── 6x9-back.html ├── 4x6-back.html └── 6x11-back.html ├── checks ├── attachment.html └── check-bottom.html └── letters ├── 8.5x11-letter-custom-envelope.html └── 8.5x11-letter.html /README.md: -------------------------------------------------------------------------------- 1 | # Lob HTML Examples 2 | 3 | These are HTML Examples for use with the [Lob Print & Mail APIs](https://lob.com). 4 | 5 | - [Postcards](/postcards) 6 | - [Letters](/letters) 7 | - [Checks](/checks) 8 | - [Self Mailers](/self_mailers) 9 | 10 | Please reference the API documentation [here](https://lob.com/docs) for more integration details. 11 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | Copyright (c) 2017 Lob.com 2 | 3 | MIT License 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining 6 | a copy of this software and associated documentation files (the 7 | "Software"), to deal in the Software without restriction, including 8 | without limitation the rights to use, copy, modify, merge, publish, 9 | distribute, sublicense, and/or sell copies of the Software, and to 10 | permit persons to whom the Software is furnished to do so, subject to 11 | the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be 14 | included in all copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 19 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 20 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 21 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 22 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 23 | -------------------------------------------------------------------------------- /self_mailers/6x18_inside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Lob.com Sample 6x18 Self Mailer 7 | 37 | 38 | 39 | 40 | 41 | 42 |
43 | 44 |
45 | The frosted white box denotes the safe area to place text. 46 |
47 |
48 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /self_mailers/12x9_inside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Lob.com Sample 12x9 Self Mailer 7 | 37 | 38 | 39 | 40 | 41 |
42 | 43 |
44 | The frosted white box denotes the safe area to place text and content. 45 |
46 |
47 | 48 | 49 | -------------------------------------------------------------------------------- /postcards/4x6_front.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 4x6 Postcard Front 6 | 42 | 43 | 44 | 45 |
46 | 47 |
48 | The frosted white box is the safe area. Do not put text outside this box. 49 |
50 |
51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /postcards/6x9-front.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 6x9 Postcard Front 6 | 42 | 43 | 44 | 45 |
46 | 47 |
48 | The frosted white box is the safe area. Do not put text outside this box. 49 |
50 |
51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /postcards/6x11-front.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 6x11 Postcard Front 6 | 42 | 43 | 44 | 45 |
46 | 47 |
48 | The frosted white box is the safe area. Do not put text outside this box. 49 |
50 |
51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /checks/attachment.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample Attachment 6 | 45 | 46 | 47 | 48 |
49 |
50 |
51 | The grey box is the safe area. Do not put text outside this box. If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 52 |
53 |
54 |
55 |
56 |
57 |
58 | This is a second page. 59 |
60 |
61 |
62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /checks/check-bottom.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample Check Bottom 6 | 47 | 48 | 49 | 50 |
51 |
52 | Leave this red area completely blank. This is where the check will be printed and perforated. 53 |
54 |
55 |
56 |
57 | The grey box is the safe area. Do not put text outside this box. If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 58 |
59 |
60 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /self_mailers/6x18_outside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Lob.com Sample 6x18 Self Mailer 7 | 46 | 47 | 48 | 49 | 50 | 51 |
52 | 53 |
54 | The frosted white box denotes the safe area to place text. 55 |
56 |
57 |
58 | 59 | Do not place any artwork or text in the ink free area. Address and postage will be automatically printed here by Lob. 60 |
61 |
62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /self_mailers/12x9_outside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Lob.com Sample 12x9 Self Mailer 7 | 46 | 47 | 48 | 49 | 50 | 51 |
52 | 53 |
54 | The frosted white box denotes the safe area to place text and content. 55 |
56 |
57 |
58 | 59 | Do not place any artwork or text in the ink free area. Address and postage will be automatically printed here by Lob. 60 |
61 |
62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /postcards/6x9-back.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 6x9 Postcard Back 6 | 52 | 53 | 54 | 55 |
56 | 57 |
58 | The frosted white box denotes the safe area to place text. The solid white box denotes the ink-free area which must be left blank. If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 59 |
60 |
61 | 62 | 63 | 64 |
65 | 66 | 67 | 68 | -------------------------------------------------------------------------------- /postcards/4x6-back.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 4x6 Postcard Back 6 | 53 | 54 | 55 | 56 |
57 | 58 |
59 | The frosted white box denotes the safe area to place text. The solid white box denotes the ink-free area which must be left blank. If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 60 |
61 |
62 | 63 | 64 | 65 |
66 | 67 | 68 | 69 | -------------------------------------------------------------------------------- /postcards/6x11-back.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 6x11 Postcard Back 6 | 53 | 54 | 55 | 56 |
57 | 58 |
59 | The frosted white box denotes the safe area to place text. The solid white box denotes the ink-free area which must be left blank. If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 60 |
61 |
62 | 63 | 64 | 65 |
66 | 67 | 68 | 69 | -------------------------------------------------------------------------------- /letters/8.5x11-letter-custom-envelope.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 8.5x11 Letter with Custom Envelope 6 | 65 | 66 | 67 | 68 |
69 |
70 |
71 | If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 72 |
73 |
74 | 75 | 76 |
77 |
78 | The recipient address will be printed here on top of a white box which will cover any content provided which is underneath this area. The red area represents a rough area which will be visible through the envelope window. 79 |
80 |
81 | 82 |
83 |
84 |
85 |
86 |
87 |
88 | This is a second page. 89 |
90 |
91 |
92 | 93 | 94 | 95 | -------------------------------------------------------------------------------- /self_mailers/11x9_outside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 12x9 Self Mailer 6 | 65 | 66 | 67 | 68 |
69 |
70 |
71 | 72 | This is the top panel safe zone. All critical artwork should be kept in the frosted white safe zone. Color can be printed edge-to-edge. 73 |
74 |
75 | 76 | Do not place any artwork or text in the ink free area. Address and postage will be automatically printed here by Lob. 77 |
78 |
79 | This is the bottom panel safe zone. All critical artwork should be kept in the blue safe zone. Color can be printed edge-to-edge. 80 |
81 | 82 | 83 | -------------------------------------------------------------------------------- /letters/8.5x11-letter.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 8.5x11 Letter 6 | 98 | 99 | 100 | 101 |
102 |
103 |
104 | If you are using the merge_variables argument, you can add variables like this: {{variable_name}}. 105 |
106 |
107 | 108 | 109 |
110 | 111 |
112 | 115 |
116 | The Return Address will be printed here. The red area will be visible through the envelope window. 117 |
118 |
119 |
120 |
121 | The Recipient's Address will be printed here. The red area will be visible through the envelope window. 122 |
123 |
124 |
125 |
126 |
127 |
128 | This is a second page. 129 |
130 |
131 |
132 | 133 | 134 | 135 | -------------------------------------------------------------------------------- /self_mailers/11x9_inside.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Lob.com Sample 11x9 Self Mailer 6 | 73 | 74 | 75 | 76 |
77 | 78 |
79 |
80 | All critical artwork should be kept within the blue safe zone. When opened, there will be continuity between the top panel and bottom panel. 81 |
82 |
83 | All critical artwork should be kept in the frosted white safe zone. Color can be printed edge-to-edge. When opened, there will be continuity between the top panel and bottom panel. 84 |
85 |
86 | The top panel will be glued to the bottom panel in this area. Critical artwork should be placed in the pink safe zone. Color can be printed edge-to-edge. The glue zone is part of the bottom panel. 87 |
88 |
89 | All critical artwork should be kept within the green visable safe zone. Color can be printed edge-to-edge. When folded/closed, this area will be visable. 90 |
91 |
92 | 93 | 94 | --------------------------------------------------------------------------------