Open Graph Confidential: Action, Object

primaslidejpg
Un oggetto(object) di OG, gode di questa qualità: da esso è possibile derivare altri oggetti, e la stessa cosa vale per le Azioni(action).

OGGETTI
Partiamo da un esempio concreto, la solita coppia Cook-Recipe: volendo aggiungere altre ricette, dobbiamo forse creare altri oggetti ex-novo? No, non ne abbiamo bisogno.
aggregazioni_nuova

L’Aggregazione(Aggregation) svolge questo ruolo: in pratica e’ il nostro duplicatore. E’ sorprendente, come questo somigli al meccanismo dell’Ereditarietà (inheritance) che governa la Programmazione Orientata agli Oggetti(OOP). Dall’oggetto Recipe, discendono tutti gli altri oggetti Ricetta, che avranno le stesse proprietà dell’oggetto Ancestor.

og_confidential_00_slide_uno

AZIONI

azioni_nuova

Le azioni, meritano un discorso a parte: in questo caso non si tratta di replicare, bensì di estendere. Partiamo dall’azione Like(built-in like), essa come azione e’ neutra: è associata ad un oggetto(object) verso il quale però, non svolge alcuna funzione. Derivandola, estendendola ad un altra azione, da Like può diventare Love, ma non solo, la nuova azione passa ad un altro oggetto: questo perchè il tipo Object, funziona da super classe, da esso discendono tutti gli altri oggetti.

slide_due

Annunci

2012 in review

I folletti delle statistiche di WordPress.com hanno preparato un rapporto annuale 2012 per questo blog.

Ecco un estratto:

The new Boeing 787 Dreamliner can carry about 250 passengers. This blog was viewed about 1.600 times in 2012. If it were a Dreamliner, it would take about 6 trips to carry that many people.

Clicca qui per vedere il rapporto completo.

Facebook Open Graph Tutorial – Built-in Like

Like, una delle azioni piu’ gettonate dagli utenti di Facebook, e’ ora disponibile come azione predefinita nella Open Graph.

Cosi’, Facebook annuncia (https://developers.facebook.com/docs/opengraph/actions/builtin/likes/) questa importante novita’ per tutti gli Sviluppatori.
L’errore da evitare e’ pensare che, L’Action Like di Open Graph sostituisca il pulsante Like: non e’ affatto cosi’. Il vecchio Like resta, come espressione di affinita’ generica, mentre il built-in Like serve a meglio esprimere, definire una affinita’.
In parole povere, possiamo creare Actions tipo: Love, Follow, Listen, tutte affini al “mi piace”.
Vedremo, in questo tutorial, come creare l’Action Like, derivare da questa un’altra azione e come farla interagire con un oggetto di Open Graph in una Aggregation. Facebook raccomanda che, il pulsante

dovrebbe avere uno stile personalizzato..e assolutamente ogni pulsante personalizzato non deve indurre gli utenti a pensare che sia connesso a Facebook

e non contenere per esempio il verbo “Like”, maggiori informazioni qui https://developers.facebook.com/docs/guides/policy/examples_and_explanations/branding/#og_like_branding

Bene, al lavoro dunque: dalla Dashboard di Open Graph creiamo una nuova azione, dall’elenco a discesa selezionamo “Like”.

Come potete vedere, a questa azione viene immediatamente associato, di default, il tipo Oggetto: “Object”.

Bene, adesso che abbiamo definito quest’Action, deriveremo da essa l’Azione “Love”: premiamo “create new Action Type”, nella casella di testo scriviamo “Love”, ed ecco i settaggi della nuova Azione:

Noterete nella casella “Connected Object Types”, abbiamo inserito “Recipe”, dato che sono di questo tipo gli oggetti presenti nell’Applicazione “Cucina”.

Passiamo ora all’Aggregazione, che chiameremo “Love” ancora:

Ecco la DashBoard di Open Graph con le Aggregazioni:

Cliccando su “Add Sample Data”, di fianco a “Love”, si aprira’ la consueta finestra:

a questo punto, non ci resta che cliccare su Debug, ed ecco finalmente, i nostri dati(meta tag ed indirizzo dell’oggetto nell’Open Graph).

Copiamo i meta tag nel nostro file HTML dove abbiamo inserito anche un pulsante personalizzato(ricordate le linee guida di Facebook), ed inseriamo questo script che verra’ chiamato dal nostro bottone:

function postLove()
{
FB.api(
‘/me/cucinamed:love’,
‘post’,
{ recipe: ‘http://samples.ogp.me/174517726005617’ },
function(response) {
if (!response || response.error) {
alert(‘Error occured’);
} else {
alert(‘Cook was successful! Action ID: ‘ + response.id);
}
});
}

 

Ecco, il ticker, nell’Activity Feed:

Ricordate che, soltanto dopo alcune pubblicazioni(se non ricordo male cinque), la nostra Azione creera’ un Post sul Wall.

Per chi volesse provare, andate a questa pagina:
Cucina,
cliccando sul link “Panzanella”, andrete qui:

dove potrete provare le Actions, sia “Cook” che “Love”.
Un saluto a tutti.

Tutorial Open Graph di Facebook – Aggregazioni

Abbiamo visto, la scorsa volta, come creare la coppia Action-Obiect, nella Open Graph, e di come farla interagire in una Aggregation. E’ chiaro che, possiamo definire tante aggregazioni quante ne vogliamo, certo dello stesso tipo dichiarato nei metatag della nostra pagina Web (mi viene in mente l’oggetto cucinamed:recipe, da me definito in precedenza).
L’immagine mostra l’aspetto dell’Open Graph della mia applicazione
“Cucina”:
og_multiagg

L’oggetto “menulist” rispetta sempre la convenzione cook:recipe, mostrando pero’, una lista delle ultime coppie recipe:cook, questa aggregazione difatti in “Data toDisplay” mostra “recipe” invece che “Cook” come per le altre:

In questa immagine si vede meglio come “menulist” definisca List:recipe, differentemente dalle altre che mostrano Item:cook

Ecco come appaiono, l’ultimo item cucinato e la menulist(senza bisogno di fare altro) nella timeline:

FB Open Graph Tutorial

Posto di nuovo il Tutorial, riveduto e corretto:

Ora che ho raccolto un numero maggiore di informazioni,mi è possibile scrivere questo breve tutorial, augurandomi che vi sia d’aiuto, nella speranza che i vostri consigli e informazioni, lo rendano ancora più completo.

Passo 1: Creazione di un’applicazione Facebook

La prima finestra di dialogo, dopo aver premuto “crea applicazione”, è questa:

Inserite sia il nome, che l’App Namespace, quindi cliccate Continua.

Passo2: Configurare l’applicazione.

Ci troviamo adesso, nella scheda dei settaggi di base(Basic).

L’unica voce che ci interessa è quella riquadrata in rosso, Website with Facebook Login, inserite in quel campo, l’indirizzo del vostro sito web.
Con quest’azione abbiamo concluso la configurazione, salvate: adesso possiamo passare all’Open Graph.

Passo 3: Inizia Open Graph.

Il menu dell’Open Graph, nella colonna di sinistra, mostra solo queste voci:

Premendo Getting Started compare questa finestra:

Questo è il punto nevralgico, dobbiamo definire Azione e Oggetto, io consiglio di usare, al posto delle poco flessibili Azioni e Oggetti predefiniti, un Azione “Cook” riferita ad un Oggetto “recipe”.
Cliccate su “Primi Passi”.

Passo 4: Schede Azione e Oggetto dell’Open Graph.

Ecco la prima scheda, quella relativa all’azione, dovrebbe già esservi scritto: Cook.

Non fate niente, cliccate semplicemente, in basso Continua (o Salva).
Siamo passati, alla scheda dell’Oggetto:

Dovrebbe già esservi scritto, “recipe”, anche qui non fate niente, passate semplicemente alla scheda successiva, premendo salva.

L’aggregazione:

In “Data to Display”, inserite “Cook”, e in “Aggregation Title”, “recipe”, salvate. Bene con questo abbiamo terminato la configurazione iniziale.

Passo 5: Open Graph Dashboard.

Questa è la Dashboard di OG:

Adesso, in Aggregation, di fianco a “recipe”, troviamo “Add Sample Data”:

cliccatelo, vi si aprirà questa finestra:

Cliccate qui:

Vi apparirà questa finestra:

Inserite un titolo qualsiasi, e l’indirizzo web di un immagine: cliccate su “Create”.

Adesso sulla Dashboard, dovreste trovare questo:

Cliccate “Debug”, nella pagina che si aprirà, dovete cercare questo:

Quello è l’indirizzo fisico, lo spiazzamento del vostro Oggetto all’interno dell’Open Graph, selezionatelo e copiate.

Adesso cliccate AddNew, di fianco a Preview Action, dovreste trovarvi qui:

Nella “Reference”, di “recipe”, inserite l’indirizzo che avete copiato in precedenza “http://samples.ogp.me ecc..”: cliccate su Create.

Con questo abbiamo finito il lavoro sull’Open Graph, tornate alla Dashboard.

Adesso dobbiamo avere i nostri dati, nella forma che possano essere inseriti nell’HTML del nostro sito: cliccate “GetCode”, di fianco a “recipe” in “Object Types”: vi compariranno i metatag da inserire nella HEAD del vostro html file, copiateli, ricordando di modificare i valori di default, con quelli che abbiamo inserito prima, in particolare “og:url”, l’image e il title nel caso l’abbiate modificati.

Credo che questo nuovo tut, sia migliore, più chiaro del precedente. Lo step-by-step Tutorial, mostra bene la funzione java script PostCook(), dovete soltanto personalizzarla, con il vostro AppNameSpace, tutte cose intuitive.
Mi auguro di esservi stato di aiuto, resto a vostra disposizione per consigli e suggerimenti, logicamente reciproci.

Ecco il risultato come appare nel Feed delle Attività:

Qui si vede, nella Dashboard dell’Open Graph, che l’azione è stata approvata da Facebook. ed è ora attiva:

Facebook Open Graph – Il pranzo e’ servito


Ancora Facebook Open Graph, stavolta con Azione ed Oggetto definiti dall’utente (dovro’ lavare i piatti dopo).

Per cucinare(?), clicca qui.

Resto a vostra disposizione, per chiarimenti, consigli e quant’altro.

Open Graph – Piccolo manuale di sopravvivenza

Pensavo a un tutorial, invece mi sembra più necessario questo.

Come ho già detto, l’Open Graph è un Protocollo, cioè un modo di trasmissione dei dati, oltre a questo, veramente non c’è altro.
Dove si trovano i dati? Naturalmente sulla rete.
Anche noi, quindi, possiamo preconfezionare dei pacchetti con il contenuto del nostro sito web?
E’ vero fino ad un certo punto. Se il nostro sito, per esempio, ospita un canale di News, oppure un filmato o un gioco.
Torniamo però, al cuore del problema, come sono fatti i pacchetti?
La struttura è questa: Azione–>Oggetto, inoltre Oggetti dello stesso tipo possono stare in un’Aggregazione.
Il problema, devo dirvi, è esclusivamente mio, sì perché credevo che le azioni fossero svincolate dal contenuto, e non è così.
Prendiamo l’azione “read”, poiché sono un essere umano, la immagino come l’azione neutra applicabile a tutto ciò che è leggibile. Nell’Open Graph Azione e Oggetto formano una coppia inscindibile, sono un tutt’uno.
Dico, se uno nel proprio sito vuole ficcarci delle poesie, allora in quel caso non staremmo leggendo. Dura a credersi, ma è così. Dovremmo dare alle nostre (ma anche di altri), composizioni poetiche, il formato delle News. Pubblicato a quest’ora, scadrà tra un’ora, e altre baggianate simili.
Concludendo, più che una possibilità, quella di mettere insieme liberamente dei pacchetti, mi sembra più un modo di predeterminare il contenuto dei siti.
Vivreste voi, in un mondo, dove si possono leggere esclusivamente, nient’altro che giornali?