tag.ejs 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!DOCTYPE html>
  2. <html lang="<%= lang %>">
  3. <head>
  4. <%- include('common-meta') %>
  5. <link rel="stylesheet" href="/stylesheets/styles.css">
  6. <link rel="stylesheet" href="/stylesheets/header.css">
  7. <link rel="stylesheet" href="/stylesheets/tag.css">
  8. <% if (data.length> 0) { %>
  9. <script type="application/ld+json">
  10. {
  11. "@context": "https://schema.org",
  12. "@type": "WebPage",
  13. "name": "<%= title %>",
  14. "description": "<%= description %>",
  15. "url": "https://art.pcoloring.com<%= uri %>",
  16. "mainEntityOfPage": "https://art.pcoloring.com<%= uri %>",
  17. "publisher": {
  18. "@type": "Organization",
  19. "name": "JCCY",
  20. "logo": {
  21. "@type": "ImageObject",
  22. "url": "https://art.pcoloring.com/assets/icon/icon.webp"
  23. }
  24. },
  25. "image": "<%= data[0].thumb %>",
  26. "thumbnailUrl": "<%= data[0].thumb %>",
  27. "keywords": "coloring pages tags, girl coloring page, animal coloring page, flower coloring page, fish coloring page, bird coloring page, printable, free coloring pages, art, color by number, paint by number",
  28. "contentRating": "General Audience",
  29. "hasPart": [
  30. <% for(let i = 0; i < Math.min(6, data.length); i++) { %>
  31. {
  32. "@type": "ImageObject",
  33. "name": "<%= data[i].title %>",
  34. "url": "https://art.pcoloring.com<%= data[i].uri %>",
  35. "contentUrl": "<%= data[i].thumb %>",
  36. "thumbnailUrl": "<%= data[i].thumb %>",
  37. "height": "480",
  38. "width": "480"
  39. }<%= i < Math.min(6, data.length) - 1 ? ',' : '' %>
  40. <% }; %>
  41. ]
  42. }
  43. </script>
  44. <% } %>
  45. </head>
  46. <!-- Google tag (gtag.js) -->
  47. <script async src="https://www.googletagmanager.com/gtag/js?id=G-JBGGVGLHTP"></script>
  48. <script>
  49. window.dataLayer = window.dataLayer || [];
  50. function gtag() { dataLayer.push(arguments); }
  51. gtag('js', new Date());
  52. gtag('config', 'G-JBGGVGLHTP');
  53. </script>
  54. <body>
  55. <%- include('header') %>
  56. <h1 style="display: flex; justify-content: center; padding: 10px; color: purple">
  57. <%= title %>
  58. </h1>
  59. <!-- <h2 style="display: flex; justify-content: center; padding: 0px 10px 10px 10px; color: #333">
  60. <%= description %>
  61. </h2> -->
  62. <div class="content">
  63. <div class="image-grid">
  64. <% data.forEach(item=> { %>
  65. <div class="image-card">
  66. <a href="<%= item.uri %>"><img src="<%= item.thumb %>" alt="<%= item.title %>"></a>
  67. <div class="card-title"><%= item.title %></div>
  68. </div>
  69. <% }); %>
  70. </div>
  71. </div>
  72. <%- include('pagination') %>
  73. <div class="tag-cloud">
  74. <% tags.forEach(item=> { %>
  75. <a href="/<%= lang %>/tag/<%= item.tag %>" class="tag <%= item.tag == tag ? 'selected' : '' %>"
  76. style="color: <%= item.color %>;">
  77. <%= item.tag %>
  78. </a>
  79. <% }); %>
  80. </div>
  81. </body>
  82. </html>