All Free <Script>

tips and tricks per webmaster

Come attivare SMS dalle tue app con testo e numero precompilati

28 Febbraio 2022        

Oggi è molto comune chiedere ai tuoi utenti di inviarti un messaggio di testo per avviare una conversazione, o ottenere informazioni da te.

Ma chiedere a loro di aprire la loro applicazione SMS, inserire il tuo numero, aggiungere il testo sono tutte azioni che creano attrito.

Fortunatamente, c’è il codice che gestisce questo per noi, puoi creare un tag <a> con un intento SMS e aggiungere sia il numero che il testo iniziale che vuoi che abbia:

<a href="sms://012345678?&body=ISCRIVITI ORA">SMS ISCRIVITI ORA allo 012345678</a>

Aprirà la tua applicazione SMS, aggiungerà quel testo al corpo e ti consentirà di inviarlo al numero che hai già lì.

Notifiche Web Api

25 Gennaio 2019        

Grazie alle Notifications API siamo in grado di inviare delle notifiche sfruttando il sistema operativo che sta usando il nostro utente.
Il primo passo è il rilevamento della funzionalità di base, e quindi si passa al codice di creazione della notifica:

 <script type="text/javascript">
      function showNotification() {
        if(window.Notification) {
          Notification.requestPermission(function(status) { // lo stato è "granted", se accettato dall'utente
            console.log('Status: ', status); 
            var n = new Notification('Titolo', { 
              body: 'corpo del messaggio',
              icon:  '/pwa_icons/icon.png'  //optional 
            }); 
          });
        }
        else {
          alert('Il tuo browser non supporta le notifiche.');
        }
      }
    </script>

Dopo aver confermato che l’API di notifica è supportata, è necessario richiedere l’accesso alla notifica da parte dell’utente. Se lo stato ritorna come “granted”, puoi creare una nuova notifica con un titolo e un corpo del testo.

Di seguito il codice html per richiamare la funzione.

 <body onload="showNotification()">

Qui puoi trovare una demo e il codice.

Upload di immagini con anteprima

16 Ottobre 2018        

Questo script si occupa di visualizzare in anteprima un’immagine prima che venga caricata sul server. Questo si può ottenere utilizzando la funzione URL.createObjectURL() sul tag <input file>. Questo url viene passato a <img> per dire al browser di caricare l’immagine. Di seguito il codice javascript:

<script language="Javascript">
    var caricaFile = function(event) {
    var output = document.getElementById('output');
    output.src = URL.createObjectURL(event.target.files[0]);
  };
</script>

Questo è invece il codice html

<input name="file" type="file" accept="image/*" onchange="caricaFile(event)">
<img src="default.gif" border="0" id="output">

Proteggere una pagina con password

20 Settembre 2018        

Con javascript puoi scegliere diversi metodi per proteggere una pagina con una password. Molti sono addirittura a prova di hacker. Tuttavia, esistono soluzioni sofisticate non basate su html o javascript per garantire la massima protezione.

Lo script mostra come utilizzare javascript per proteggere una parte di un sito o una semplice pagina web ricorrendo a una password. Quest’ultima viene mostrata in una finestra di dialogo per dimostrare il modo in cui javascript interagisce con il browser:
|| leggi tutto »

Come installare SyntaxHighlighter

13 Marzo 2018        

1. Scarico l’ultima versione del software

2. Estraggo i file in un archivio temporaneo e carico le directory Scripts and Styles

3. Per attivare, ad esempio, l’evidenziazione della sintassi per il codice php e xml, inserire nella <head> </head> della pagina da evidenziare il seguente codice:

<link rel="stylesheet" type="text/css" href="Styles/SyntaxHighlighter.css"></link>
<script type="text/javascript" src="Scripts/shCore.js"></script>
<script type="text/javascript" src="Scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="Scripts/shBrushXml.js"></script>
<script type="text/javascript" src="Scripts/shBrushCss.js"></script>
<script type="text/javascript" src="Scripts/shBrushJScript.js"></script>

4. Inserire questo codice prima del tag di chiusura del </body> nella pagina da evidenziare:

<script type="text/javascript">
dp.SyntaxHighlighter.ClipboardSwf = 'Scripts /clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code'); 
</script>

Per visualizzare il testo correttamente evidenziato, seguire le seguenti procedure:

1. Inserisci il codice da evidenziare tra i due tag <pre></pre>.

2. Impostare il nome dell’attributo su “Code” e la classe attribute su una delle lingue disponibili (php, XML, ecc.), come nel seguente codice:

<pre name="code" class="php">
... qui va inserito il codice ...
</pre>