webdesign / development + awesome
Robíme WordPress #3 - WordPress Loop
Vylepšíme tému, rozložíme ju na viac template files a tie rozhýbeme WordPress Loop-om.
WordPress Loop je akýsi základný stavebný kameň WordPressu.
Keď si vyžiadame vo stránku, WP sa pozrie do nastavení v dashboarde, podľa nich vytiahne príspevky z databázy a uloží si ich. WordPress Loop je funkcia, ktorá k týmto uloženým informáciám pristupuje a po jednej nám ich všetky dovolí vypísať a robiť s nimi veci.
A to si ukážeme.
A ukážeme si aj HTML5 a veci okolo.
Pretože v našej téme budeme používať nové HTML5 elementy.
A to všetko do ľúbezných rytmov kráľa fontány, Vasha P.
Stiahnite si vyrábanú tému: amazeballs_v023.zip
Robíme WordPress #2 - Úvod do tvorby tém
Dnes si vytvoríme prvú vlastnú tému, yay!
Bude veľmo veľmo jednoduchá, žiadne zázraky nečakajte. Ale bude.
Témy:
- sa starajú nielen o výzor ale aj o funkcionalitu
- sú kolekcia súborov, ktoré spoločnými silami dajú stránku do pohybu
- potrebujú minimálne 2 súbory - style.css a index.php (napríklad)
- môžu okrem Template Files obsahovať súbor functions.php
- existujú
A tak ďalej. Pozri si video, dozvieš sa viac:)
Ospravedlňujem sa za kvalitu zvuku, je menej než ideálna. Snažil som sa odfiltrovať kopu okolitého rámusu, z čoho mi vychádza, že by mi niekto z vás mal kúpiť RØDE Podcaster ;)
Ostatné seriály nájdeš na yablko.sk, kde ma môžeš aj podporiť. Dík!
Prípadne ma sleduj skrz @yablko.
Hudba je od Neural Corrosion a dá sa stiahnuť (zadarmo, bitches!) na neuralcorrosion.com. Ak poznáš Stevena Wilsona, prípadne ak sa ti páči psychedelicko-divný rock, budeš tam ako doma.
Robíme WordPress #1 - inštalácia, prehľad features
Čo robíme:
- stiahneme a nainštalujeme wordpress
- prebehneme jeho administrátorské rozhranie (
dashboard) - zbehneme základné features
- ukážem ako cez DB resetnúť administrátorské heslo
- ukážem trik, ako WP nakopnúť do debug módu
- metal
Ak s WP pracuješ, ak ho poznáš, ak ho máš nainštalovaný.. preskoč toto video. Nepozeraj ho. Skapeš od nudy. A nehovor, že som ťa nevaroval;) But there IS metal, so.. je to na tebe.
Ostatné seriály nájdeš na yablko.sk, kde ma môžeš aj podporiť. Dík:)
Prípadne ma sleduj skrz @yablko.
Hudba od @tscorbeaux, k stiahnutiu cez bandcamp. Enjoy!
Advanced PHP Trickery
Viete čo sú v PHPčku anonymné funkcie, closures, ako fungujú statické premenné vo funkciách a načo je register_shutdown_function()? Ak nie, ste na správnom mieste, za 2 minúty to budete vedieť a budú z vás neporaziteľní mágovia PHP. Ak to už viete, môžte sa spokojne potľapkať po chrbte, znamená to, že ste asi s PHP strávili viac času, ako by bolo zdravé :)
Poďme si tieto 4 veci vysvetliť na krátkom príklade "zo života". Predstavte si, že máme triedu na odosielanie SMSiek. Ale predtým než začneme posielať SMSky, sa treba prostredníctvom triedy pripojiť k serveru a po doposielaní všetkých SMS sa treba odhlásiť.
My sa však nechceme zaoberať takými blbinami ako pripájanie a odpájanie. Cheme mať len globálnu funkciu send_sms(). Na to použijeme celkom elegantné riešenie, v ktorom budú obsiahnuté všetky spomínané advanced koncepty.
Statické premenné vo funkciách
function send_sms($number, $text)
{
static $connection = false;
if (!$connection)
{
require_once('extensions/SMS/connect.php');
$connection = new SMSConnect();
if (!$connection->create("login","heslo")) return false;
Statická premenná vo funkcii si zachováva hodnotu v rámci všetkých volaní danej funkcie. Pri prvom spustení bude obsahovať hodnotu false. Podmienka nižšie sa teda vykoná, do premennej $connection strčíme SMSkovú triedu a pripojíme sa k serveru. Pri ďalšom spustení funkcie bude v premennej SMSková trieda a celý tento blok "if" sa preskočí.
V OOP sa zvyknú používať statické premenné vo vnútri tried, každopádne je dobré vedieť, že sa dajú použiť aj vo vnútri funkcií. V manuále nájdete ďalšie príklady využitia.
$callback = function() use($connection)
{
$connection->Logout();
};
register_shutdown_function($callback);
Na tomto čudnom kúsku sa nachádzajú zvyšné 3 koncepty. V skratke docielime, že keď dobehne PHP skript, zavolá sa odhlasovacia metóda SMSkovej triedy.
Achievement unlocked!
Awww, chudák náš úbohy blog, nejak sme ho v poslednej dobe ignorovali. Za to všetko môže evil škola! (a zajtra.sk ;) But we're back in business a povieme si ako v PHP spraviť nejakú riadnu sprostosť - napríklad achievement generator™.
Myšlienka za ním bola asi taká, že pokiaľ sa niekto zvykne velice chváliť nepodstatnými blbosťami a lezie s tým na nervy, pošlete mu takýto obrázok a možno to bude mať zaujímavý efekt. Pokiaľ ste za posledných pár rokov hrali nejakú novšiu hru, určite vašej pozornosti neuniklo, že vás zasypávajú kadejakými trofejami a achievementami pri každej príležitosti. (Niekoho to akože aj reálne teší? Podľa mňa je väčšina vývojárov dosť slabých psychológov, súdiac podľa toho aký majú achievementy na mňa efekt. :p)
Demo - brm achievement generator™!
Čo sa týka programovania, budeme chciet písať text na obrázok pomocou knižnice GD a odosielať ho ako PNG, plus využijeme nejaký ten URL shortener, aby vaša "obeť" nevidela čo jej to posielate. Všetko samozrejme pôjde cez AJAX.
PHP html/plaintext email
Čo to o posielaní mailov sme si povedali v našom článku Informácie o prehliadači v kontaktnom formulári (je to fakt užitočná vec, go check it out). Teraz prišiel čas podeliť sa o php funkciu, ktorá vie posielať html aj plaintext emaily. Naraz. Behold:
/**
* odosiela multipart spravy - html aj plaintext pre hnilych klientov
* linky pri plaintext mailoch su zamenene za samotne "href" hodnoty
* html tagy a uderene charaktery su pri nich odstranene a "<br>" je zmenene na "\n"
*/
function send_mail($from, $subject, $body, $plaintext = NULL, $to = NULL)
{
// ak neni zadany to, zvoli sa defaultny:
if (!$to) $to = 'default@mail.sk';
// zostavi html mail:
$html = "<html>\n";
$html .= "<body style=\"font-family: Verdana, Geneva, sans-serif; font-size: 14px; color:#333;\">\n";
$html .= $body;
$html .= "</body>\n";
$html .= "</html>\n";
// ak neni zadany plaintext, zostavi sa z povodneho html mailu:
if ( ! $plaintext)
{
// odstrani "\n" a potom nahradi "<br>" za "\n" pre plaintext:
$body = preg_replace('/<br\\s*?\/??>/i', "\n", str_replace("\n", '', $body));
// odstrani tagy (okrem <a>)
$plaintext = strip_tags($body, '<a>');
// matchne "<a>" tag a jeho "href" hodnotu:
$pattern = '%<a\s[^>]*href=["/\'](.*)["/\']\s*>(?:.*)</a>%im';
preg_match_all($pattern, $plaintext, $matches, PREG_SET_ORDER);
// vymeni nazov linku za "href" hodnotu a na koniec prida medzeru
// (vraj to pomaha)
foreach ($matches as $link)
{
$plaintext = str_replace($link[0], $link[1] . ' ', $plaintext);
}
// odstrani interpunkciu a prehodi html entities na text
$plaintext = remove_accents(html_entity_decode($plaintext));
// prida newline na konci plaintext mailu (bez toho to blbne):
$plaintext .= "\n";
}
# -=-=-=- MIME BOUNDARY
$mime_boundary = "----AWESOME----" . md5(time());
# -=-=-=- MAIL HEADERS
$headers = "From: $from\n";
$headers .= "Reply-To: $from\n";
$headers .= "Return-Path: <default@mail.sk>\n";
$headers .= "MIME-Version: 1.0\n";
$headers .= "Content-Type: multipart/alternative; charset=UTF-8; boundary=\"$mime_boundary\"\n";
# -=-=-=- TEXT EMAIL PART
$message = "--$mime_boundary\n";
$message .= "Content-Type: text/plain; charset=UTF-8\n";
$message .= "Content-Transfer-Encoding: 8bit\n\n";
$message .= $plaintext;
# -=-=-=- HTML EMAIL PART
$message .= "--$mime_boundary\n";
$message .= "Content-Type: text/html; charset=UTF-8\n";
$message .= "Content-Transfer-Encoding: 8bit\n\n";
$message .= $html;
# -=-=-=- FINAL BOUNDARY
$message .= "--$mime_boundary--\n\n";
# -=-=-=- SEND MAIL
$subject="=?UTF-8?B?".base64_encode($subject)."?=\n";
$mail_sent = @mail( $to, $subject, $message, $headers );
return $mail_sent;
}
Kopírujte, prípadne si stiahnite súbor priamo: awesome_email.zip
Prečo? Nuž, HTML je v emailových klientoch podporované extrémne biedne. Niektoré ho nepodporujú vôbec, iné dokážu správu zhovadiť tak, že sa stane pre mnohých nepoužiteľná. Prudký geek z takého mailu linky vyťažiť dokáže, obyčajný Joe sa tým zaoberať nebude a váš business je ohrozený :P Niekedy to dokonca nemusí byť možné. Ak máte link v tvare <a href="http://awesome.bla/gule">haha link</a> a ono vám z toho náhodou spraví haha link? Useless. Táto funkcia pre plaintext časť emailu vytiahne adresu a zobrazí tú.
Pre väčšiu kompatibilitu odstráni aj interpunkciu a prehodí html entities na text. Keď už osekávame, tak poriadne ;) Na interpunkciu používa funkciu remove_accents, ktorú sme spomínali v článku Generovanie pekných URL. Je súčasťou toho .zipu tam hore.
$from mail, z ktorého bude správa poslaná (od koho)
$subject predmet mailu
$body text mailu
$plaintext ak chceme, môžeme plaintext pridať pridať sami, inak sa vygeneruje z $body
$to mail, na ktorý bude správa poslaná (komu)
Ak sa divíte, prečo sa mail "komu" zadáva ako posledný atribút... častejšie(?) budete chcieť, aby maily boli posielané vám. Prípadne klientom, ak robíte stránku pre klienta. Cez kontaktný formulár napríklad. A vtedy stačí napísať vašu adresu priamo do tela funkcie (namiesto default@mail.sk) a potom používať len prvé 3 atribúty.
Like this: send_mail($_POST['email'], 'Ahoj', 'Smrdí ti.');
Ak to nevyhovuje, nič vám nebráni prepísať si funkciu podľa seba :) Vráti TRUE ak sa mail podarilo odoslať, inak FALSE. Takže tak.
Enjoy. :)
Jednoduchý export z PHP do Excelu
Je veľká šanca, že pokiaľ robíte webovú aplikáciu s akýmikoľvek tabuľkovými dátami, ktorá je určená pre ne-IT ľudí, budú od vás chcieť export údajov do Excelu. Ak nemajú veľmi obskúrne požiadavky (grafy, farebne odlíšené políčka, ...), môžete im pomerne jednoducho spraviť radosť - here's how:
V prvom rade nebudeme používať .xls, lebo to je škaredý binárny formát :), ale primitívny formát .csv (comma-separated values), ktorý vie Excel čítať a basically vyzerá takto:
Stlpec1,ďalší stĺpec,ešte stĺpec...
10,12,42
32,23,64
128,0,256
Na stránke asi používate UTF-8, takže samozrejme bude v Exceli problém s diakritikou a špeciálnymi znakmi. Problémy s enkódovaním sa dajú riešiť tak, že zakódujete súbor do Unicode a ako oddeľovače použijete taby (namiesto čiarok). Unicode sa dá vyjadriť veľa spôsobmi (UTF-8 je jedným z nich), ale Excel a Windowsovské veci vo všeobecnosti rozumejú iba UCS2/UTF-16 with BOM, čo znamená, že všetky znaky sú 16-bitové a súbor má na začiatku špeciálny znak (Byte Order Mark) udávajúci usporiadanie bitov (Big Endian alebo Little Endian - Windows používa ten druhý).
Vygenerované .csv nakoniec treba browseru odoslať ako súbor (inak by sa namiesto download okna zobrazil obsah súboru v prehliadači), na čo stačí zmeniť HTTP hlavičky.
$export = "Stlpec\tĎalší stĺpec\tEšte stĺpec\n";
while ($o = mysql_fetch_object($res)) $export .= "$o->stlpec\t$o->dalsi\t$o->este\n";
header('Content-type: text/csv');
header('Content-Disposition: attachment; filename="drist.csv"');
echo chr(0xFF).chr(0xFE) // BOM pre Little Endian
.mb_convert_encoding($export, "UCS-2LE", "UTF-8"); // konvertujeme z UTF-8 do UCS2/Little Endian
Pro tip: ak by sa v samotných hodnotách mali objaviť taby (čo to máte pre boha za údaje? :), treba celú hodnotu dať do úvodzoviek:
"I can has tabs" bla dríst
4 komentáre 

