Articoli con Tag ‘Tutorials’


Creare un semplice Feed Reader con SimplePie e jQuery

SimplePie è una libreria PHP in grado di semplificare notevolmente il recupero e la manipolazione di Feed RSS o, più in generale, di formati XML. È possibile, ad esempio, scrivere poche righe di codice, sfruttando anche qualche “funzioncina” jQuery, per realizzare un News Ticker da inserire nel nostro sito/blog.

Continua...

Adobe AIR e le API di Feedburner: reloaded

Prendo spunto dall’ottimo tutorial di Napolux, Flex 3, Adobe AIR e le API di Feedburner, che mostra come scrivere una semplice applicazione (o widget) Adobe AIR usando Flex 3, per mostrare come realizzare la stessa identica cosa usando Adobe Flash CS3. Se lo desiderate, inoltre, potete sfruttare l’estensione per la creazione di applicazioni Adobe AIR. Non è infatti necessario, ai fini di questo tutorial, compilare l’applicazione come eseguibile AIR; potete usare il codice proposto come semplice filmato Flash da “apporre” alle vostre pagine Web.

Continua...

Actionscript 3.0 for beginners: lesson #4

Riprendiamo il nostro codice di esempio del TicTacToe (che trovate per intero su Google Code) e iniziamo ad analizzarlo in dettaglio.

Importare le definizioni

Con Actionscript 3.0 è stato fatto un grande lavoro di pulizia e sistemazione nell’alberatura delle classi (contenute nei pacchetti, package) utilizzate durante lo sviluppo. In altri linguaggi di programmazione, come il C ad esempio, quando si desidera utilizzare una funzionalità bisogna esplicitamente “importarla” nel codice. Questa operazione di “importazione” è necessaria per permettere al compilatore di avere tutti i codici e le definizioni legate alla funzionalità che vogliamo usare. In Actionscript 3.0, tuttavia, l’istruzione import non va confusa con l’equivalente C/C++ #include; Actionscript 3.0 mette a disposizione l’istruzione include che è identica all’#include del C/C++. Quest’ultima, infatti, “include” effettivamente del codice che, se usato o meno, viene compilato nell’eseguibile finale. L’istruzione import è di più alto livello e risulta più “intelligente” in fase di compilazione. Essa serve principalemente per accedere alle classi senza doverne specificare il nome completo. In alre parole invece di usare forme del tipo:

1
var myMC:flash.display.MovieClip = new flash.display.MovieClip();

Continua...

WordPress: rimuovere i menu dell’amministrazione

Può risultare utile, a volte, “oscurare” alcuni menu dell’amministrazione di WordPress, soprattutto se si è sviluppato un sito/blog per un cliente e non si vuole permettere l’accesso a funzionalità particolarmente delicate. Esistono Plugin che svolgono questa già funzione ma, per avere un controllo personale e completo, vediamo come funziona in dettaglio questa caratteristica.
Come sempre sfruttiamo le utilissime Action messe a disposizione da WordPress, in questo caso admin_menu. Tramite la variabile globale $menu possiamo accedere alla lista dei menu dell’amministrazione. Possiamo individuare il menu da “eliminare” in due modi: tramite l’etichetta o tramite il link a cui punta (vedi parti commentati nell’esempio qui sotto). Nell’esempio proposto vengono “oscurate” le voci di menu Design, Impostazioni e Plugins:

1
2
3
4
5
6
7
8
9
10
11
12
13
function remove_menu_item() {
    global  $menu;
    // tramite label
    $removes = array( 'Design', 'Impostazioni', 'Plugins' );
    // tramite link
    // $removes = array( 'themes.php', 'options-general.php', 'plugins.php' );
    foreach( $removes as $todel )
        foreach($menu as $key => $sm) if($sm[0] == $todel ) { unset( $menu[$key] ); break; }
        // tramite link
        // foreach($menu as $key => $sm) if($sm[2] == $todel ) { unset( $menu[$key] ); break; }  
}
//
add_action('admin_menu',  'remove_menu_item');

L’uso del link come chiave per la rimozione ($sm[2] nelle parti commentate nel codice qui sorpra), è utile quando non si ha certezza della lingua – localizzazione – con cui è stato installato WordPress. Con questa tecnica, tuttavia, il menu è rimosso solo a livello di interfaccia, quindi sarà possibile ancora accedere alla pagina tramite una link diretto.

Continua...

WordPress: come creare passo passo un proprio login

In questo tutorial vedremo come creare una procedura di Login personale, utilizzando anche funzionalità Ajax tramite jQuery. Ci sono vari metodi per personalizzare il login di WordPress, ad esempio tramite l’uso di hook e filtri (add_action(), add_filter()). Noi qui useremo una procedura più a basso livello, anche se ci interfacceremo comunque al Kernel di WordPress. Inoltre faremo in modo di convalidare un utente tramite la dupla email/password.

Perchè realizzare un proprio login?

  • In alcuni contesti può ritornare uitle avere il massimo controllo sulla pagina di login, per proporre un layout personalizzato ai nostri utenti registrati. Inoltre si può arricchire la pagina con informazioni utili, dal un logo al classico “Password dimenticata?”
  • Per permettere l’accesso tramite l’email (come nell’esempio qui trattato) al posto dello user_login standard di WordPress
  • Per avere la possibilità di inserire un pannello di login nella sidebar del nostro Blog
  • E infine, per avere uno scheletro – ed un’idea – per un ottimo Plugin :D

Ambiente

Nel nostro esempio/tutorial lavoreremo sulla root di WordPress all’interno di una cartella mylogin. Creiamo due file php all’interno di questa cartella: index.php e logon.php. Il primo conterrà l’interfaccia del nostro login, con tutte le funzioni Javascript/jQuery che ci servono. Il secondo file, logon.php, conterrà il codice per la validazione dell’utente. Creiamo poi una cartella css e dentro questa un file layout.css e una cartella images. All’interno della cartella images inseriremo un classico Ajax loader: createlo online su AjaxLoad.info. Alla fine dovreste avere:

  • mylogin
  • index.php
  • logon.php
  • css
  • layout.css
  • images
  • ajax-loader.gif

Continua...

Very short trick: valori undefined in Javascript

Esiste una forma abbreviata per assegnare “al volo” una valore ad una variabile se un’altra non è definita (undefined), usando l’operatore di OR logico (||) – doppio pipe:

1
2
3
4
5
// pluto risulta undefined
var pluto;
var pippo = pluto || '5';
alert( pippo );
// risultato: 5

Continua...

Very short trick: avoid error message in PHP

Se non vogliamo che una funzione PHP emetta un qualsiasi errore o warning, basta inserire prima della chiamata alla funzione il carattere chiocciola – o at – (@):

1
2
3
4
// invece di usare la forma canonica
$res = miaFunc();
// è possibile usare
$res = @miaFunc();

Continua...

WordPress: come scrivere un reply to comment usando jQuery

Recentemente Cristiano Fino ha rilasciato un utile Plugin per WordPress in grado di aggiugere due link ad ogni commento di un post (forse ne avete uno simile installato, visto che nella directory di WordPress.org ne ho travati un paio, tuttavia essendo un software italiano sarebbe il caso di onorare l’ottimo lavoro fatto da Cristiano). Questi Link (reply & quote) permettono di rispondere e/o quotare l’autore di un commento, eseguendo quella noiosa operazione di inserire il carattere at (@) per indicare a chi ci si rivolge. In questo tutorial voglio illustrare – per gli utenti medio-esperti – il modo di aggiugere queste due funzionalità “a mano”, senza ricorrere all’istallazione di nessun Plugin. Inoltre sfrutterò le capacità di jQuery per la parte in Javascript. La tecnica che espongo è la medesima che ho usato per introdurre questa funzionalità in questo blog.

Nota: l’uso di un plugin è la miglior soluzione per chi tende a modificare spesso il proprio template WordPress o, al limite, ha in previsione di farlo. Questo tutorial vuole solo mostrare come eseguire interventi mirati all’interno del codice WordPress ed è dedicato ai più curiosi.

Modifica del file comments.php

La prima modifica che apportiamo è quella di inserire i link “reply” e “quote” all’interno di ogni commento. Per fare questo editiamo il file comments.php situato nella cartella del nostro tema. Questo file contiene tutte le istruzioni che consentono di visualizzare i commenti alla fine di un post. La sezione che ci interessa (che può variare leggermente da tema a tema) è il loop di creazione dei vari commenti, riconoscibile da:

Continua...

Very short trick: PHP auto echo

In PHP è possibile usare una forma abbreviata, o contratta, per visualizzare variabili o ritorni di funzioni:

1
2
3
4
5
6
7
8
// al posto di
<?php echo $miavar ?>
// è possibile scrivere
<?=$miavar?>
// al posto di
<?php echo miaFunc() ?>
// è possibile scrivere
<?=miaFunc()?>

Continua...

Actionscript 3.0 for beginners: lesson #3

Continuiamo l’analisi dell’esempio del gioco Tic Tac Toe, presentato in Actionscript 3.0 for beginners: lesson #2. Eravamo arrivati alla funzione che crea la griglia di gioco:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
/**
 * Disegno graficamente la griglia (3x3) a video
 *
 * @param        void
 * @return       void
 * @private
 */
private function createGrid():void {
    // puntatore temporaneo ad uno oggetto MovieClip
    // nota: qui si sarebbe potuto usare anche un oggetto Sprite
    // ma in questo caso mi serve di poter estendere l'oggetto
    // aggiungendo alcune proproetà personali. L'oggetto Sprite
    // è una classe chiusa e quindi non estendibile runtime, mentre
    // la classe MovieClip è una classe dinamica e quindi rende
    // possibile l'aggiunta di proprietà runtime
    var tm:MovieClip, i:uint = 0;
    // aggiungo in uno schema 3x3 i MovieClip
    for(; i < 9; i++) {
        tm                    = new MovieClip();
        addChild( tm );
        tm.x                  = OFFSETX+( (i%3)*(PLAYER_WIDTH+PLAYER_OFFSET) )
        tm.y                  = OFFSETY+Math.floor(i/3)*(PLAYER_HEIGHT+PLAYER_OFFSET)
        tm._index             = i;
        drawPlayer( tm, 0 );
    }
    // disegno le 2 linee veriticali e le 2 orizzontali
    with( this.graphics ) {
        lineStyle(6,0x666666);
        moveTo(OFFSETX,OFFSETY+(PLAYER_HEIGHT+15));
        lineTo(OFFSETX+( (PLAYER_WIDTH+20)*3 ),OFFSETY+(PLAYER_HEIGHT+15));
        moveTo(OFFSETX,OFFSETY+(PLAYER_HEIGHT+20)*2);
        lineTo(OFFSETX+( (PLAYER_WIDTH+20)*3 ),OFFSETY+(PLAYER_HEIGHT+20)*2);
        moveTo(OFFSETX+(PLAYER_WIDTH+15),OFFSETY);
        lineTo(OFFSETX+(PLAYER_WIDTH+15),OFFSETY+( (PLAYER_HEIGHT+20)*3 ));
        moveTo(OFFSETX+(PLAYER_WIDTH+20)*2,OFFSETY);
        lineTo(OFFSETX+(PLAYER_WIDTH+20)*2,OFFSETY+( (PLAYER_HEIGHT+20)*3 ));
    }
}

Continua...



Stop SOPA