Add og-image.png

Update Open Graph meta tags
This commit is contained in:
Adam Iannazzone 2024-10-30 10:07:59 -04:00
parent 1ddc9544d8
commit 6a6f90ce86
2 changed files with 40 additions and 29 deletions

BIN
assets/og-image.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 KiB

View file

@ -5,17 +5,24 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>RetroDECK</title>
<meta name="description"
content="RetroDECK is a polished and beginner-friendly environment for playing your retro games on Steam Deck, available with just one click from the Discover app.">
<meta property="og:title" content="RetroDECK" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://retrodeck.net" />
<meta property="og:image" content="https://retrodeck.net/assets/screens/screen03.png" />
<meta name="og:description"
content="RetroDECK is a polished and beginner-friendly environment for playing your retro games on Steam Deck, available with just one click from the Discover app." />
<!-- Facebook Meta Tags -->
<meta property="og:url" content="https://retrodeck.github.io/RetroDECK-Website/">
<meta property="og:title" content="RetroDECK">
<meta property="og:description"
content="RetroDECK is a polished and beginner-friendly environment for playing your retro games on Steam Deck, available with just one click from the Discover app.">
<meta property="og:image" content="https://retrodeck.net/assets/og-image.png">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="retrodeck.github.io">
<meta property="twitter:url" content="https://retrodeck.github.io/RetroDECK-Website/">
<meta name="twitter:title" content="RetroDECK">
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="">
<meta name="twitter:description"
content="RetroDECK is a polished and beginner-friendly environment for playing your retro games on Steam Deck, available with just one click from the Discover app.">
<meta name="twitter:image" content="https://retrodeck.net/assets/og-image.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="assets/rd-icons/icon_circle_2_180x180.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/rd-icons/icon_circle_16x16.png">
@ -114,8 +121,8 @@
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="https://github.com/RetroDECK/RetroDECK"
target="_blank" rel="noopener noreferrer">
<a class="dropdown-item" href="https://github.com/RetroDECK/RetroDECK" target="_blank"
rel="noopener noreferrer">
<svg role="img" height="1rem" class="pe-2" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<title>GitHub</title>
@ -125,8 +132,8 @@
</a>
</li>
<li>
<a class="dropdown-item" href="https://github.com/RetroDECK/Cooker"
target="_blank" rel="noopener noreferrer">
<a class="dropdown-item" href="https://github.com/RetroDECK/Cooker" target="_blank"
rel="noopener noreferrer">
<svg role="img" height="1rem" class="pe-2" xmlns="http://www.w3.org/2000/svg"
fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
<path
@ -149,9 +156,9 @@
</li>
</ul>
<span class="navbar-text form-check form-switch">
<input class="form-check-input" id="pixel-font-switch" type="checkbox" role="switch"
id="reduceMotionSwitch" checked onchange="pixelFontToggle()">
<label class="form-check-label" for="reduceMotionSwitch">Retro Fonts</label>
<input class="form-check-input" id="pixel-font-switch" type="checkbox" role="switch"
id="reduceMotionSwitch" checked onchange="pixelFontToggle()">
<label class="form-check-label" for="reduceMotionSwitch">Retro Fonts</label>
</span>
</div>
</div>
@ -164,10 +171,10 @@
<div class="container mb-4">
<div class="row">
<div class="col-12">
<img class="img-fluid" src="assets/screens/logo-on-steamdeck.png"/>
<img class="img-fluid" src="assets/screens/logo-on-steamdeck.png" />
</div>
</div>
</div>
</div>
<!-- Stop Killing Games -->
<div class="container px-2">
@ -376,33 +383,35 @@
<div class="col-9">
<p>Enable cheats in all supported emulators.</p>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row py-0 align-items-center">
<div class="col-3 text-center">
<img class="img-fluid" src="assets/feature-icons/card_place.png">
</div>
<div class="col-9">
<p>Use the ES-DE frontend to easily import screenshots and metadata for your library.</p>
<p>Use the ES-DE frontend to easily import screenshots and metadata for your
library.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row py-0 align-items-center">
<div class="col-3 text-center">
<img class="img-fluid" src="assets/feature-icons/award.png">
</div>
<div class="col-9">
<p>Connect with RetroAchievements and get credit for all of your amazing accomplishments.</p>
<p>Connect with RetroAchievements and get credit for all of your amazing
accomplishments.</p>
</div>
</div>
</div>
</div>
<!-- End Extra Features Row 1 -->
<hr class="d-none d-md-block"/>
<hr class="d-none d-md-block" />
<!-- Extra Features Row 2 -->
<div class="row py-0 align-items-center">
<div class="col-md-4">
@ -413,20 +422,21 @@
<div class="col-9">
<p>Easily install on other Linux distributions.</p>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row py-0 align-items-center">
<div class="col-3 text-center">
<img class="img-fluid" src="assets/feature-icons/spinner.png">
</div>
<div class="col-9">
<p>Use the custom controller template for quick access to emulator settings with the touchpad.</p>
<p>Use the custom controller template for quick access to emulator settings with
the touchpad.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row py-0 align-items-center">
<div class="col-3 text-center">
@ -506,7 +516,8 @@
<div class="row justify-content-between">
<div class="col">
<div class="text-center">
Some icons courtesy of <a target="_blank" rel="noopener noreferrer" href="https://kenney.nl/">Kenney.nl</a>.
Some icons courtesy of <a target="_blank" rel="noopener noreferrer"
href="https://kenney.nl/">Kenney.nl</a>.
</div>
</div>
</div>