Skip to content

Commit

Permalink
new meta tags and style
Browse files Browse the repository at this point in the history
  • Loading branch information
@Sneffel
Sneffel committed Sep 6, 2024
1 parent 8a50f77 commit f73205e
Show file tree
Hide file tree
Showing 4 changed files with 260 additions and 223 deletions.
202 changes: 111 additions & 91 deletions extra/configurazione-alias-gmail.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,26 @@
<link rel="icon" type="image/webp" sizes="16x16" href="../favicon-16x16.png">
<link rel="manifest" href="../site.webmanifest">
<script src="zoom.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.amber.min.css">

<link href="style.css" rel="stylesheet">

<meta name="description"
content="Guide to configure Gmail alias email. Step-by-step instructions to set up email aliases and improve your Gmail experience.">
<meta name="keywords" content="Gmail, email alias, Gmail configuration, email setup, email tutorial">
<meta property="og:title" content="Alias Email Configuration Gmail">
<meta property="og:description"
content="Guide to configure Gmail alias email. Step-by-step instructions to set up email aliases and improve your Gmail experience.">
<meta property="og:image" content="https://brunoneureiter.com/extra/img/gmail2.png">
<meta property="og:url" content="https://brunoneureiter.com/extra/configurazione-alias-gmail.html">
<meta property="og:type" content="article">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Alias Email Configuration Gmail">
<meta name="twitter:description"
content="Guide to configure Gmail alias email. Step-by-step instructions to set up email aliases and improve your Gmail experience.">
<meta name="twitter:image" content="https://brunoneureiter.com/extra/img/gmail2.png">
<meta name="twitter:url" content="https://brunoneureiter.com/extra/configurazione-alias-gmail.html">

</head>

<body>
Expand All @@ -30,109 +46,113 @@
d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z" />
</symbol>
</svg>
<header class="container">
<h1>Configurazione alias Gmail</h1>
<h3>Guida passo per passo</h3>
<p>Guida aggiornata al 2024 basata sulla guida <a
href="http://miki92.altervista.org/altervista/guide/alias/come-utilizzare-alias-mail-con-gmail-versione-2015.php"
rel="external nofollow"> di miki92</a></p>
<p class="text-ital">Tempo di completamento: 5 minuti</p>
</header>
<main class="container">

<h1>Configurazione alias Gmail</h1>
<h3>Guida passo per passo</h3>
<p>Guida aggiornata al 2024 basata sulla guida <a
href="http://miki92.altervista.org/altervista/guide/alias/come-utilizzare-alias-mail-con-gmail-versione-2015.php"
rel="external nofollow"> di miki92</a></p>
<p class="text-ital">Tempo di completamento: 5 minuti</p>
<h2>1. Se non hai già configurato la verifica in due passaggi, vai a <a target="_blank"
href="https://accounts.google.com/b/0/SmsAuthSettings" rel="external nofollow">Verifica in due passaggi</a> col
tuo account
di Google/Gmail <span class="fs-5 btn-group-vertical">(sennò passa prossimo punto)</span></h2>
<div class="two-columns">
<h3>Premi "Inizia", accedi di nuovo, e segui le istruzioni:</h3>
<ol class="d-inline-block text-start">
<li>Verifica il numero di cellulare (o <i>Mostra altre opzioni</i> per usare un cellulare collegato)</li>
<li>Convalida pin (o conferma sul cellulare)</li>
<li><strong>Attiva</strong></li>
</ol>
<p>Una volta terminato il processo seguendo la procedura guidata, procedi al prossimo passaggio.</p>
<h2>1. Se non hai già configurato la verifica in due passaggi, vai a <a target="_blank"
href="https://accounts.google.com/b/0/SmsAuthSettings" rel="external nofollow">Verifica in due passaggi</a> col
tuo account
di Google/Gmail <span class="fs-5 btn-group-vertical">(sennò passa prossimo punto)</span></h2>
<div class="two-columns">
<h3>Premi "Inizia", accedi di nuovo, e segui le istruzioni:</h3>
<ol class="d-inline-block text-start">
<li>Verifica il numero di cellulare (o <i>Mostra altre opzioni</i> per usare un cellulare collegato)</li>
<li>Convalida pin (o conferma sul cellulare)</li>
<li><strong>Attiva</strong></li>
</ol>
<p>Una volta terminato il processo seguendo la procedura guidata, procedi al prossimo passaggio.</p>
<!-- <img src="img/gmail1.png" alt="gmail1"> -->
</div>
<!-- <p>Se l'avevi già configurata in precedenza comparirà questa schermata:</p>
<img src="img/Screenshot 2024-03-07 at 19-20-18 2-Step Verification.png" class="zoomE" alt="2-Step Verification.png"> -->
<h2>2. Apri la pagina <a href="https://myaccount.google.com/signinoptions/two-step-verification" target="_blank">impostazioni
password</a>. Naviga in basso verso
<strong>Password per le app</strong>
</h2>
<div class="two-columns"><img src="img/gmail2.png" alt="gmail2" class="rounded">
</div>
<!-- <p>Se l'avevi già configurata in precedenza comparirà questa schermata:</p>
<img src="img/Screenshot 2024-03-07 at 19-20-18 2-Step Verification.png" class="zoomE" alt="2-Step Verification.png"> -->
<h2>2. Apri la pagina <a href="https://myaccount.google.com/signinoptions/two-step-verification"
target="_blank">impostazioni
password</a>. Naviga in basso verso
<strong>Password per le app</strong>
</h2>
<h2>3. Clicca la freccina a destra</h2>
</div>
<h2>4. Dove c'è scritto <strong>Nome dell'app</strong> scrivi un nome a caso, va bene l'indirizzo email da configurare
</h2>
<h3>Premi <strong>Crea</strong></h3>
<h2>5. Copia subito la password di 16 caratteri in un blocco note/file (o abbi cura di non chiudere la scheda) senza
gli spazi tra un carattere e l'altro o alla fine. Non
premere Fine</h2>
<p>Questa password servirà solo fino alla fine di questa configurazione</p>
<h2>6. Apri <a href="https://mail.google.com/" target="_blank">Gmail</a> in una nuova scheda, e apri le impostazioni
avanzate:</h2>
<ol class="d-inline-block text-start">
<li>Rotellina <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-gear-fill" viewBox="0 0 16 16">
<path
d="M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z" />
</svg></li>
<li><button class="btn btn-outline-dark text-white ">Visualizza tutte le impostazioni</button></li>
</ol>
<h2>7. Seleziona la scheda Account e importazione</h2>
<img src="img/gmail3.png" class="zoomE rounded" alt="gmail 3">
<h2>8. Nella (quarta) sezione (<b>Invia messaggio come:</b>), sotto alle mail esistenti clicca sul
collegamento<br><span class="text-primary ">Aggiungi un altro indirizzo email</span></h2>
<div class="two-columns">
<p>Si aprirà una finestra. Compila i dati</p>
<ul class="text-start mx-auto d-inline-block">
<li><b>Nome</b>: il nome che vuoi che la tua corrispondenza visualizzi sullo schermo</li>
<li><b>Indirizzo email</b>: l'indirizzo da collegare</li>
</ul>
<p>Assicurati che la casella <i>Considera come un alias.</i> sia selezionata <input type="checkbox" checked> e premi
<strong>Passaggio successivo</strong>
</p>
</div>
<img src="img/gmail2.png" alt="gmail2" class="rounded">

<div class="container">
<div class="alert alert-danger d-block my-2 alert-dismissible fade show" role="alert">
<svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:">
<use xlink:href="#exclamation-triangle-fill" />
</svg>
Attenzione al passaggio successivo!
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
<h2>4. Dove c'è scritto <strong>Nome dell'app</strong> scrivi un nome a caso, va bene l'indirizzo email da
configurare
</h2>
<h3>Premi <strong>Crea</strong></h3>
<h2>5. Copia subito la password di 16 caratteri in un blocco note/file (o abbi cura di non chiudere la scheda) senza
gli spazi tra un carattere e l'altro o alla fine. Non
premere Fine</h2>
<p>Questa password servirà solo fino alla fine di questa configurazione</p>
<h2>6. Apri <a href="https://mail.google.com/" target="_blank">Gmail</a> in una nuova scheda, e apri le impostazioni
avanzate:</h2>
<ol class="d-inline-block text-start">
<li>Rotellina <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-gear-fill" viewBox="0 0 16 16">
<path
d="M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z" />
</svg></li>
<li><button class="btn btn-outline-dark text-white ">Visualizza tutte le impostazioni</button></li>
</ol>
<h2>7. Seleziona la scheda Account e importazione</h2>
<img src="img/gmail3.png" class="zoomE rounded" alt="gmail 3">
<h2>8. Nella (quarta) sezione (<b>Invia messaggio come:</b>), sotto alle mail esistenti clicca sul
collegamento<br><span class="text-primary ">Aggiungi un altro indirizzo email</span></h2>
<div class="two-columns">
<p>Si aprirà una finestra. Compila i dati</p>
<ul class="text-start mx-auto d-inline-block">
<li><b>Nome</b>: il nome che vuoi che la tua corrispondenza visualizzi sullo schermo</li>
<li><b>Indirizzo email</b>: l'indirizzo da collegare</li>
</ul>
<p>Assicurati che la casella <i>Considera come un alias.</i> sia selezionata <input type="checkbox" checked> e
premi
<strong>Passaggio successivo</strong>
</p>
</div>

<div class="container">
<div class="alert alert-danger d-block my-2 alert-dismissible fade show" role="alert">
<svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:">
<use xlink:href="#exclamation-triangle-fill" />
</svg>
Attenzione al passaggio successivo!
</div>
</div>
</div>
<h2>9. Compila come segue:</h2>
<h2>9. Compila come segue:</h2>

<ul class="text-start mx-auto d-inline-block">
<li>Server SMTP: smtp.gmail.com</li>
<li>Porta: 587</li>
<li>Nome utente: [la tua casella di posta gmail]</li>
<li>Password: [la password generata precedentemente, <b>senza spazi</b>]</li>
<li>Connessione protetta: TLS</li>
</ul>
<p>Una volta compilato tutto, clicca su <b><u>Aggiungi account »</u></b>.</p>
<ul class="text-start mx-auto d-inline-block">
<li>Server SMTP: smtp.gmail.com</li>
<li>Porta: 587</li>
<li>Nome utente: [la tua casella di posta gmail]</li>
<li>Password: [la password generata precedentemente, <b>senza spazi</b>]</li>
<li>Connessione protetta: TLS</li>
</ul>
<p>Una volta compilato tutto, clicca su <b><u>Aggiungi account »</u></b>.</p>

<h2>10. Conferma la proprità della mail:</h2>
<ul class="text-start mx-auto d-inline-block">
<li>Chiudi questa finestra</li>
<li>Apri la mail di conferma che è appena arrivata <i>(Conferma Gmail - Invia messaggio come ...)</i></li>
<li>Clicca sul link per confermare</li>
</ul></u>
<h2>10. Conferma la proprità della mail:</h2>
<ul class="text-start mx-auto d-inline-block">
<li>Chiudi questa finestra</li>
<li>Apri la mail di conferma che è appena arrivata <i>(Conferma Gmail - Invia messaggio come ...)</i></li>
<li>Clicca sul link per confermare</li>
</ul></u>

<p class="fs-1">11. FINE</p>
<h2 class="fs-1">11. FINE</h2>
</main>

<div class="container">
<div class="alert alert-primary d-block my-2" role="alert">
<footer class="container">
<div class="alert alert-primary d-block" role="alert">
<svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Info:">
<use xlink:href="#info-fill" />
</svg>
<strong>Se vuoi fare un test, non inviare una mail alla stessa casella di posta.</strong><br>
Mandala a un'altra completamente diversa, altrimenti rimbalzerà indietro
Mandala a una diversa, altrimenti potrebbe rimbalzare indietro
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
</footer>

</body>

</html>
46 changes: 18 additions & 28 deletions extra/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,42 +1,32 @@
<!DOCTYPE html>
<html lang="en" data-bs-theme="dark">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Extra Index</title>
<link rel="icon" type="image/webp" sizes="32x32" href="../favicon-32x32.png">
<link rel="icon" type="image/webp" sizes="16x16" href="../favicon-16x16.png">
<meta name="color-scheme" content="light dark">
<link rel="manifest" href="../site.webmanifest">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<style>
body {
background-color: #000;
color: #f8f9fa;
}
.container {
margin-top: 50px;
}
a {
color: #f8f9fa;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.amber.min.css">
</head>

<body>
<div class="container">
<header class="container">
<h1>Extra, Index</h1>
</div><div class="container">
<ul class="list-group">
<li class="list-group-item bg-dark"><a href="configurazione-alias-gmail.html">Configurazione Alias Gmail</a></li>
<li class="list-group-item bg-dark"><a href="loose-3ds-SD-slot-no-click-cant-close.html">Loose 3DS SD Slot Fix</a></li>
</header>
<main class="container">
<ul class="list">
<li><a href="configurazione-alias-gmail.html">Configurazione Alias Gmail</a></li>
<li><a href="loose-3ds-SD-slot-no-click-cant-close.html">Loose 3DS SD Slot Fix</a></li>
</ul>
</div>
<div class="container">
<a href="../" class="btn btn-primary">Return</a>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</main>
<footer class="container">
<a href="../" class="button">
<button>Return Home</button>
</a>
</footer>
</body>
</html>

</html>
Loading

0 comments on commit f73205e

Please sign in to comment.