Come permettere il download di file solo con la password giusta.

Quando si inserisce un link in una pagina web per scaricare un file chiunque apra questa pagina potrà scaricarlo a suo piacimento. Facciamo l'ipotesi che si voglia permettere il download di detto file solo a determinate persone. Il sistema migliore sarebbe quello di inserire una password in modo che solo chi la conoscesse possa scaricare il file in oggetto.

Premetto che questa protezione essendo inserita non nel server ma nella pagina web non è sicura al 100%. Uno esperto di informatica potrebbe scoprirla analizzando il codice sorgente. Se il file da proteggere non è di vitale importanza e se i lettori del vostro sito non sono degli esperti di informatica potete comunque usare questa protezione per immagini o documenti che non volete rendere di pubblico dominio.

Un'altra soluzione sarebbe quella di inserire il link di download in una pagina web protetta a sua volta da password, sempre comunque con una protezione non dal lato server. Vedremo però come impostare un javascript piuttosto semplice per questo tipo di protezione mantenendo il lettore all'interno della pagina che ha aperto ma consentendo il download del file solo a chi digita la password in modo corretto.

Come mostrare avvisi, motti o consigli in una pagina web.

Nella realizzazione di un sito dinamico e nella sua gestione il suo amministratore ha due problemi fondamentali da risolvere: il tempo e lo spazio. Il tempo a disposizione è sempre troppo poco per affinarne il layout, migliorarne la SEO, valorizzarne i contenuti e promuoverlo adeguatamente.

Viceversa lo spazio è sempre troppo esiguo per mostrare ai visitatori occasionali tutti i contenuti principali che sono presenti nella pagina e nelle altre sezioni del sito. Lo spazio poi diventa ancora più angusto quando si vogliano inserire degli annunci o degli avvisi agli utenti.

Non mi riferisco tanto al Banner per la Cookie Law che il lettore vede una sola volta quando accede al nostro sito e neppure a avvisi fissi o avvisi fluttuanti quanto a considerazioni generali, avvisi generici, consigli, aforismi o altri concetti che si possano condensare in un solo paragrafo.

Come aprire più schede del browser con un solo link.

In un post precedente abbiamo visto come aggiungere più collegamenti nel Profilo di Instagram inserendo un solo URL mentre in questo articolo vedremo sotto certi aspetti una generalizzazione visto che  mostrerò come cliccando su un certo link si apriranno simultaneamente più schede del browser.

Questa sorta di multilink potrà essere usato con un anchor text oppure con una immagine. Penso per esempio a un insieme di icone di social network per aprirne tutti i link. Non bisogna però esagerare nel numero di link aggiunti perché altrimenti si rischia di bloccare il browser nei computer con una RAM non troppo elevata. Fino a tre collegamenti aperti simultaneamente non dovrebbero esserci problemi neppure per i computer più vecchi. Se si aumentano i link va considerato questo aspetto non secondario.

Come ottenere il link diretto di un file caricato su Dropbox anche per i nuovi utenti.

Dropbox è uno dei servizi di cloud più famosi e utilizzati e nei suoi primi anni di vita permetteva agli utenti di ottenere dei link diretti ai file caricati nella cartella Public. Questa funzionalità è rimasta per i vecchi account ma non esiste più per quelli che sono stati creati dopo il 4 Ottobre 2012.

La cartella Public per i vecchi utenti ha anche una icona particolare per evidenziare anche graficamente questa sua diversità. I link diretti sono tali che se si incollano in un browser si visualizzerà solo lo stesso file e non la pagina di Dropbox in cui è ospitato. Per dei file .js o .css significa che verrà mostrato nella scheda del browser solo il codice che contengono. Per dei file .mp3 audio o .mp4 video verranno mostrati i player con cui verranno automaticamente riprodotti.

Non sono molti i servizi gratuiti che permettono di avere il link diretto o hotlink ai file che vi sono ospitati dopo che Google Drive ha interrotto questa funzionalità nei mesi scorsi. Il problema di trovare degli hosting per i file non si pone per i blog gratuiti del tipo nomeblog.blogspost.com che possono contare su Google Sites che ancora fornisce questo servizio limitato però solo ai domini di proprietà di Google. Anche i possessori di un dominio Wordpress self-hosted (non nomeblog.wordpress.com!) risolvono facilmente caricando i file che li sono necessari in una cartella creata nella radice di archiviazione per poi averne il link diretto a questo indirizzo www.esempio.com/nomecartella/nomefile.ext. 

Widget degli Ultimi Articoli con Miniature per Blogger.

Nel precedente post abbiamo visto come installare nel modello o in un elemento HTML/Javascript un widget che utilizzava un file esterno caricato su Google Drive. Il metodo proposto è quello di copiare il codice del file esterno, sia esso javascript o CSS, per poi incollarlo nel modello o nell'elemento pagina tra righe di codice che lo possano far funzionare.

Questa modifica si è resa necessaria dopo che Google Drive non supporta più il servizio di hosting. Chi abbia un blog gratuito del tipo nomeblog.blogspot.com può usare Google Sites come hosting senza alcun problema e limitazione. Tale soluzione non è possibile per i blog con dominio personalizzato con URL del tipo www.dominio.com e malauguratamente chi abbia un account Dropbox attivato successivamente al 4 Ottobre 2012 non può usare neppure questo servizio per ottenere l'hotlink.

Come ripristinare i widget di Blogger caricando i javascript esterni nel modello.

Gli utenti della piattaforma Blogger contrariamente a chi ha un blog self-hosted su Wordpress non hanno uno spazio proprio e quindi hanno sempre problemi quando devono caricare file esterni per il layout del sito o per un widget. Il problema in effetti non esiste per chi abbia un sito gratuito del tipo nomeblog.blogspot.com perché in questo caso si può usare il servizio gratuito Google Sites per caricare file CSS, javascript, XML ma anche MP3 per riprodurre audio. Se si possiede un blog su Blogger con un dominio personalizzato vale a dire con un indirizzo www.esempio.com, Google Sites riconoscerà la non proprietà di Google e interromperà il supporto di hosting.

Poco più di due anni fa sembrava che tutto fosse risolto con l'introduzione di un servizio hosting su Google Drive che supportava tutti i domini, non solo quelli personalizzati di Blogger ma anche quelli su piattaforma Wordpress. La soddisfazione è durata poco perché l'anno scorso siamo stati avvertiti che il supporto a questo servizio sarebbe cessato il 31 Agosto 2016.  Dopo aver appreso la notizia avevo immediatamente scritto un post avvertendo i lettori che ci sarebbero state ripercussioni su widget e layout che si appoggiavano a Google Sites per i file esterni. A partire dal 1 Settembre quindi mi aspettavo una serie di commenti di lettori che lamentavano il non funzionamento di gadget. Mi sono stupito quando questo non è accaduto. Ho anche pensato un po' ingenuamente che quelli di Google si fossero dimenticati della scadenza. Invece non è così perché hanno solo posticipato il ritiro del supporto di una ventina di giorni. In questi ultime 48 ore ho già ricevuto segnalazioni di widget che non funzionano che facevano capo a Google Drive.

Come velocizzare il sito rendendo asincroni i javascript.

I browser rilevano i javascript presenti nel codice di una pagina web e devono scaricarli per poter mostrare la pagina in modo corretto. Questa operazione può rallentare significativamente l'apertura della pagina soprattutto se i javascript sono caricati su hosting esterni e se sono particolarmente pesanti.

I grandi player del web sono da tempo a conoscenza della importanza della velocità di caricamento nella soddisfazione della esperienza di navigazione. Tale parametro tra l'altro è uno dei più rilevanti tra i più di 200 fattori di ranking di Google. Per questa ragione Facebook, Twitter, Google, Pinterest, Disqus e altri celebri social e servizi web hanno adottato il caricamento asincrono.

Bottoni di scelta per mostrare testi diversi in uno stesso spazio.

A seguito di una richiesta ricevuta in un commento vado a illustrare un metodo per mostrare un testo diverso in funzione del bottone selezionato dal lettore o meglio un contenitore con più opzioni di contenuto. In altri termini pensate di avere un blog che parli di cinema. Si potranno creare per esempio i bottoni Interpreti, Personaggi, Trama, Produzione. Nella prima scheda si potranno inserire i nomi degli attori protagonisti, nella seconda i nomi e le caratteristiche dei personaggi interpretati, nella terza lo sviluppo della trama e infine nella quarta le notizie sulla produzione come il nome del regista, quello del produttore, dell'autore della colonna sonora e così via.

Sarà poi il lettore a cliccare sulla scheda corrispondente per avere le informazioni che desidera. Un tale metodo funziona anche come spoiler per evitare di mostrare in modo palese la trama del film anche a chi non la voglia conoscere per avere l'effetto sorpresa. L'esempio fatto per un sito di cinema può essere esteso a un sito di ricette con varie opzioni per cucinare lo stesso ingrediente.

Javascript per mostrare motti, aforismi o frasi celebri in modo casuale in un sito.

Nel precedente articolo abbiamo visto come mostrare delle immagini con collegamenti in modo casuale in una pagina o in un widget del blog. In questo post invece delle immagini casuali creeremo un javascript per dei testi casuali.

Si tratta di una personalizzazione molto divertente per mostrare per esempio delle frasi celebri a rotazione tutte le volte che si apre una pagina del sito. Una idea interessante per blog letterari ma anche per siti politici con aforismi di personalità pubbliche. Il concetto è sostanzialmente identico a quello già visto per la rotazione random delle immagini. Verrà creato un codice in cui digitare le frasi celebri. Potranno anche essere scelti la dimensione dei caratteri e il colore.

Javascript per immagini casuali con link in un widget.

Con questo articolo intendo rispondere ad alcuni quesiti che mi sono stati posti nei commenti. L'esigenza di alcuni lettori è quella di mostrare in un widget in modo random una serie di immagini che se cliccate portino a un determinato articolo o comunque a una pagina interna o esterna al blog.

In questo modo i lettori che navigano più pagine del sito vengono a visualizzare immagini diverse ad ogni apertura di post con un collegamento sul quale possono cliccare. L'obiettivo di questa personalizzazione è quindi di mostrare dei contenuti in modo casuale e non ripetitivo.

Come creare uno spoiler in un post senza javascript esterni.

Gli spoiler sono dei sistemi di impaginazione di contenuti molto utilizzati per esempio nelle recensioni letterarie e cinematografiche. Si tratta di un termina mutuato dalla areodinamica che indica l'appendice posta sulle ali degli aerei che funziona come un deflettore di flusso e serve per aumentare o diminuire la portanza ovvero la spinta verso l'alto che serve per bilanciare il peso dell'aereo.

Quando il termine spoiler è invece associato a un film, a un gioco, a una serie televisiva o a fumetti si intende una anticipazione della trama o comunque di importanti informazioni circa l'opera di cui stiamo consultando la recensione. Inserire uno spoiler serve soprattutto a che non abbia ancora visto il film o letto il libro per non rovinarsi l'effetto sorpresa. All'atto pratico per realizzare una simile funzionalità si possono nascondere le informazioni e permettere solo a chi lo voglia di visualizzarle cliccando in un apposito link o bottone o immagine o icona appositamente create.

Come inserire dei commenti nel modello di Blogger per ritrovare il codice più facilmente.

Una delle domande che mi vengono più spesso rivolte nei commenti è quella di non trovare più un codice di un particolare widget nel template di Blogger e come fare quindi a disinstallarlo. Queste problematiche in realtà si potrebbero facilmente risolvere con un po' di attenzione.

Visto che ci sono dei blog che hanno molti anni con dei widget e dei codici inseriti da molto tempo è spesso difficile risalire al loro codice e quando questo sia possibile per chi non sia particolarmente esperto è difficile capire quando inizia e quando finisce il codice da eliminare o da modificare.

Gli webmaster in verità hanno a disposizione uno strumento potentissimo per "taggare" i codici in modo da poterli ritrovare più facilmente. Lo strumento da usare è quello dei commenti vale a dire una particolare sintassi che avverte il browser di non leggere quello che c'è all'interno di due tag. Ci sono vari tipi di commenti a seconda che il codice in questione sia HTML, CSS o javascript.

Come evitare i conflitti tra le librerie jQuery, Prototype, Scriptaculous e Mootools.

Attraverso il linguaggio javascript sono state implementate nelle pagine web delle funzionalità che le rendono dinamiche. Quando vedete uno slideshow di immagini o un widget scorrevole da inserire nel vostro sito immancabilmente c'è una libreria javascript che svolge il compito principale.

Alcune di queste librerie sono diventati degli standard e vengono utilizzate per gli effetti più svariati. La più conosciuta e utilizzata è probabilmente jQuery che viene aggiornata periodicamente. Non è però la sola visto che ce ne sono altre molto usate dagli sviluppatori che creano temi per Wordpress e modelli per Blogger. Ricordo Prototype e Scriptaculous  che vengono spesso utilizzate contemporaneamente ma anche Mootools ha molti estimatori. 

Come risolvere quando il modello di Blogger non salva un codice javascript.

Se siete utenti di Blogger vi sarà certamente capitato di incollare un codice nel vostro modello che apparentemente sembra perfetto, visto che lo avete scaricato per esempio dalla pagina dei Social Plugin di Facebook, che però il template di Blogger si rifiuta di salvare.

L'avviso di errore che visualizza l'amministratore del blog ha in genere questa forma:

Errore di analisi nella riga … Il riferimento alla entità … deve terminare con …. 

La ragione di questa difficoltà risiede nella tipologia dello stresso modello di Blogger. I blog di Blogger sono codificati con il linguaggio XHTML e XML. Una pagina scritta in XHTML non è altro che una pagina HTML scritta in conformità con lo standard XML. Il template di Blogger è in XML e interpreta come errati i simboli che in tale linguaggio non sono consentiti all'interno di un javascript come <, >, ", ', e &.

HTML Fire e Javascript Editor sono app di Chrome per Editor in Real Time.

Con questo articolo inizio una serie di post su alcune interessanti estensioni (o applicazioni) che possono sostituire dei programmi del computer o dei tool online utilizzati da blogger dilettanti e professionisti. Per testare il funzionamento di un codice con linguaggio HTML i meno esperti lo pubblicano in un post di un blog di prova mentre quelli con qualche conoscenza in più possono usufruire di uno dei tanti strumenti online. Il più sofisticato è Codepen che però serve anche per la condivisione di tali codici.

HTML Fire è una applicazione di Chrome che ci permette di vedere in tempo reale il risultato visivo di un codice HTML. Per la sua installazione si va su +Aggiungi

Come inserire direttamente nel modello di Blogger i file CSS e javascript caricati in un dominio esterno.

Quando si scaricano i modelli di Blogger da internet o quando si installano dei widget spesso diventiamo dipendenti da file esterni al nostro sito che possono smettere di funzionare da un momento all'altro perché il servizio su cui erano caricati ha cessato di esistere come per esempio Google Code o perché il dominio in cui il webmaster creatore del template o del widget li aveva hostati non è stato rinnovato.

In realtà si possono caricare file CSS e javascript esterni direttamente nel modello di Blogger con dei vantaggi evidenti. Innanzitutto non avremo più il problema di domini o siti esterni che vanno fuori servizio anche per poche ore e inoltre ne sarà avvantaggiata la velocità di caricamento perché il browser dovrà effettuare meno richieste HTTP.

Google chiude anche Google Code a partire da subito.

Siamo già a Marzo e sono iniziate le pulizie di Primavera che per Google significa tagliare i progetti che secondo loro hanno il fiato corto o che sono in perdita senza possibilità di rilancio. Dopo la chiusura di Google Reader credevo che il prossimo sarebbe stato FeedBurner ma mi sbagliavo. 

Con un post su Google Oper Source Blog da Mountain View ci avvertono che Google Code ha ormai i giorni contati. Si tratta di un servizio che ha avuto una grande importanza per gli sviluppatori o comunque per chi frequenta internet perché permetteva di condividere i nostri progetti e soprattutto ci consentiva di caricare i file javascript per poi ottenerne il link diretto. Adesso per fortuna c'è Google Drive che si può utilizzare per questo stesso scopo. Secondo quanto ci comunica Google la decisione di interrompere l'esperienza di Google Code è dovuta all'affermarsi di altri servizi simili come GitHub e Bitbucket.

Tutti i feed dei blog su Blogger.

I feed di un dominio o come si dovrebbe dire in italiano il flusso di un sito è formato da un insieme di informazioni formattate per scambiarne il contenuto tra varie applicazioni o piattaforme. Il primo standard utilizzato è stato il RSS e non a caso spesso si parla di Feed RSS anche se adesso il formato di gran lunga più utilizzato è l'Atom.

 

La piattaforma Blogger ha dato agli webmaster tutto un insieme di strumenti per ottenere i feed dei contenuti dei blog che vi sono installati. I feed degli articoli mostreranno in una solo pagina web l'elenco degli ultimi post pubblicati con titoli e contenuti. L'autore del sito può decidere se mostrare agli utenti tutti i post o solo una parte. Basta andare su Impostazioni > Altro > Feed sito > Consenti feed blog e selezionare le opzioni disponibili Completo, fino all'intervallo, Breve, Nessuno e Personalizza. Se si sceglie questa ultima possibilità si potranno personalizzare i flussi non solo dei post ma anche dei commenti e di commenti per ciascun post

I 5 migliori servizi gratuiti per caricare file js, xml, css, mp3, swf e ottenerne il link diretto.

Chi possiede un sito ha la necessità di caricare file in uno spazio esterno per poi acquisirne l'hotlink da utilizzare nei post, nel modello o nel tema del suo sito. I file più comuni sono sicuramente le immagini e i video ma per questi non ci sono problemi visto che le foto in formato JPG, PNG o GIF possono essere archiviate su Picasa o Google+ Foto praticamente senza limite di spazio. Si può quindi ottenere il link diretto da utilizzare anche nei nostri blog Wordpress per risparmiare lo spazio dell'hosting.

Se si ha un blog su Blogger non c'è neppure bisogno di caricare le immagini su questo servizio visto che basta pubblicarle con l'Editor che vanno a finire proprio lì suddivise in album per ciascun blog che si è creato. Un discorso simile vale anche per i video visto che abbiamo a disposizione Youtube e servizi similari  che ci permettono di incorporare i video in una pagina web senza alcuna difficoltà.

Come aggiungere un link della pagina quando ci copiano del testo o delle immagini del blog.

Chi ha un blog che crea contenuti originali si sarà certo scontrato con la piaga dei "colleghi" che copiano i post immagini comprese. Mi sono già occupato diverse volte di come comportarsi quando qualcuno copia i nostri articoli e di come disabilitare le opzioni per copiare le immagini sempre nell'ottica che si tratta comunque di una battaglia lunga e difficile in cui le armi che si possiedono sono spesso spuntate.

Vi sarà probabilmente anche capitato di copiare un paragrafo di un sito e dopo averlo incollato di visualizzare un testo con l'URL della pagina da cui proviene. Questo non è certo fondamentale per fermare i copiatori ma può servire da deterrente e qualche volta le informazioni aggiunte al testo copiato rimangono.

Tynt è un sito che offre un servizio di questo tipo. Basta andare sul bottone Get CopyPaste e riempire il modulo con indirizzo email, URL del sito con .com, e non con il localizzato .it, e con la password