Blog Hacks 2011

Blog Hacks 2011Kamakura.pm Techtalk #01

yusukebe

Back toYAPC::Asia 2010

Photo by ya-ko http://ya-ko.com/blog/

Blog

I said

Blog Hacks

by naoya and miyagawa

2004 2011

BlogBloggingHack on Blog Hacks (2004)

Blog Hacks 2011

Blog

MovableType

BlosxomPerl...

CSSHack

Hack#01 CSS Framework

Blog

Grid Layout Reset Font

I love Bluetrip!

Simple Markup24-column grid

An empty starter kitCool font style

Markup with Bluetrip

Welcome! This is h2 title. description... Side menu Here is footer

Result!

Hack#02 iPhone

use Media QueriesCSS

/* media queries */@media only screen and (max-width: 479px) { body { margin: 1.5em; } #header h1 { font-size: 200% } #content { font-size: 170%;line-height: 1.5em; } pre { overflow:auto; }}

Result!

JavaScriptHack

Hack#03 YouTube

YouTube Data API

JW Player

var url = 'http://gdata.youtube.com/feeds/api/videos?' + 'author=yusukebe&v=2&alt=jsonc&callback=?';

$.getJSON(url,function(json){ var playlist = new Array(); $.each(json.data.items,function(){ var video = { file : 'http://www.youtube.com/watch?v=' + this.id, title : this.title, description : this.description }; playlist.push(video); }); play(playlist);});

function play(list){ jwplayer('player').setup({ 'flashplayer': 'player.swf', 'id': 'playerID', 'width': '950', 'height': '400', 'playlist.position': 'right', 'playlist.size': '440', 'controlbar': 'bottom', 'playlist': list });}

Result!

PerlMovableTypeHack

Hack#04 Perl

MovableType

preText::VimColor

Text::VimColorCSS

MovableType Plugin

package MT::Plugin::VimColor;use Text::VimColor;use HTML::Entities qw/decode_entities/;use MT::Template::Context;

MT::Template::Context->add_global_filter(vim_color => &highlight );

sub highlight { my $text = shift; my @codes = $text =~ m!(.+?)!igms; for my $code (@codes) { my $syntax = Text::VimColor->new( string => decode_entities($code), filetype => 'perl' ); my $new_code = $syntax->html; $text =~ s/\Q$code\E/$new_code/; } return $text;}

1;

Result!

BlogHack

Hack#05 pubsubhubbub

pubsubhubbub

pubsubhubbub

AnyEvent::Feed

AnyEvent::HTTP

use URI::Escape;use AnyEvent;use AnyEvent::HTTP;use AnyEvent::Feed;my $cv = AnyEvent->condvar;my $feed_reader = AnyEvent::Feed->new( url => 'yourfeedurl', interval => 10, on_fetch => sub { my ( $feed_reader, $new_entries, $feed, $error ) = @_; if ( defined $error ) { warn "ERROR: $error\n"; return; } publish_pings(); });$cv->recv;

sub publish_pings { my %form = ( "hub.mode" => 'publish', "hub.url" => 'yourfeedurl', ); my $body = join "&", map { "$_=" . URI::Escape::uri_escape( $form{$_} ) } keys %form; for my $hub ( qw( http://pubsubhubbub.appspot.com )) { http_post $hub, $body, sub { warn "$hub:$_[1]->{Status}"; } }}

ref: http://github.com/miyagawa/cpan-realtime-bot

Result!

Hack

DISQUSFacebookBlosxomCMSBlog

Enjoy Hacking Blogand ...

Keep on Bloggingby