Archivio tag per 'html'

giu
30

Inserire un sito web html all’interno di una pagina fan di Facebook con gli iFrame (con videoguida)

FacebookIn Italia circa 17 milioni di utenti sono iscritti a Facebook, ecco perchè, sempre più spesso, le aziende ricorrono alle pagine fan per promuovere in rete i propri prodotti/servizi. Fin qui, nulla di nuovo.. quello che però molte persone non sanno, è che è possibile integrare una pagina html o addirittura un intero sito web all’interno di una pagina fan di Facebook.

Fino a poco tempo fa, rendere possibile una cosa del genere, non era esattamente una passeggiata, in quanto veniva utilizzato l’FBML, un linguaggio utilizzato da Facebook al posto dell’HTML. Oggi, invece, è possibile personalizzare le pagine fan grazie all’iFrame (che, chi ha un minimo di conoscenza dell’HTML, conoscerà senza dubbio), che permette di integrare all’interno di Facebook pagine web HTML, comprese le animazioni in Flash e Javascript. L’unico piccolo inconveniente è che le pagine devo essere create e pubblicate su un altro hosting, quindi sul vostro spazio web o su qualsiasi hosting gratuito (come Altervista, Netsons e così via).

Vediamo ora come è possibile fare quanto indicato in precedenza, premettendo che la procedura richiede una discreta conoscenza dell’HTML e una discreta conoscenza informatica.

  1. anzitutto è necessario creare una pagina fan di Facebook. E’ possibile farlo cliccando qui;
  2. dopo aver creato la pagina, è necessario creare una nuova applicazione cliccando qui e poi sul pulsante in alto a destra “Crea una nuova applicazione”;
  3. dopo aver assegnato un nome all’applicazione ed accettato i termini d’uso, vi apparirà la pagina principale della vostra nuova applicazione. Qui potete inserire il nome, la descrizione, una piccola icona, un logo, la lingua e altre informazioni. A questo punto è necessario cliccare sul tab “Sito Web” ed inserire l’indirizzo del sito dove avete precedentemente posizionato la/e pagina/e HTML e il nome del dominio. Ora cliccate sul tab “Facebook Integration” ed inserite un nome breve per individuare l’applicazione e indicate di nuovo l’URL nel quale avete posizionato la/e pagina/e HTML. Infine specificate anche il nome del tab che apparirà sulla vostra pagina fan Facebook (come, ad esempio, Benvenuti) ed inserite, in Scheda URL, di nuovo l’URL citato in precedenza. Ora salvate le modifiche e cliccate sulla voce “Vai alla pagina del profilo dell’applicazione”.
  4. manca solo un ultimo passaggio per inserire la/e pagina/e HTML all’interno della pagina fan: cliccate su “Aggiungi alla mia pagina” e selezionate la pagina fan.
  5. andando sulla pagina fan, noterete un nuovo tab e, cliccando su di esso, vedrete la/e vostra/e pagina/e web!

Come premesso, la procedura non è estremamente semplice; a tal fine ho creato un breve screencast (che vi consiglio di guardare a schermo intero) che ripercorre, praticamente, quanto indicato in precedenza.
Continua la lettura di ‘Inserire un sito web html all’interno di una pagina fan di Facebook con gli iFrame (con videoguida)’

Facebook Condividi

set
14

Come ottimizzare e pulire il codice HTML dai tag inutili con HTML Purifier

HTML PurifierChiunque abbia utilizzato un editor HTML visuale (come ad esempio Adobe Dreamweaver, Microsoft FrontPage o, i più recenti, Microsoft Expression Web e Sharepoint Designer), ma anche un qualsiasi CMS, si sarà sicuramente reso conto di quanto codice superfluo viene generato da questi programmi.

Sebbene possa sembrare una sciocchezza, questo comporta una maggiore dimensione della pagina (e/o dell’intero sito), una minore ottimizzazione e, verosimilmente, problemi di sicurezza.

HTML Purifier è una libreria in PHP che assicura: sicurezza (rimuove il codice maligno, conosciuto come XSS), pulizia del codice (analizza il codice al fine di renderlo pulito, conforme agli standard e alle specifiche W3C) e apertura alle modifiche (è open source e, di conseguenza, altamente personalizzabile).

Installazione

L’installazione è facile: dopo aver il pacchetto di installazione dal sito, decomprimetelo sul vostro PC locale e poi trasferite la cartella library, sullo spazio web.

Ora impostate come scrivibile (chmod 755 o 777) la cartella:

/path/to/library/HTMLPurifier/DefinitionCache/Serializer

dove /path/to/library/, è il percorso sul server fino alla cartella indicata.

Configurazione

Anzitutto è necessaria l’inclusione della libreria:

require_once '/path/to/library/HTMLPurifier.auto.php';

In moltissimi casi, questo già basta per permettere ad HTML Purifier di funzionare correttamente, ma, se il vostro Doctype fosse diverso da XHTML Transitional e il vostro set di caratteri diverso da UTF-8, sono necessarie delle ulteriori e semplici modifiche:

require_once '/path/to/library/HTMLPurifier.auto.php';
$config = HTMLPurifier_Config::createDefault();
$config->set('Core.Encoding', 'ISO-8859-1');
$config->set('HTML.Doctype', 'XHTML 1.0 Strict');

In questo caso, abbiamo modificato il Doctype in XHTML 1.0 Strict e il set di caratteri in ISO-8859-1.

Esempio di utilizzo

Infine, vediamo un esempio pratico di funzionamento di HTML Purifier:

<?php
$dirty_html = "... codice HTML non ripulito ...";
$purifier = new HTMLPurifier();
$clean_html = $purifier->purify( $dirty_html );
echo $clean_html
?>

Nella variabile $dirty_html è contenuto il codice iniziale, mentre, in $clean_html, il codice ripulito ed ottimizzato!

Plugin

I meno esperti o i pigroni (!), possono semplicemente integrare HTML Purifier, tramite plugin, ai più noti CMS, come WordPress, Drupal e Joomla!

Facebook Condividi

dic
22

Links della settimana (74)

Come ogni lunedì, ecco una accuratissima selezione di links che pongo alla vostra attenzione:

Windows:

Mac:

Varie:

Facebook Condividi

gen
21

Links della settimana (26)

Come ogni lunedì, ecco una nutritissima ed accurata selezione di links che pongo alla vostra attenzione:

Facebook Condividi

nov
12

Links della settimana (16)

Come ogni settimana, ecco una accurata selezione di links che pongo alla vostra attenzione:

Facebook Condividi

ott
22

Links della settimana (13)

Come ogni settimana, ecco una accurata selezione di links che pongo alla vostra attenzione:

Facebook Condividi

dic
23

Nvu, l’editor web open source

Durante la riunione di ieri sera dell’associazione OpenInformatix ho tenuto un seminario su “Come impagirare un semplice sito web“.

Durante tale seminario, ho illustrato i tag HTML più importanti, facendone vedere l’uso pratico, dopodichè ho presentato e illustrato l’uso del programma Nvu che abbiamo utilizzato per impaginare un semplice sito web (scaricabile clickando qui), partendo da un template esistente scaricato da http://www.oswd.org.

Nvu (pronunciato N-view, inteso come “new view”) è un programma open source che rende la gestione di un sito web facilissima in modo da parmettere, a qualsiasi persona, di creare pagine web e gestire siti web senza avere competenze tecniche o conoscenza di HTML. E’ sviluppato principalmente per Linspire e per le altre distribuzioni Linux, ma la sua architettura multi-piattaforma lo rende disponibile anche per altri sistemi operativi Unix, Windows e Macintosh.

Esso si basa su Gecko, il motore di layout contenuto dentro Mozilla; è un motore super-veloce, molto affidabile, aderente agli standard del web e gestito da una vasta comunità di sviluppatori. Il suo riconosciuto supporto di XML, CSS e JavaScript permette di sviluppare la miglior piattaforma per la creazione siti web sul mercato. La sua architettura basata su XUL, rende Nvu lo strumento di progettazione con le maggiori possibilità di estensione.

Dal punto di vista dell’usabilità, Nvu è veramente ben fatto: è possibile sfogliare comodamente i propri siti nella barra laterale. È possibile scegliere di volta in volta tra vista ad albero, vista sul modello di Gestione Risorse o ancora una cartella alla volta. E’ anche possibile scegliere quali file mostrare, in base alla loro estensione. L’area di consultazione consente anche la visualizzazione di dimensione e data di ultima modifica per ogni file. Inoltre, in un prossimo futuro, sarà possibile una gestione completa dei file, compresa la loro rimozione, la creazione di nuove cartelle e la rimozione di cartelle esistenti. Una delle caratteristiche migliori di Mozilla Firefox (i famosi e utilissimi tab) sono disponibili anche in Nvu: sulla finestra principale del programma, infatti, è possibile gestire e modificare insieme tutti i documenti di cui si ha bisogno.

Per chi avesse bisogno anche di un editor CSS c’è CaScadeS che permette di creare fogli di stile con una facilità estrema. Anche CaScadeS è gestito completamente da Gecko, in modo da permettere di vedere le modifiche agli stili applicati in “diretta” ai documenti su cui si lavora.

Devo dire che tutti gli auditori della riunione di ieri sera, sono rimasti veramente sorpresi della potenza e dalla facilità d’uso di questo programma che potete scaricare (come dicevo prima, gratuitamente e per diverse piattaforme) clickando qui.

Facebook Condividi



tu

Foto a caso dalla Galleria

Blog amici

Notizie Informatiche

Cosa sto ascoltando

Brani che ho ascoltato di recente