email.blade.php
686 lines
| 1 | <!doctype html> |
| 2 | <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" |
| 3 | xmlns:o="urn:schemas-microsoft-com:office:office"> |
| 4 | |
| 5 | <head> |
| 6 | <title><mj-raw><?php echo esc_html__('Website Analytics Report', 'independent-analytics') . ' ' . $date; ?></mj-raw></title><!--[if !mso]><!--> |
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--> |
| 8 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
| 9 | <meta name="viewport" content="width=device-width,initial-scale=1"> |
| 10 | <style type="text/css"> |
| 11 | #outlook a { |
| 12 | padding: 0; |
| 13 | } |
| 14 | |
| 15 | body { |
| 16 | margin: 0; |
| 17 | padding: 0; |
| 18 | -webkit-text-size-adjust: 100%; |
| 19 | -ms-text-size-adjust: 100%; |
| 20 | } |
| 21 | |
| 22 | table, |
| 23 | td { |
| 24 | border-collapse: collapse; |
| 25 | mso-table-lspace: 0pt; |
| 26 | mso-table-rspace: 0pt; |
| 27 | } |
| 28 | |
| 29 | img { |
| 30 | border: 0; |
| 31 | height: auto; |
| 32 | line-height: 100%; |
| 33 | outline: none; |
| 34 | text-decoration: none; |
| 35 | -ms-interpolation-mode: bicubic; |
| 36 | } |
| 37 | |
| 38 | p { |
| 39 | display: block; |
| 40 | margin: 13px 0; |
| 41 | } |
| 42 | </style><!--[if mso]> |
| 43 | <noscript> |
| 44 | <xml> |
| 45 | <o:OfficeDocumentSettings> |
| 46 | <o:AllowPNG/> |
| 47 | <o:PixelsPerInch>96</o:PixelsPerInch> |
| 48 | </o:OfficeDocumentSettings> |
| 49 | </xml> |
| 50 | </noscript> |
| 51 | <![endif]--><!--[if lte mso 11]> |
| 52 | <style type="text/css"> |
| 53 | .mj-outlook-group-fix { width:100% !important; } |
| 54 | </style> |
| 55 | <![endif]--><!--[if !mso]><!--> |
| 56 | <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet" type="text/css"> |
| 57 | <link href="https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700" rel="stylesheet" type="text/css"> |
| 58 | <style type="text/css"> |
| 59 | @import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700); |
| 60 | @import url(https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700); |
| 61 | </style><!--<![endif]--> |
| 62 | <style type="text/css"> |
| 63 | @media only screen and (min-width:480px) { |
| 64 | .mj-column-per-100 { |
| 65 | width: 100% !important; |
| 66 | max-width: 100%; |
| 67 | } |
| 68 | |
| 69 | .mj-column-per-50 { |
| 70 | width: 50% !important; |
| 71 | max-width: 50%; |
| 72 | } |
| 73 | |
| 74 | .mj-column-per-10 { |
| 75 | width: 10% !important; |
| 76 | max-width: 10%; |
| 77 | } |
| 78 | |
| 79 | .mj-column-per-90 { |
| 80 | width: 90% !important; |
| 81 | max-width: 90%; |
| 82 | } |
| 83 | } |
| 84 | </style> |
| 85 | <style media="screen and (min-width:480px)"> |
| 86 | .moz-text-html .mj-column-per-100 { |
| 87 | width: 100% !important; |
| 88 | max-width: 100%; |
| 89 | } |
| 90 | |
| 91 | .moz-text-html .mj-column-per-50 { |
| 92 | width: 50% !important; |
| 93 | max-width: 50%; |
| 94 | } |
| 95 | |
| 96 | .moz-text-html .mj-column-per-10 { |
| 97 | width: 10% !important; |
| 98 | max-width: 10%; |
| 99 | } |
| 100 | |
| 101 | .moz-text-html .mj-column-per-90 { |
| 102 | width: 90% !important; |
| 103 | max-width: 90%; |
| 104 | } |
| 105 | </style> |
| 106 | <style type="text/css"></style> |
| 107 | <style type="text/css"> |
| 108 | .header-top-container, |
| 109 | .header-top-container-outlook { |
| 110 | background-color: <?php echo $colors['0']; ?> !important; |
| 111 | } |
| 112 | |
| 113 | .header-bottom-container, |
| 114 | .header-bottom-container-outlook { |
| 115 | background-color: <?php echo $colors['2']; ?> !important; |
| 116 | } |
| 117 | |
| 118 | .quick-stat-title { |
| 119 | background-color: <?php echo $colors['7']; ?> !important; |
| 120 | } |
| 121 | |
| 122 | .quick-stat-value a { |
| 123 | color: #000 !important; |
| 124 | text-decoration: none !important; |
| 125 | } |
| 126 | |
| 127 | .bar-chart-row td:hover div { |
| 128 | background-color: #19053C !important; |
| 129 | } |
| 130 | |
| 131 | .bar-chart-row td:hover span { |
| 132 | display: block !important; |
| 133 | } |
| 134 | |
| 135 | .top-ten-table td { |
| 136 | font-size: 12px; |
| 137 | } |
| 138 | |
| 139 | .top-ten-table .table-heading { |
| 140 | line-height: 2; |
| 141 | } |
| 142 | |
| 143 | .top-ten-table .name { |
| 144 | max-width: 130px; |
| 145 | overflow: hidden; |
| 146 | white-space: nowrap; |
| 147 | line-height: 1.8; |
| 148 | } |
| 149 | |
| 150 | .top-ten-table a { |
| 151 | color: #000 !important; |
| 152 | text-decoration: none !important; |
| 153 | } |
| 154 | |
| 155 | .y-axis { |
| 156 | width: 10% !important; |
| 157 | width: calc(50px + 0) !important; |
| 158 | } |
| 159 | |
| 160 | .chart-container { |
| 161 | width: 90% !important; |
| 162 | width: calc(100% - 50px) !important; |
| 163 | } |
| 164 | |
| 165 | .heading-divider, |
| 166 | .heading-divider p, |
| 167 | .y-axis, |
| 168 | .y-axis td, |
| 169 | .chart-border, |
| 170 | .chart-border p { |
| 171 | border-color: <?php echo $colors['6']; ?> !important; |
| 172 | } |
| 173 | |
| 174 | .body-container { |
| 175 | background-color: <?php echo $colors['8']; ?>; |
| 176 | } |
| 177 | |
| 178 | .footer, |
| 179 | .footer-outlook { |
| 180 | background-color: <?php echo $colors['9']; ?> !important; |
| 181 | color: <?php echo $colors['10']; ?> !important; |
| 182 | } |
| 183 | |
| 184 | @media all and (max-width: 599px) { |
| 185 | .chart-date-label { |
| 186 | font-size: 12px; |
| 187 | } |
| 188 | } |
| 189 | </style> |
| 190 | </head> |
| 191 | |
| 192 | <body style="word-spacing:normal;"> |
| 193 | <div class="body-container"> |
| 194 | <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="header-top-container-outlook" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 195 | <div class="header-top-container" style="margin:0px auto;max-width:600px;"> |
| 196 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 197 | style="width:100%;"> |
| 198 | <tbody> |
| 199 | <tr> |
| 200 | <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;"> |
| 201 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]--> |
| 202 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 203 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 204 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 205 | style="vertical-align:top;" width="100%"> |
| 206 | <tbody> |
| 207 | <tr> |
| 208 | <td align="center" class="site-title-text" |
| 209 | style="font-size:0px;padding:0 0 8px 0;word-break:break-word;"> |
| 210 | <div |
| 211 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:24px;font-weight:700;line-height:1;text-align:center;color:<?php echo $colors['1']; ?>;"> |
| 212 | <?php echo esc_html($site_title); ?></div> |
| 213 | </td> |
| 214 | </tr> |
| 215 | <tr> |
| 216 | <td align="center" class="sub-title-text" |
| 217 | style="font-size:0px;padding:0;word-break:break-word;"> |
| 218 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td height="18px" style="vertical-align:top;height:18px;"><![endif]--> |
| 219 | <div |
| 220 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:16px;line-height:1;text-align:center;color:<?php echo $colors['1']; ?>;height:18px;"> |
| 221 | <?php esc_html_e('Website performance report', 'independent-analytics'); ?></div> |
| 222 | <!--[if mso | IE]></td></tr></table><![endif]--> |
| 223 | </td> |
| 224 | </tr> |
| 225 | </tbody> |
| 226 | </table> |
| 227 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 228 | </td> |
| 229 | </tr> |
| 230 | </tbody> |
| 231 | </table> |
| 232 | </div> |
| 233 | <!--[if mso | IE]></td></tr></table><table align="center" border="0" cellpadding="0" cellspacing="0" class="header-bottom-container-outlook" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 234 | <div class="header-bottom-container" style="margin:0px auto;max-width:600px;"> |
| 235 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 236 | style="width:100%;"> |
| 237 | <tbody> |
| 238 | <tr> |
| 239 | <td style="direction:ltr;font-size:0px;padding:0;text-align:center;"> |
| 240 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]--> |
| 241 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 242 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 243 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 244 | style="vertical-align:top;" width="100%"> |
| 245 | <tbody> |
| 246 | <tr> |
| 247 | <td align="center" class="date-title-text" |
| 248 | style="font-size:0px;padding:6px 0 0 0;word-break:break-word;"> |
| 249 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td height="32px" style="vertical-align:top;height:32px;"><![endif]--> |
| 250 | <div |
| 251 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:16px;letter-spacing:0.03em;line-height:1.5;text-align:center;text-transform:uppercase;color:<?php echo $colors['3']; ?>;height:32px;"> |
| 252 | <?php echo esc_html($date); ?></div> |
| 253 | <!--[if mso | IE]></td></tr></table><![endif]--> |
| 254 | </td> |
| 255 | </tr> |
| 256 | </tbody> |
| 257 | </table> |
| 258 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 259 | </td> |
| 260 | </tr> |
| 261 | </tbody> |
| 262 | </table> |
| 263 | </div> |
| 264 | <!--[if mso | IE]></td></tr></table><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 265 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 266 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 267 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 268 | <tbody> |
| 269 | <tr> |
| 270 | <td style="direction:ltr;font-size:0px;padding:12px 0 0 0;text-align:center;"> |
| 271 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]--> |
| 272 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 273 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 274 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 275 | style="vertical-align:top;" width="100%"> |
| 276 | <tbody> |
| 277 | <tr> |
| 278 | <td align="left" |
| 279 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 280 | <div |
| 281 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:21px;font-weight:700;line-height:1;text-align:left;color:#000000;"> |
| 282 | <mj-raw><?php esc_html_e('Performance Overview', 'independent-analytics'); ?></mj-raw></div> |
| 283 | </td> |
| 284 | </tr> |
| 285 | <tr> |
| 286 | <td align="center" class="heading-divider" |
| 287 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 288 | <p |
| 289 | style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:100%;"> |
| 290 | </p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:550px;" role="presentation" width="550px" ><tr><td style="height:0;line-height:0;"> |
| 291 | </td></tr></table><![endif]--> |
| 292 | </td> |
| 293 | </tr> |
| 294 | </tbody> |
| 295 | </table> |
| 296 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 297 | </td> |
| 298 | </tr> |
| 299 | </tbody> |
| 300 | </table> |
| 301 | </div><!--[if mso | IE]></td></tr></table><![endif]--> <?php for($x = 0; $x < count($stats); $x++) : |
| 302 | $stat = $stats[$x]; |
| 303 | if ($x % 2 == 0) : ?> |
| 304 | <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 305 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 306 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 307 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 308 | <tbody> |
| 309 | <tr> |
| 310 | <td style="direction:ltr;font-size:0px;padding:12px 12px 0 12px;text-align:center;"> |
| 311 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><![endif]--> |
| 312 | <?php endif;?> |
| 313 | <!--[if mso | IE]><td class="" style="vertical-align:top;width:288px;" ><![endif]--> |
| 314 | <div class="mj-column-per-50 mj-outlook-group-fix" |
| 315 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 316 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 317 | width="100%"> |
| 318 | <tbody> |
| 319 | <tr> |
| 320 | <td style="vertical-align:top;padding:6px;"> |
| 321 | <table border="0" cellpadding="0" cellspacing="0" |
| 322 | role="presentation" width="100%"> |
| 323 | <tbody> |
| 324 | <tr> |
| 325 | <td align="left" class="quick-stat-title" |
| 326 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 327 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td height="15px" style="vertical-align:top;height:15px;"><![endif]--> |
| 328 | <div |
| 329 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:14px;line-height:1;text-align:left;color:#000000;height:15px;"> |
| 330 | <mj-raw><?php echo esc_html($stat->name()); ?></mj-raw></div> |
| 331 | <!--[if mso | IE]></td></tr></table><![endif]--> |
| 332 | </td> |
| 333 | </tr> |
| 334 | <tr> |
| 335 | <td align="left" class="quick-stat-value" |
| 336 | style="font-size:0px;padding:12px 24px 11px;word-break:break-word;"> |
| 337 | <div |
| 338 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:24px;line-height:1;text-align:left;color:#000000;"> |
| 339 | <mj-raw><?php echo wp_kses($stat->formatted_value(), ['span' => []]); ?></mj-raw></div> |
| 340 | </td> |
| 341 | </tr> <?php |
| 342 | if ($stat->growth_html_class() == 'bad' || $stat->growth_html_class() == 'down bad') : |
| 343 | ?> <tr> |
| 344 | <td align="left" |
| 345 | style="font-size:0px;padding:0 24px 12px;word-break:break-word;"> |
| 346 | <div |
| 347 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:16px;line-height:1;text-align:left;color:#D93B29;"> |
| 348 | <mj-raw><?php echo $stat->growth(); ?>%</mj-raw></div> |
| 349 | </td> |
| 350 | </tr> <?php else : ?> <tr> |
| 351 | <td align="left" |
| 352 | style="font-size:0px;padding:0 24px 12px;word-break:break-word;"> |
| 353 | <div |
| 354 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:16px;line-height:1;text-align:left;color:#36B366;"> |
| 355 | <mj-raw><?php echo $stat->growth(); ?>%</mj-raw></div> |
| 356 | </td> |
| 357 | </tr> <?php endif; ?> |
| 358 | </tbody> |
| 359 | </table> |
| 360 | </td> |
| 361 | </tr> |
| 362 | </tbody> |
| 363 | </table> |
| 364 | </div><!--[if mso | IE]></td><![endif]--> <?php if ($x % 2 != 0 || $x == count($stats) - 1) : ?> |
| 365 | <!--[if mso | IE]></tr></table><![endif]--> |
| 366 | </td> |
| 367 | </tr> |
| 368 | </tbody> |
| 369 | </table> |
| 370 | </div><!--[if mso | IE]></td></tr></table><![endif]--> <?php endif; ?><?php endfor; ?> |
| 371 | <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 372 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 373 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 374 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 375 | <tbody> |
| 376 | <tr> |
| 377 | <td style="direction:ltr;font-size:0px;padding:6px 0 6px 0;text-align:center;"> |
| 378 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]--> |
| 379 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 380 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 381 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 382 | style="vertical-align:top;" width="100%"> |
| 383 | <tbody> |
| 384 | <tr> |
| 385 | <td align="left" |
| 386 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 387 | <div |
| 388 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:21px;font-weight:700;line-height:1;text-align:left;color:#000000;"> |
| 389 | <mj-raw><?php echo esc_html($chart_title); ?></mj-raw></div> |
| 390 | </td> |
| 391 | </tr> |
| 392 | <tr> |
| 393 | <td align="center" class="heading-divider" |
| 394 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 395 | <p |
| 396 | style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:100%;"> |
| 397 | </p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:550px;" role="presentation" width="550px" ><tr><td style="height:0;line-height:0;"> |
| 398 | </td></tr></table><![endif]--> |
| 399 | </td> |
| 400 | </tr> |
| 401 | </tbody> |
| 402 | </table> |
| 403 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 404 | </td> |
| 405 | </tr> |
| 406 | </tbody> |
| 407 | </table> |
| 408 | </div> |
| 409 | <!--[if mso | IE]></td></tr></table><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 410 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 411 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 412 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 413 | <tbody> |
| 414 | <tr> |
| 415 | <td style="direction:ltr;font-size:0px;padding:12px 0 12px;text-align:center;"> |
| 416 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="width:600px;" ><![endif]--> |
| 417 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 418 | style="font-size:0;line-height:0;text-align:left;display:inline-block;width:100%;direction:ltr;"> |
| 419 | <!--[if mso | IE]><table border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td style="vertical-align:top;width:60px;" ><![endif]--> |
| 420 | <div class="mj-column-per-10 mj-outlook-group-fix y-axis" |
| 421 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:10%;"> |
| 422 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 423 | width="100%"> |
| 424 | <tbody> |
| 425 | <tr> |
| 426 | <td |
| 427 | style="border-right:solid 2px #ECE9F2;vertical-align:top;padding:0;"> |
| 428 | <table border="0" cellpadding="0" cellspacing="0" |
| 429 | role="presentation" width="100%"> |
| 430 | <tbody> |
| 431 | <tr> |
| 432 | <td align="left" |
| 433 | style="font-size:0px;padding:0 6px 20px 0;word-break:break-word;"> |
| 434 | <table cellpadding="0" cellspacing="0" |
| 435 | width="100%" border="0" |
| 436 | style="color:#000000;font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:13px;line-height:22px;table-layout:auto;width:100%;border:none;"> |
| 437 | <tr align="right" height="67px" |
| 438 | style="height: 67px"> |
| 439 | <td |
| 440 | style="vertical-align: top; line-height: 1;"> |
| 441 | <mj-raw><?php echo esc_html($y_labels['0']); ?></mj-raw> |
| 442 | </td> |
| 443 | </tr> |
| 444 | <tr align="right" height="67px" |
| 445 | style="height: 67px"> |
| 446 | <td><mj-raw><?php echo esc_html($y_labels['1']); ?></mj-raw> |
| 447 | </td> |
| 448 | </tr> |
| 449 | <tr align="right" height="67px" |
| 450 | vertical-align="bottom" |
| 451 | style="height: 67px"> |
| 452 | <td |
| 453 | style="vertical-align: bottom; line-height: 1;"> |
| 454 | <span |
| 455 | vertical-align="bottom"><mj-raw><?php echo esc_html($y_labels['2']); ?></mj-raw></span> |
| 456 | </td> |
| 457 | </tr> |
| 458 | </table> |
| 459 | </td> |
| 460 | </tr> |
| 461 | </tbody> |
| 462 | </table> |
| 463 | </td> |
| 464 | </tr> |
| 465 | </tbody> |
| 466 | </table> |
| 467 | </div><!--[if mso | IE]></td><td style="vertical-align:top;width:540px;" ><![endif]--> |
| 468 | <div class="mj-column-per-90 mj-outlook-group-fix chart-container" |
| 469 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:90%;"> |
| 470 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 471 | width="100%"> |
| 472 | <tbody> |
| 473 | <tr> |
| 474 | <td style="vertical-align:top;padding:0;"> |
| 475 | <table border="0" cellpadding="0" cellspacing="0" |
| 476 | role="presentation" width="100%"> |
| 477 | <tbody> |
| 478 | <tr> |
| 479 | <td align="left" |
| 480 | style="font-size:0px;padding:0 24px 16px 8px;word-break:break-word;"> |
| 481 | <table cellpadding="0" cellspacing="0" |
| 482 | width="100%" border="0" |
| 483 | style="color:#000000;font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:13px;line-height:22px;table-layout:auto;width:100%;border:none;"> |
| 484 | <tr class="bar-chart-row" height="200" |
| 485 | style="height: 200px; position:"> |
| 486 | <?php |
| 487 | for ($x = 0; $x < count($chart_views); $x++) : |
| 488 | if (count($chart_views) == 24) { |
| 489 | $color = ($x + 6) % 6 == 0 ? $colors['5'] : $colors['4']; |
| 490 | } elseif (count($chart_views) == 7) { |
| 491 | $color = $x % 2 == 0 ? $colors['4'] : $colors['5']; |
| 492 | } else { |
| 493 | $color = ($x + 5) % 5 == 0 ? $colors['5'] : $colors['4']; |
| 494 | } |
| 495 | if ($chart_views[$x] == 0) { |
| 496 | $height = 0; |
| 497 | } else { |
| 498 | $height = round(($chart_views[$x] / $most_views) * 200); |
| 499 | } ?> <td height="200" |
| 500 | style="height: 200px; padding: 2px; vertical-align: bottom;"> |
| 501 | <!--[if mso]><?php echo '<table height="200"><tr><td height="' . esc_attr($height) . '" style="background-color: ' . esc_attr($color) . '; height: ' . esc_attr($height) . 'px; width: 100%; color: ' . esc_attr($color) . '">A</td></tr></table>'; ?><![endif]--> |
| 502 | <?php |
| 503 | echo '<div height="' . esc_attr($height) . '" style="background-color: ' . esc_attr($color) . '; height: ' . esc_attr($height) . 'px; width: 100%"></div>'; |
| 504 | ?> <span |
| 505 | style="display: none; white-space: nowrap; width: 0; height: 0; line-height: 1.45; font-size: 12px;"> |
| 506 | <?php echo number_format_i18n($chart_views[$x], 0); ?> </span></td> |
| 507 | <?php endfor; ?> </tr> |
| 508 | </table> |
| 509 | </td> |
| 510 | </tr> |
| 511 | <tr> |
| 512 | <td align="center" class="chart-border" |
| 513 | style="font-size:0px;padding:0 24px 0 0;word-break:break-word;"> |
| 514 | <p |
| 515 | style="border-top:solid 2px #ECE9F2;font-size:1px;margin:0px auto;width:100%;"> |
| 516 | </p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px #ECE9F2;font-size:1px;margin:0px auto;width:516px;" role="presentation" width="516px" ><tr><td style="height:0;line-height:0;"> |
| 517 | </td></tr></table><![endif]--> |
| 518 | </td> |
| 519 | </tr> |
| 520 | <tr> |
| 521 | <td align="left" |
| 522 | style="font-size:0px;padding:2px 24px 0 4px;word-break:break-word;"> |
| 523 | <table cellpadding="0" cellspacing="0" |
| 524 | width="100%" border="0" |
| 525 | style="color:#000000;font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:13px;line-height:22px;table-layout:auto;width:100%;border:none;"> |
| 526 | <tr><mj-raw><?php foreach ($x_labels as $date) : ?></mj-raw> |
| 527 | <td style="width: <?php echo 100 / count($x_labels); ?>%;" |
| 528 | class="chart-date-label"> |
| 529 | <mj-raw><?php echo esc_html($date); ?></mj-raw> |
| 530 | </td><mj-raw><?php endforeach; ?></mj-raw> |
| 531 | </tr> |
| 532 | </table> |
| 533 | </td> |
| 534 | </tr> |
| 535 | </tbody> |
| 536 | </table> |
| 537 | </td> |
| 538 | </tr> |
| 539 | </tbody> |
| 540 | </table> |
| 541 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 542 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 543 | </td> |
| 544 | </tr> |
| 545 | </tbody> |
| 546 | </table> |
| 547 | </div> |
| 548 | <!--[if mso | IE]></td></tr></table><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 549 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 550 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 551 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 552 | <tbody> |
| 553 | <tr> |
| 554 | <td style="direction:ltr;font-size:0px;padding:12px 0 0 0;text-align:center;"> |
| 555 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]--> |
| 556 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 557 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 558 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 559 | style="vertical-align:top;" width="100%"> |
| 560 | <tbody> |
| 561 | <tr> |
| 562 | <td align="left" |
| 563 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 564 | <div |
| 565 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:21px;font-weight:700;line-height:1;text-align:left;color:#000000;"> |
| 566 | <mj-raw><?php esc_html_e("Top 10's", 'independent-analytics'); ?></mj-raw></div> |
| 567 | </td> |
| 568 | </tr> |
| 569 | <tr> |
| 570 | <td align="center" class="heading-divider" |
| 571 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 572 | <p |
| 573 | style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:100%;"> |
| 574 | </p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px <?php echo $colors['6']; ?>;font-size:1px;margin:0px auto;width:550px;" role="presentation" width="550px" ><tr><td style="height:0;line-height:0;"> |
| 575 | </td></tr></table><![endif]--> |
| 576 | </td> |
| 577 | </tr> |
| 578 | </tbody> |
| 579 | </table> |
| 580 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 581 | </td> |
| 582 | </tr> |
| 583 | </tbody> |
| 584 | </table> |
| 585 | </div><!--[if mso | IE]></td></tr></table><![endif]--> <?php |
| 586 | $x = 0; |
| 587 | foreach($top_ten as $type) : |
| 588 | if ($x % 2 == 0) : ?> |
| 589 | <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" bgcolor="#ffffff" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 590 | <div style="background:#ffffff;background-color:#ffffff;margin:0px auto;max-width:600px;"> |
| 591 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 592 | style="background:#ffffff;background-color:#ffffff;width:100%;"> |
| 593 | <tbody> |
| 594 | <tr> |
| 595 | <td |
| 596 | style="direction:ltr;font-size:0px;padding:20px 0;padding-bottom:0;padding-top:6px;text-align:center;"> |
| 597 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><![endif]--> |
| 598 | <?php endif;?> |
| 599 | <!--[if mso | IE]><td class="" style="vertical-align:top;width:300px;" ><![endif]--> |
| 600 | <div class="mj-column-per-50 mj-outlook-group-fix" |
| 601 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 602 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 603 | style="vertical-align:top;" width="100%"> |
| 604 | <tbody> |
| 605 | <tr> |
| 606 | <td align="left" class="top-ten-table" |
| 607 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 608 | <table cellpadding="0" cellspacing="0" width="100%" border="0" |
| 609 | style="color:#000000;font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:13px;line-height:22px;table-layout:auto;width:100%;border:none;"> |
| 610 | <tr class="table-heading"> |
| 611 | <th align="left"><?php echo $type['title']; ?></th> |
| 612 | <th align="right"><mj-raw><?php |
| 613 | if ($type['title'] == 'Link Patterns') { |
| 614 | esc_html_e('Clicks', 'independent-analytics'); |
| 615 | } elseif ($type['title'] == 'Forms') { |
| 616 | esc_html_e('Submissions', 'independent-analytics'); |
| 617 | } elseif ($type['title'] == 'Landing Pages') { |
| 618 | esc_html_e('Entrances', 'independent-analytics'); |
| 619 | } elseif ($type['title'] == 'Exit Pages') { |
| 620 | esc_html_e('Exits', 'independent-analytics'); |
| 621 | } else { |
| 622 | esc_html_e('Views', 'independent-analytics'); |
| 623 | } |
| 624 | ?></mj-raw></th> |
| 625 | </tr><mj-raw><?php foreach ($type['rows'] as $row) : ?></mj-raw> |
| 626 | <tr> |
| 627 | <td class="name"><mj-raw><?php echo esc_html($row['title']); ?></mj-raw></td> |
| 628 | <td align="right"><mj-raw><?php echo esc_html(number_format_i18n($row['views'])); ?></mj-raw></td> |
| 629 | </tr><mj-raw><?php endforeach; ?></mj-raw> |
| 630 | </table> |
| 631 | </td> |
| 632 | </tr> |
| 633 | </tbody> |
| 634 | </table> |
| 635 | </div><!--[if mso | IE]></td><![endif]--> <?php if ($x % 2 != 0 || $x == count($top_ten) - 1) : ?> |
| 636 | <!--[if mso | IE]><td class="" style="vertical-align:top;width:300px;" ><![endif]--> |
| 637 | <div class="mj-column-per-50 mj-outlook-group-fix" |
| 638 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 639 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 640 | style="vertical-align:top;" width="100%"> |
| 641 | <tbody></tbody> |
| 642 | </table> |
| 643 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 644 | </td> |
| 645 | </tr> |
| 646 | </tbody> |
| 647 | </table> |
| 648 | </div><!--[if mso | IE]></td></tr></table><![endif]--> <?php endif; ?><?php |
| 649 | $x++; |
| 650 | endforeach; ?> |
| 651 | <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="footer-outlook" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> |
| 652 | <div class="footer" style="margin:0px auto;max-width:600px;"> |
| 653 | <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 654 | style="width:100%;"> |
| 655 | <tbody> |
| 656 | <tr> |
| 657 | <td style="direction:ltr;font-size:0px;padding:12px;text-align:center;"> |
| 658 | <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:576px;" ><![endif]--> |
| 659 | <div class="mj-column-per-100 mj-outlook-group-fix" |
| 660 | style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> |
| 661 | <table border="0" cellpadding="0" cellspacing="0" role="presentation" |
| 662 | style="vertical-align:top;" width="100%"> |
| 663 | <tbody> |
| 664 | <tr> |
| 665 | <td align="center" |
| 666 | style="font-size:0px;padding:10px 25px;word-break:break-word;"> |
| 667 | <div |
| 668 | style="font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;font-size:13px;line-height:1.5;text-align:center;"> |
| 669 | <mj-raw><?php |
| 670 | echo esc_html($footer_text); |
| 671 | ?></mj-raw></div> |
| 672 | </td> |
| 673 | </tr> |
| 674 | </tbody> |
| 675 | </table> |
| 676 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 677 | </td> |
| 678 | </tr> |
| 679 | </tbody> |
| 680 | </table> |
| 681 | </div><!--[if mso | IE]></td></tr></table><![endif]--> |
| 682 | </div> |
| 683 | </body> |
| 684 | |
| 685 | </html> |
| 686 |