-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
385 lines (356 loc) · 23.5 KB
/
index.html
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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meta Tag Checker</title>
<meta name="description" content="Meta Tag Checker is a powerful tool to extract meta tags from a given URL for SEO optimization and content management.">
<meta name="keywords" content="Meta Tag Checker, SEO, meta tags, website analysis, SEO tool">
<meta name="author" content="Viggo">
<!-- Favicon and Apple Touch Icons -->
<link rel="icon" href="/assets/favicon/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" sizes="57x57" href="/assets/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/assets/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/assets/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/assets/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/assets/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/assets/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/assets/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/assets/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/assets/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/assets/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon/favicon-16x16.png">
<link rel="manifest" href="/assets/favicon/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/assets/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-ZK9BFXYCQQ"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-ZK9BFXYCQQ');
</script>
<script type="text/javascript">
(function(c,l,a,r,i,t,y){
c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
})(window, document, "clarity", "script", "n7osbgo4cg");
</script>
<!-- Open Graph meta tags for social media sharing -->
<meta property="og:title" content="Meta Tag Checker">
<meta property="og:description" content="Meta Tag Checker is a powerful tool to extract meta tags from a given URL for SEO optimization and content management.">
<meta property="og:image" content="https://www.metatagchecker.com/assets/og-image.png">
<meta property="og:url" content="https://www.metatagchecker.com">
<meta property="og:type" content="website">
<!-- Twitter Card meta tags for social media sharing -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Meta Tag Checker">
<meta name="twitter:description" content="Meta Tag Checker is a powerful tool to extract meta tags from a given URL for SEO optimization and content management.">
<meta name="twitter:image" content="https://www.metatagchecker.com/assets/og-image.png">
<meta name="twitter:site" content="@your_twitter_handle">
<!-- Schema.org structured data for SEO -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "Meta Tag Checker",
"url": "https://www.metatagchecker.com",
"potentialAction": {
"@type": "SearchAction",
"target": "https://www.metatagchecker.com/?q={search_term_string}",
"query-input": "required name=search_term_string"
}
}
</script>
<!-- Preconnect to required origins for performance improvement -->
<link rel="preconnect" href="https://cdn.jsdelivr.net">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<!-- Preload essential CSS files -->
<link rel="preload" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" as="style">
<link rel="preload" href="styles.css" as="style">
<!-- CSS files -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
<link href="styles.css" rel="stylesheet">
</head>
<body class="bg-white">
<header class="bg-white">
<nav class="mx-auto flex max-w-7xl items-center justify-between gap-x-6 p-6 lg:px-8" aria-label="Global">
<div class="flex lg:flex-1 items-center">
<a href="/" class="flex items-center -m-1.5 p-1.5">
<span class="sr-only">Meta Tag Checker</span>
<img class="h-12 w-auto" src="/assets/logo.svg" alt="logo">
<h1 class="pl-2 text-md sm:text-2xl font-extrabold tracking-tight text-slate-900">Meta Tag Checker</h1>
</a>
</div>
<div class="hidden lg:flex lg:gap-x-12">
<a href="/" class="text-sm font-semibold leading-6 text-gray-900">Home</a>
<a href="/seo-guide" class="text-sm font-semibold leading-6 text-gray-900">SEO Guide</a>
<a href="/faq" class="text-sm font-semibold leading-6 text-gray-900">FAQ</a>
<a href="/about" class="text-sm font-semibold leading-6 text-gray-900">About</a>
</div>
<div class="flex flex-1 items-center justify-end gap-x-6">
<div class="flex gap-x-6">
<a class="group" aria-label="Viggo on X" href="https://x.com/decohack" target="_blank"><svg
class="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" aria-hidden="true" viewBox="0 0 24 24">
<path
d="M13.3174 10.7749L19.1457 4H17.7646L12.7039 9.88256L8.66193 4H4L10.1122 12.8955L4 20H5.38119L10.7254 13.7878L14.994 20H19.656L13.3171 10.7749H13.3174ZM11.4257 12.9738L10.8064 12.0881L5.87886 5.03974H8.00029L11.9769 10.728L12.5962 11.6137L17.7652 19.0075H15.6438L11.4257 12.9742V12.9738Z">
</path>
</svg>
</a>
</div>
</div>
<div class="flex lg:hidden">
<button id="mobile-menu-button" type="button"
class="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700">
<span class="sr-only">Open main menu</span>
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
</svg>
</button>
</div>
</nav>
<!-- Mobile menu, show/hide based on menu open state. -->
<div id="mobile-menu" class="hidden lg:hidden" role="dialog" aria-modal="true">
<div class="fixed inset-0 z-10"></div>
<div
class="fixed inset-y-0 right-0 z-10 w-full overflow-y-auto bg-white px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10">
<div class="flex items-center justify-between">
<a href="#" class="-m-1.5 p-1.5">
<span class="sr-only">Meta Tag Checker</span>
<img class="h-8 w-auto" src="/assets/logo.svg" alt="logo">
</a>
<button id="close-menu-button" type="button" class="-m-2.5 rounded-md p-2.5 text-gray-700">
<span class="sr-only">Close menu</span>
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="mt-6 flow-root">
<div class="-my-6 divide-y divide-gray-500/10">
<div class="space-y-2 py-6">
<a href="/"
class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Home</a>
<a href="/seo-guide"
class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">SEO Guide</a>
<a href="/faq"
class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">FAQ</a>
<a href="/about"
class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">About</a>
</div>
<div class="py-6">
<div class="flex gap-x-6"><a class="group" aria-label="Viggo on X" href="https://x.com/decohack" target="_blank"><svg
class="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" aria-hidden="true" viewBox="0 0 24 24">
<path
d="M13.3174 10.7749L19.1457 4H17.7646L12.7039 9.88256L8.66193 4H4L10.1122 12.8955L4 20H5.38119L10.7254 13.7878L14.994 20H19.656L13.3171 10.7749H13.3174ZM11.4257 12.9738L10.8064 12.0881L5.87886 5.03974H8.00029L11.9769 10.728L12.5962 11.6137L17.7652 19.0075H15.6438L11.4257 12.9742V12.9738Z">
</path>
</svg></a>
<!-- <a class="group" aria-label="Viggo on GitHub" href="#">
<svg
class="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" aria-hidden="true" viewBox="0 0 24 24">
<path
d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2Z">
</path>
</svg>
</a> -->
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- hero -->
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-10 text-center">
<h1 class="mx-auto max-w-5xl font-display text-5xl font-bold tracking-tight text-slate-900 sm:text-7xl lh-1-2">
Simple<!-- --> <span class="relative whitespace-nowrap text-blue-600">
<svg aria-hidden="true" viewBox="0 0 418 42" class="absolute left-0 top-2/3 h-[0.58em] w-full" fill="#93c5fdb3"
preserveAspectRatio="none">
<path
d="M203.371.916c-26.013-2.078-76.686 1.963-124.73 9.946L67.3 12.749C35.421 18.062 18.2 21.766 6.004 25.934 1.244 27.561.828 27.778.874 28.61c.07 1.214.828 1.121 9.595-1.176 9.072-2.377 17.15-3.92 39.246-7.496C123.565 7.986 157.869 4.492 195.942 5.046c7.461.108 19.25 1.696 19.17 2.582-.107 1.183-7.874 4.31-25.75 10.366-21.992 7.45-35.43 12.534-36.701 13.884-2.173 2.308-.202 4.407 4.442 4.734 2.654.187 3.263.157 15.593-.78 35.401-2.686 57.944-3.488 88.365-3.143 46.327.526 75.721 2.23 130.788 7.584 19.787 1.924 20.814 1.98 24.557 1.332l.066-.011c1.201-.203 1.53-1.825.399-2.335-2.911-1.31-4.893-1.604-22.048-3.261-57.509-5.556-87.871-7.36-132.059-7.842-23.239-.254-33.617-.116-50.627.674-11.629.54-42.371 2.494-46.696 2.967-2.359.259 8.133-3.625 26.504-9.81 23.239-7.825 27.934-10.149 28.304-14.005.417-4.348-3.529-6-16.878-7.066Z">
</path>
</svg>
<span class="relative">SEO Meta Tag</span></span> <!-- -->Analysis for Website.</h1>
<p class="mt-6 text-lg leading-8 text-gray-600">Enter a URL and click “Analysis” to view results in a table format,
and get an SEO score for the entered website.</p>
<p class="pt-10 text-base font-semibold leading-7 text-gray-900">👇 Just enter your URL</p>
<div class="relative mx-auto mt-10 flex max-w-md gap-0">
<label for="url-input" class="sr-only">URL</label>
<input id="url-input" name="url" type="text" required class="url-tab" placeholder="Enter a URL">
<button id="fetch-button"
class="rounded-r-md bg-blue-600 px-6 py-4 text-md font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Analysis</button>
</div>
</div>
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-10">
<div id="loading" class="hidden flex justify-center items-center">
<div class="loader"></div>
</div>
<div id="result" class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
<div id="meta-results" class="overflow-hidden shadow ring-black ring-opacity-5 sm:rounded-lg">
<!-- Meta tags will be displayed here -->
</div>
</div>
</div>
</div>
<!-- FAQs -->
<div class="bg-white">
<div class="mx-auto max-w-7xl divide-y divide-gray-900/10 px-6 pt-0 pb-16">
<h2 class="text-2xl font-bold leading-10 tracking-tight text-gray-900">Frequently asked questions</h2>
<dl class="mt-10 space-y-8 divide-y divide-gray-900/10">
<div class="pt-8 lg:grid lg:grid-cols-12 lg:gap-8">
<dt class="text-base font-semibold leading-7 text-gray-900 lg:col-span-5">What is a Meta Tag Checker?</dt>
<dd class="mt-4 lg:col-span-7 lg:mt-0">
<p class="text-base leading-7 text-gray-600">A meta tag extractor is a tool that allows users to extract meta tags from a given URL. Meta tags, such as title tags, description tags, and keyword tags, describe a webpage’s content and are located in the HTML document’s head section. These tags are crucial for SEO optimization and content management. By using a meta tag extractor, web developers and SEO professionals can quickly obtain a webpage’s metadata for SEO analysis and content optimization.</p>
</dd>
</div>
<div class="pt-8 lg:grid lg:grid-cols-12 lg:gap-8">
<dt class="text-base font-semibold leading-7 text-gray-900 lg:col-span-5">Features of Meta Tag Checker</dt>
<dd class="mt-4 lg:col-span-7 lg:mt-0">
<p class="text-base leading-7 text-gray-600">The Meta Tag Extractor offers:</p>
<p class="text-base leading-7 text-gray-600">- Extracting Meta Tags: Retrieves title, description, keywords, author, robots, and language tags.</p>
<p class="text-base leading-7 text-gray-600">- User-Friendly Interface: Simple input for URLs to extract meta tags.</p>
<p class="text-base leading-7 text-gray-600">- Multi-Language Support: Handles meta tags from websites in different languages.</p>
<p class="text-base leading-7 text-gray-600">- Batch Extraction: Extracts meta tags from multiple websites with a URL list.</p>
<p class="text-base leading-7 text-gray-600">- CSV Export: Exports data in CSV format for easy analysis.</p>
</dd>
</div>
<div class="pt-8 lg:grid lg:grid-cols-12 lg:gap-8">
<dt class="text-base font-semibold leading-7 text-gray-900 lg:col-span-5">How to Use the Meta Tag Checker?</dt>
<dd class="mt-4 lg:col-span-7 lg:mt-0">
<p class="text-base leading-7 text-gray-600">Using the Meta Tag Checker is easy:</p>
<p class="text-base leading-7 text-gray-600">1. Visit the Meta Tag Checker website.</p>
<p class="text-base leading-7 text-gray-600">2. Enter the webpage URL.</p>
<p class="text-base leading-7 text-gray-600">3. Click “Extract” to generate meta tags.</p>
<p class="text-base leading-7 text-gray-600">4. Review and copy the meta tags.</p>
<p class="text-base leading-7 text-gray-600">5. Paste them into your HTML code.</p>
</dd>
</div>
<div class="pt-8 lg:grid lg:grid-cols-12 lg:gap-8">
<dt class="text-base font-semibold leading-7 text-gray-900 lg:col-span-5">Pros and Cons of Meta Tag Extractor</dt>
<dd class="mt-4 lg:col-span-7 lg:mt-0">
<p class="text-base leading-7 text-gray-600">Pros:</p>
<ul class="list-disc list-inside text-base leading-7 text-gray-600">
<li>Easy to Use: No technical knowledge required.</li>
<li>Fast: Extracts meta tags quickly.</li>
<li>Comprehensive: Provides detailed meta tag information.</li>
<li>Compatible: Works with most browsers.</li>
</ul>
<p class="text-base leading-7 text-gray-600 mt-4">Cons:</p>
<ul class="list-disc list-inside text-base leading-7 text-gray-600">
<li>Single Page: Extracts tags from one page at a time.</li>
<li>No Editing: Cannot modify extracted data.</li>
<li>Limited Customization: No tailored data options.</li>
</ul>
<p class="text-base leading-7 text-gray-600 mt-4">For more SEO tips, check <a href="https://moz.com/beginners-guide-to-seo" class="text-blue-600" target="_blank">Moz’s Beginner’s Guide to SEO</a> and <a href="https://developers.google.com/search/docs/beginner/seo-starter-guide" class="text-blue-600" target="_blank">Google’s SEO Starter Guide</a>.</p>
</dd>
</div>
</dl>
</div>
</div>
<!-- footer -->
<footer class="bg-slate-50">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="py-8">
<nav class="text-sm" aria-label="quick links">
<div class="-my-1 flex justify-center gap-x-6">
<a class="inline-block rounded-lg px-2 py-1 text-sm text-slate-700 hover:bg-slate-100 hover:text-slate-900"
href="/">Home</a>
<a class="inline-block rounded-lg px-2 py-1 text-sm text-slate-700 hover:bg-slate-100 hover:text-slate-900"
href="/seo-guide">SEO Guide</a>
<a class="inline-block rounded-lg px-2 py-1 text-sm text-slate-700 hover:bg-slate-100 hover:text-slate-900"
href="/faq">FAQ</a>
<a class="inline-block rounded-lg px-2 py-1 text-sm text-slate-700 hover:bg-slate-100 hover:text-slate-900"
href="/about">About</a>
</div>
</nav>
</div>
<div class="flex flex-col items-center border-t border-slate-400/10 py-10 sm:flex-row-reverse sm:justify-between">
<div class="flex gap-x-6">
<a class="group" aria-label="Viggo on X" href="https://x.com/decohack" target="_blank">
<svg
class="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" aria-hidden="true" viewBox="0 0 24 24">
<path
d="M13.3174 10.7749L19.1457 4H17.7646L12.7039 9.88256L8.66193 4H4L10.1122 12.8955L4 20H5.38119L10.7254 13.7878L14.994 20H19.656L13.3171 10.7749H13.3174ZM11.4257 12.9738L10.8064 12.0881L5.87886 5.03974H8.00029L11.9769 10.728L12.5962 11.6137L17.7652 19.0075H15.6438L11.4257 12.9742V12.9738Z">
</path>
</svg>
<!-- </a>
<a class="group" aria-label="Viggo on GitHub" href="#"><svg
class="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" aria-hidden="true" viewBox="0 0 24 24">
<path
d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2Z">
</path>
</svg>
</a> -->
</div>
<p class="mt-6 text-sm text-slate-500 sm:mt-0">Copyright © <span id="current-year"></span> Viggo. All rights reserved.</p>
</div>
</div>
</footer>
<div id="toast">Content copied to clipboard</div>
<!-- Modal Container -->
<div id="error-modal" class="fixed z-10 inset-0 overflow-y-auto hidden" aria-labelledby="modal-title" role="dialog"
aria-modal="true">
<div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" aria-hidden="true"></div>
<!-- Modal Panel -->
<div
class="inline-block align-bottom bg-white rounded-lg px-4 pt-5 pb-4 text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full sm:p-6">
<div class="hidden sm:block absolute top-0 right-0 pt-4 pr-4">
<button type="button"
class="bg-white rounded-md text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
onclick="closeModal()">
<span class="sr-only">Close</span>
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="sm:flex sm:items-start">
<div
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-red-100 sm:mx-0 sm:h-10 sm:w-10">
<svg class="h-6 w-6 text-red-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</div>
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
<h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">Error fetching meta
tags</h3>
<div class="mt-2">
<p class="text-sm text-gray-500" id="modal-message">An error occurred while fetching meta
tags.</p>
</div>
</div>
</div>
<div class="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<button type="button"
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
onclick="closeModal()">Close</button>
</div>
</div>
</div>
</div>
<script src="scripts.js"></script>
<script>
document.getElementById('mobile-menu-button').addEventListener('click', function () {
document.getElementById('mobile-menu').classList.toggle('hidden');
});
document.getElementById('close-menu-button').addEventListener('click', function () {
document.getElementById('mobile-menu').classList.add('hidden');
});
</script>
<script>
document.getElementById("current-year").textContent = new Date().getFullYear();
</script>
</body>
</html>