Jak na Facebook Apps – založení aplikace

Nerad chodím kolem horké kaše a nerad teoretizuji. Jako důkaz vytvořím jednoduchou aplikaci pro Facebook krok za krokem, takže to po mě už zvládne opravdu každý ;) Vymyslel jsem si jednoduchý příklad pro stránku Nakupování v USA.com – jde o výpis nejnovějších vybraných produktů z affiliate programu Shipita, takže to je plně automatické a bezúdržbové.

FB App - založeníUkázková aplikace bude umět třeba odeslat nejnovější produkt z RSS Shipita na vaši Zeď (takže ji uvidí všichni přátelé), samozřejmě s odkazem na vlastní stránky (detail produktu nebo v mém případě hlavní stránka NakupovaniVUSA.com), proklik z vaší stránky na stránku Shipita pak znamená nového affiliata ;)

Takže začneme?

  1. Přihlašte se ke skupině Facebook Developers – http://www.facebook.com/developers/
  2. Vpravo nahoře tlačítko Set Up New Application
  3. Vyberte si název aplikace a odsouhlaste podmínky
  4. Aplikace je vytvořena, obdrželi jste všechny potřebné klíče
  5. Nyní je nutné připravit stránku na vaší straně, kterou bude Facebook aplikace volat

FB App - NastaveníIn da WordPress

Jelikož NakupováníVUSA běží na WordPressu, vytvoříme si samostatnou stránku s vlastní šablonou, kterou budeme z aplikace volat. Vytvoření stránky snad by neměl být problém, použití vlastní šablony také není složité. Důležité nyní je stáhnout Facebook knihovnu (odtud) a zprovnoznit jí. Já jsem jí na férovku nahrál do adresáře wp-content/facebook. Veškerý kód budu psát rovnou do šablony, což není zrovna nejhezčí, ale pro pochopení příkladu to snad postačí ;-) Máme tedy vytvořenou stránku s vlastní šablonou (např. facebook.php) a tu je kód, který načte knihovnu a vypíše jméno přihlášeného uživatele.


<?php

/*

Template Name: Facebook

*/

?>
<?php
$apiKey = "fc222b0e09e0aa97b09bfb47e383c24d";
$secKey = "fd4aa28b200000000000f6bbd4a9417"; // Tajný kód
require_once dirname(realpath('.')) . '/httpdocs/wp-content/facebook/facebook.php';
$facebook = new Facebook($apiKey, $secKey);
$facebook->require_frame();
$user = $facebook->require_login(); // Vyžádá si povolení od uživatele
?>
<h1><a href="http://nakupovanivusa.com">Nakupování v USA</a></h1>
<h2>Vítej <fb:name firstnameonly="true" uid="<?=$user?>" useyou="false"/>!</h2>

Když si nyní otevřete adresu, kterou jste právě vytvořili – v mém případě http://nakupovanivusa.com/facebook – proběhne přesměrování na Facebook a zobrazení chyby, která oznamuje, že je nutné nastavit Canvas Callback URL.

Tak si to zprovozníme zítra, já pádím na oběd ;)

Jak na Facebook aplikaci – seznámení

Napsání vlastní Facebook aplikace není složité, vlastně oproti propagaci výsledné aplikace je naprogramování to nejmenší. Dostat svoji aplikaci k uživatelům je to nejtěžší a úspěchu lze dosáhnout jen několika cestami. Vymyslet geniální virální aplikaci (Mafia Wars, Kvízy), užitečnou aplikaci pro široký okruh lidí (nic mě nenapadá ;) nebo svoji aplikaci náležitě zpropagovat.

Pokud nechystáte fanfáry a slavnostní přestřihávání kabelu, můžete si vlastní aplikaci zkusit naprogramovat pro radost a třeba své přátele (geniální virální aplikace se z toho může vyklubat kdykoliv). Tak jen do toho ;)

1.) Nápad

Statistiky v profiluPoslat na Zeď nové fotkyBez toho to bohužel nepůjde. Jelikož aplikace pracuje na vaší straně (serveru), můžete například kreativně využít svoji databázi čehokoliv (vtipů, videí, uživatelů, …). Aby to bylo maximálně názorné, popíšu jak jsem tvořil aplikaci pro Pixmac s názvem My Pixmac, která v současné době umožňuje přidat si do profilu statistiky fotografa nebo odeslat na svoji Zeď nové snímky fotografa.

2.) Vlastní prostor

Stačí jakýkoliv sdílený hosting, ba i freehosting. Facebook aplikace volá vaše skripty, tj. například http://www.example.com/facebook.php, která vrací FBML kód – tj. to co se vygeneruje je plně ve vaší moci, až na Javascript :-/ Ten se samozřejmě použít dá, ale trochu obtížněji. FBML značka je například:

<fb:name uid=“$fbUserId“ capitalize=“true“ />

Tento jednoduchý FBML kód vypíše velkými písmeny jméno aktuálně přihlášeného uživatele, vhodné pro pozdrav například. Trošku předbíhám, ale snad mě doženete.

3.) PHP Knihovna

Důležitou součástí je oficiální PHP knihovna pro ovládání Facebook aplikace, najdete ji s podrobnými informacemi na adrese http://wiki.developers.facebook.com/index.php/PHP – můžete také zkusit neoficiální balíček PEAR, Services_Facebook. Vložením této knihovny do svých skriptů zajistíte plnou funkčnost Facebook aplikace – zejména pak zjištění ID přihlášeného uživatele, to je nejdůležitější a zároveň snadné. Příklad:

require ‚Facebook.php‘; // načtení knihovny

$facebook = new Facebook($apiKey, $secretKey); // inicializace třídy (klíče získáte při vytvoření aplikace)

$fbUserId = $facebook->require_login(); // uživatel musí být přihlášen, vrací ID uživatele

echo ‚HELLO <fb:name firstnameonly=“true“ uid=“<?= $fbUserId ?>“ useyou=“false“/>‘;

Snadné že? Tento kus kódu zavolaný Facebook aplikací vypíše uživateli krásný osobní pozdrav…

Příště tedy založíme aplikaci na Facebooku, nastavíme, zavoláme tenhle kus kódu a uvidíme co to provede ;)

Pixmac má šmrnc (jak kdy)

Už dlouho jsem nenapsal žádné promo k projektu Pixmac, na kterém tu v Praze tvrdě makáme ;) Programátoři programují, schvalovači schvalují, keywordovači keywordují, markeťáci markeťují a Bagetka se jako vždycky válí. Ehm, tohle je naše Bagetka, skoro-maskot dalo by se říct…

Naši Facebook aplikaci jsem rozšířil o další fíčurku, která umožňuje fotografovi poslat svoje nejnovější fotky na Zeď, kde je uvidí všichni přátelé (než si dotyčného zablokují samozřejmě). Připadlo mě to jako užitečná věcička jak zviditelnit své portfolio profesionálních fotografií, jak oživit svůj profil a v neposlední řadě jak dostat pár komplimentů od přátel ;)

Na aplikaci My Pixmac jsem dostal i několik reakcí – jednu na eMagu (díky Sašo) a jednu od Dana Dočekala (díky Dane), který mě informoval o nutnosti povolovat naší aplikaci přístup do mnoha věcí, které stejně nevyužíváme – přátelé, fotografie a další osobní informace (viz. pooh.cz). Dávám mu tímto za pravdu a upravím aplikaci tak, aby toto povolení (v menším rozsahu) vyžadovala až při propojení s Pixmac účtem (pomocí e-mailu). Uživatel si tak bude moct prohlédnout jaké funkce bude mít k dispozici a poté se rozhodne, jestli své účty propojí či nikoliv.

Jako předposlední novinka je celkem veliký úspěch ve 4. ročníku soutěže IEA – Internet Effectiveness Awards, kde byl Pixmac oceněn za inovace a dostal krásný plakátek (něco jako diplom). Více info na našem českém blogu a pár oficiálních foteček.

A naposledy. Zítra bude k vidění nová Pixmekácká hlavička a nový ceník (scénář Víťa Válka, režie Martin Talavášek), takže se je na co těšit. A aby toho nebylo málo (práce není nikdy dost), nosím v hlavě pár nápadů na Google Gadget, další Facebook Megadget a hlavně Pixmac FotoWidget, který betatestneme tenhle týden…

Aby se v těch „..dgetech“ prase vyznalo ;)

Zálohuji, tedy budu…

Očividně dospívám, hlavně tedy technologicky, protože mě skutečně začalo zajímat zálohování (backup). Jde mi zejména o důležité dokumenty a projekty, v druhé vlně pak fotky a muzika. Třetí vlna, seriál  The Big Bang Theory, už nepokládám za životně důležitý a tak mu zřejmě dopřeju jen DVD…

Zálohování je dobré dělat více způsoby a plně automatizovaně, protože jakýkoliv program, který musíte spouštět je vám k ničemu, protože ho prostě spouštět nebudete. I to kliknutí myší bude nepřekonatelný problém a odložíte vytvoření zálohy „na později“. Nicméně zálohovat je skutečně nezbytné, což vám potvrdí každý „bývalý-majitel-důležitých-dat“.

1.) On-line zálohování

Je to nejjefektivnější cesta, jak zazálohovat důležité dokumenty, projekty a menší soubory. Nehodí se však na fotky a větší soubory. Většinou jde o zálohovací desktop program běžící na pozadí, kterému jednou nastavíte složky, o které nechcete při výbuchu vašeho notebooku přijít a program sám odesílá změněné soubory na vzdálený server do bezpečí. Důležitá je první synchronizace, která bude trvat trochu déle (dle objemu dat a konektivitě), ale jedna synchronizační noc to jistí.

Právě testuji zálohování/synchronizaci od Microsoftu – Live Mesh. Instalace rychlá a bezproblémová, není nutno restartovat systém a do 10 minut označíte složky a program začne první synchronizaci. Live Mesh nabízí 5 Gb prostoru zcela zdarma, což je pro ty nejdůležitější věci dostatek místa a možná ještě trochu zbude. Zítra ráno bych tedy měl odcházet do práce s božským pocitem, že má důležitá data odpočívají na různých místech světa, nedotknutelná, zabezpečená… stačí jen nezapomenout heslo.

2.) Externí harddisk

Zálohování na DVD či CD u mě padá rovnou. Vypalování dat po 4.5 Gb nebo 9 Gb je prostě časově náročné a nesmyslné vůči životnosti DVD médií. Prostě poměr cena/výkon je k pláči. Béé-éé. Oproti tomu externí harddisk je na tom z hlediska pohotovosti a rychlosti zálohování mnohem dále. Stačí jen označit soubory a čekat, žádné šup placka dovnitř, šup placka ven. Životnost harddisku a dat na něm by mělo být, v závislosti na jeho opatrování a skladování, velmi dobré. Samozřejmě že lepším řešením je mít jeden a více externích HDD pouze na zálohy a nenosit je na LAN párty (případně na normální párty s holkama).

Momentálně bych tu měl k záloze hodně Gb fotografií, spoustu muziky a nějaké ty seriály. Jako ideální řešení bych viděl jeden USB externí harddisk o velikosti minimálně 250Gb. Kopírování přes USB 2.0 je velmi rychlé (teoreticky 450Mb/s?), takže se stačí dokopat ke koupi onoho zařízení a občas to tam prostě nakopírovat. To se asi bohužel nedá dost dobře automatizovat. Leda mít HDD připojený ke statickému PC a sázet to tam on-line. Ale tak víte co…

A co mých 14 pravidelných čtenářů? Zálohujete pravidelně? Jaké používáte řešení?

Jak stavím web na nevyužité doméně

Toto snad ani nemá být krok-za-krokem návod, ale spíš takový můj osobní plán, jak co nejrychleji a nejjednodušeji postavit web na nevyužité doméně. Píšu si ho i pro sebe, abych se za pár měsíců/let mohl podívat, co jsem to vyváděl, co jsem dělal špatně, co dobře a jestli to bylo k něčemu dobré. Lze si z něj vzít ponaučení, lze mi jej v komentářích zkritizovat. Postup si pamatuji ze sestavení webů NakupovaniVUSA.com, který jsem spustil před pár dny.

1.) Výběr nevyužité domény / nákup domény

Doména 2. řádu je důležitá, stavět weby na subdoméně není perspektivní, neboť je později nemůžete prodat jednotlivě (a když, tak s obtížemi). Projekt by měl vznikat na téma, ke kterému máte blízko a dokážete k němu pár slov napsat nebo k tématu finančně zajímavému (pojištění, finance, bulvár, …). Pokud to není ani jedno, nepotřebné domény se zbavte. Nastavení domény do (multi)hostingu – 15 minut.

Doménu NakupovaniVUSA.com jsem koupil za 200,- na Webtrhu před více než rokem(!). Krásný příklad nevyužité domény. K vytvoření stránky mě pak inspiroval John, který rozšířil svůj affiliate o skvělou funkci.

2.) Publikační systém

Na většinu věcí se skvělě hodí WordPress, který je ihned zprovozněný na jakémkoliv hostingu a není třeba vymýšlet nějaké skopičiny v HTML a PHP. Lze do něj ihned doinstalovat důležité pluginy, které se postarají o on-page SEO, automatické vytváření sitemap, neuvěřitelně skvělé kešování a kdo-ví-co-ještě.

Osobně vždy instaluji alespoň:

  • Google XML Sitemaps (http://wordpress.org/extend/plugins/google-sitemap-generator/)
  • WP Super Cache (http://wordpress.org/extend/plugins/wp-super-cache/)
  • Akismet proti spamu v komentářích (http://wordpress.org/extend/plugins/akismet/)

Google XML Sitemaps zajistí vytvoření sitemapy při každém publikovaném příspěvků. To zajistí rychlou indexaci ze strany Googlu i Seznamu. WP Super Cache je skvělý plugin, který umožňuje spoustu nastavení a možností kešování. Zobrazení stránek je tak otázkou desetin sekundy při nulovém vytížení hostingu. Komentáře vždy dodají webu určitou „živost“, takže Akismet je nezbytností. Další pluginy jsou určitě neméně zajímavé a užitečné, ale někdy je méně více.

Nahrání a instalace WordPressu, nastavení pluginů a základních údajů o webu nezabere více než 45 minut.

NakupovaniVUSA.com je jednoduše rozdělené na kategorie, ve kterých se jen zobrazují produkty z Shipito Affiliatu. Není to zatím nic moc (některé kategorie jsou prázdné), ale John to určitě ještě doladí. Bez smysluplného obsahu by to web neměl žádnou cenu, proto je tam i kategorie Články.

3.) Výběr vzhledu

Výběr vzhledu není radno podceňovat, protože i dobrý design prodává. Výroba vlastního designu a jeho kódování pro WordPress je prakticky zbytečná práce, pokud se chystáte obšťastnit nějakou výběhovou doménu. Internet je plný WordPress témat volně ke stažení, takže není problém během 10 minut najít vhodný design a dvěma kliknutími nainstalovat.

Design vybírejte podle zaměření webu a hlavně podle vlastního pocitu. Šablony jsou většinou anglicky psané, jen výjimečně je k dispozici překlad v gettextu (*.mo, *.po), který umožní rychlý překlad šablony. Všech 99% ostatních šablon je nutno počeštit, zabere to maximálně 30 minut.

Design LightWord mě zaujal na první pohled, jednoduchý a technický. Příjemným překvapení pak byly překlady v gettextu – jednoduše jsem si přeložil *.mo v programu Poedit a uložil jako cs_CZ.mo a .po, světe div se, fungovalo to ;) Dalším překvapením byla implementace Cufónu, která dělá písmo mnohem, mnohem hezčí pomocí Javascriptu. Prostě příjemné maličkosti.

4.) První obsah

Stránka by neměla po spuštění zůstat prázdná! Vpodstatě o nic nejde, ale dokud na stránce nebude žádný obsah, nic vás nebude nutit tam nějaký psát. Proto ihned po spuštění napište první stránku o čemkoliv na dané téma. Motivuje vás to do dalšího psaní. Samozřejmě pokud je váš čas dražší nebo vás psaní tolik nebaví, najděte si spolehlivou pracovní sílu, která nebude texty kopírovat z Wikipedie. Napsání jedné stránky vyjde na maximálně 30 minut.

Abych své tvrzení o prvním obsahu podložil nezvratnými důkazy, 10. června (2 dny po spuštění NakupovaniVUSA.com) jsem napsal krátký obecný příspěvek.

5.) Nasazení reklam, affiliate odkazů, statistik

Když už, tak už! Vše je připraveno a nemá cenu čekat na návštěvnost, aby reklama na webu dávala nějaký smysl. Vezměte to vše při jednom a vhodně rozmístěte vaše oblíbené reklamy (adSense, Directo, mLink, …). Neponechávejte stranou ani jakýkoliv související (byť vzdáleně) affiliate program. Jejich seznam najdete například na Webtrhu.

Pro statistiky mám jasnou volbu – Google Analytics. Instalace je snadná a rychlá, všechny statistiky pěkně pohromadě a přehledně. Lze spojit s adSense, což je docela dobrá fíčurka, protože přesně vidíte, ze které stránky máte nejlepší prokliky a na které by stálo trochu zapracovat. Vřele doporučuji.

Tento proces může zabrat nejvíce času, protože odladění reklam a nalezení toho správného affiliatu (a registrace do něj)  může být trochu obtížnější. Dejme tomu 1 hodina.

NakupovaniVUSA.com je jeden velký affiliate na Shipito.cz ;-) Co na to říct… snad jen, že v článcích se ještě objevuje štíhlý a vysoký adSense sloupec. GA splehlivě měří.

6.) Propagace

Máte blog? Napište o své nové stránce. Nechte zaregistrovat do katalogů, zalinkujte na něj ze svých webů a linkovacích služeb, pozvěte kamarády a známé, dejte si jej do podpisu na svém oblíbeném fóru… prostě cokoliv, jakkoliv a kdekoliv.

Závěrem…

Pokud to někdo počítal, vychází to asi na 3 hodinky čisté práce. Každý si samozřejmě svého času cení jinak, takže hodnota takového webu může být od 300,- do 3 000,- Kč. Pokud si někdo svého času cení více, nechápu proč tolik utrácí za čtení tohohle „článku“ ;) … A co dál?

  • Takto sestavený a vyladěný web můžete obratem prodat za min. 1 000,- Kč
  • Můžete za měsíc napsat 10 článků, získat nějaké ranky a web prodat za 5 000,- Kč
  • Můžete napsat 100 článků a po roce web prodat za 30 000,- Kč
  • Můžete web spravovat a rozšiřovat do aleluja a těšit se z pravidelné měsíční renty ;-)

Kterou možnost si zvolíte?

P.S.: Příště na téma: Mám v hlavě velký, seriózní a zajímavý projekt, ale nemám na něj kurva čas!