[MarsEdit] アルバムが選択できるようになった PicasaHtml2 - Textforce/DraftPad で開くオプションも♪

このエントリーをはてなブックマークに追加 Pocket

先日、[MarsEdit] iPhoto から Flickr のセットを選択して写真へのリンクを貼り付けるサービスメニュー を発表させていただきました。

私は写真を Picasa にアップロードしているので自分で使うことは今のところありません。

セット(アルバム)の指定が思いの外便利そうなので、PicasaHtml でアルバムを選択できるようにしました。

PicasaHtml2 とは

選択したアルバムの写真へのリンクを取得する機能を追加したものです。

▼起動するとアルバムを選択する画面が表示されます。アルバム選択後はこれまでの PicasaHtml と同じです。
PicasaHtml2 ChooseAlbum 1

▼取得する写真の最大枚数はアルバムを限定しない場合のみ表示されます。
PicasaHtml2 InputMaxCount

▼タグは省略可能です。
PicasaHtml2 InputTag

▼テンプレートの番号を入力してください。
PicasaHtml InputTemplateNumber

▼指定したアルバム内の画像へのリンクが MarsEdit のエディタに挿入されます。
PicasaHtml2 Result

iOS 版もあるよ

iOS 向けのブックマークレットにも機能を追加しました。

▼ブックマークレットを起動すると以下の画面が表示されます。
1000000125.png

▼アルバムを選択して
1000000126.png

▼ Get Photos!!
1000000129.jpg

▼ DraftPad か Textforce で結果を開くことができます。
1000000130.jpg

導入手順

MarsEdit 版

ダウンロードは こちら から。

セットアップ手順はまとめページをご覧下さい。

iOS 版

@matubiz さんの AmazonHtml メーカーをパクって参考にして PicasaHtml2 メーカーを作りました♪

PicasaHtml2Maker

やっぱりブックマークレットメーカーがあると楽ですよね。

さいごに

iOS 版の Open In DraftPad ですが、今回のバージョンでは DraftPad 上から実行するとエラーになります。(Safari や Textforce から実行すれば正常に動作します。)

今回、ブックマークレットのロジック部分を外部ファイルにしましたので、今後の修正は利用者の方の作業なしに反映されます。修正できた際に本ブログにてご連絡いたしますのでお待ちください。


MarsEdit 3.3App
Mac OS X 10.6.6以降
カテゴリ: ソーシャルネットワーキング 価格: ¥4,600
更新: 2011/05/27
Textforce - Dropbox text editing 2.2.8App
iPhone、iPod touch および iPad 互換 iOS 4.0 以降が必要
カテゴリ: 仕事効率化 価格: ¥450
更新: 2011/05/18
DraftPad 1.4App
iPhone、iPod touch および iPad 互換 iOS 3.1 以降が必要
カテゴリ: 仕事効率化 価格: 無料
更新: 2011/03/24

[MarsEdit] AppHtml/MacHtml 更新

このエントリーをはてなブックマークに追加 Pocket

AppHtml for MarsEdit および MacHtml for MarsEdit を更新しました。更新内容は以下の通りです。

  • 出力 HTML のフォーマットを利用者がカスタマイズ可能に

ダウンロードはまとめページよりどうぞ。

以上、ご報告のみで失礼します。

最新情報はこちら: Happy-Go-Lucky: MarsEdit

Incase Origami Workstation - iPad を Workstation に

このエントリーをはてなブックマークに追加 Pocket

もうね。完全に勢いで買っちゃいました。

Origami Workstation for iPad and Wireless Keyboard : Products By Incase
Inspired by the Japanese art of paper-folding, our Origami Workstation provides complete protection for your Apple Wireless Keyboard. It also folds quickly and easily into a stand that offers both horizontal and vertical iPad positions for flexible viewing options. Even better, it works with most iPad cases, so you can keep your iPad in its own case while you type.

Incase Origami Workstation は日本のおりがみにインスパイアされた、Apple Wireless Keyboard のケースです。なんと iPad スタンドにもなっちゃいます。

Apple Wireless Keyboard のケースはずっと探していましたが、実際のところキーボードを持ち歩いて使う機会は滅多にないので、なんとなく欲しいなぁというレベルのものでした。

先日、MarsEdit まとめページ をアップしたところ、MarsEdit の開発元である Red Sweater Software より以下のツイートをいただきました。

Great automator workflows from @toshiya240 for generating HTML in @MarsEdit. Maybe somebody could localize to English? http://t.co/0z5zmKxSun May 23 00:44:28 via Twitter for Mac

もうね、これが嬉しくて、ついついその勢いでポチっちゃいましたw

いざ、開封

▼外箱
1000000103.jpg

▼外箱の裏面には使用イメージ
1000000104.jpg

▼ケースを取り出す。斜めの線のところで折れ曲がるようになっており、これが iPad スタンドになるのだ。
1000000106.jpg

▼ケース裏面。マジックテープでケースが開かないように固定できる。
1000000107.jpg

▼ケースを開いてみる。中央のプラスチックの部品でキーボードを固定するわけですな♪
1000000108.jpg

▼ Apple Wireless Keyboard を装着してみる。あたりまえだがピッタリだ。
1000000109.jpg

▼ケースを閉じて横からみた図
1000000110.jpg

▼ iPad 2 を立てかけてみる
1000000111.jpg

▼横から見る
1000000112.jpg

▼まるでノートPCだ
1000000113.jpg

思ったよりもケースの素材は固い。iPad をしっかりと支えるためだろう。

このケースを買ったことで iPad と Apple Wireless Keyboard を持って出かけたくなった。

しかし、PC の持ち込みが禁じられているため勤め先に持って行くわけにはいかないし、 そもそも仕事中に iPad を触る時間などない。 また、私の iPad 2 は Wi-Fi モデルであるため外出時は通信できないケースが圧倒的に多い。

やはり、iPad は自宅で使うことになるだろう。

そうすると、MacBook と iPad をどのように使い分けるか、なのだが、 それはまた別のお話。(なわけないw)

[MarsEdit] iPhoto から Flickr のセットを選択して写真へのリンクを貼り付けるサービスメニュー

このエントリーをはてなブックマークに追加 Pocket

動画を用意してみました。わかりにくいかな。

事の発端

MarsEdit上で、flickrからのプレビューをflickr上で作成した「Set」のくくりで表示する方法はないものか。それができると最高なんだけどなぁ。Fri May 27 14:51:37 via YoruFukurou

なるほど。

MarsEdit のメディアマネージャから Flickr の Set が選択できる気がしたのですが、確認したらできませんでした。

むむむ。ということで作ってみました。

ダウンロードはこちらから。

【追記】iPhoto と Flickr の連携

まずは、iPhoto を Flickr と連携させましょう。

▼iPhoto の設定画面から「アカウント」を選択して左下の [+] ボタンをクリックします。
IPhoto Account

▼追加するアカウントのタイプとして「Flickr」を選択します。
IPhoto Flicker

▼はい。[設定] ボタンをクリックします。
IPhoto Flickr2

▼ウェブブラウザに認証ページが表示されますので、右側の [NEXT] ボタンをクリックします。
Flickr Authorize iPhoto Uploader

▼アプリ(iPhone Uploader)に要求されている権限が表示されますので、確認の上、[OK, I'LL AUTHORIZE IT] ボタンをクリックします。
Flickr Authorize iPhoto Uploader2

▼Flickr の Web サイトでの操作は完了です。ページを閉じてください。
Flickr Services

▼ iPhoto に戻り、以下の画面が表示されれば Flickr 連携の設定は完了です。IPhoto FlickrDone

導入手順

基本的な手順はこちらを参照してください。

カスタマイズ項目

FlickrHtml To MarsEdit workflow
設定項目説明
descformat

出力される HTML のフォーマットです。 デフォルトの値は以下の通りです。

<p><a href="${url}" title="${title} by ${username}, on Flickr"><img class="flickr_photo" src="${source}" alt="${title}"/></a><br /><cite class="flickr_photographer"><img src="http://www.flickr.com/favicon.ico" width="16" height="16"/><a href="${url}">${title}</a> Photo by <a href="${userURL}">${username}</a></cite></p>

本項目には以下の予約語が使用できます。

予約語説明
${source}写真のファイルの URL です。
${title}写真のタイトルです。
${url}写真の Flickr の Web ページ のURL です。
${username}Flickr のユーザ名です。
${userURL}Flickr ユーザの Web ページの URL です。
size

Flickr の写真のサイズを指定します。

サイズ指定説明
sqSquare(75x75)
tThumnail(100x?)
sSmall(240x?)
mMedium(500x?)
oOriginal

私は有料アカウントではないためか、サイズ指定「o」は取得できていません。

実行方法

  1. iPhoto で Flickr の Set (iPhoto 上ではアルバム) を開きます。

    アルバムの一覧で目的のアルバムを選択した状態では正常に動作しませんのでご注意ください。

  2. iPhoto のサービスメニューから「FlickrHtml To MarsEdit」を選択します。

  3. しばらくお待ちください。Flickr から写真の URL が取得できると、MarsEdit のエディタに HTML が入力されます。

    MarsEdit が起動していない場合は、MarsEdit が起動されます。エディタを開いていない場合はエディタが開きます。

実行イメージは冒頭の動画をご覧下さい。

あとがき

杏珠さんの要望としては、非公開の写真を扱いたいとのことでした。

@feelingplace @toshiya240 あ、そうです!ectoと同じ感じです(^^) 以前試して見たんですけど、画像が表示されなかったんですよ。 スクショとかならいいんですけど、eye-fiでアップした画像は非表示設定にしているので…あとでもう一回試して見ます!Fri May 27 10:38:57 via YoruFukurou

URL さえ取得できれば非公開の写真もブログで表示できそうなことは確認しました。

ただし、公開以外の写真の情報を取得するにはアプリケーションがユーザに認証されていなければならないことがわかりました。

つまり、認証処理の追加と Flickr の API コールを認証対応する必要があるのですが、現行のスクリプト言語と Yahoo! Pipes によるアーキテクチャではセキュリティを確保することができないと判断しました。

ですので、今回のバージョンで扱える写真は公開されているもののみとなります。

[MarsEdit] Markdown 記法でブログを書く

このエントリーをはてなブックマークに追加 Pocket

もともとは @fujimotta さんに教えてもらったんですが、先日 MarsEdit まとめを書く際にやはり便利でしたのでエントリしておきます。

Markdown 記法って?

Markdown 記法ってご存知でしょうか。

以前、Markdown 記法で HTML と疎遠になる という記事を書いたのですが、Markdown 記法についてはあまりに手抜きをしていたのでここでまとめておきます。

Markdown - Wikipedia
Markdown(マークダウン)は軽量マークアップ言語の1つである。入力する形式と出力される形式の両方について、読みやすさと「発行のしやすさ (publishability)」の最大化を支援することを目的として、John GruberとAaron Swartzによって作成された。

私は以下のように考えています。

Happy-Go-Lucky: Markdown 記法で HTML と疎遠になる
Markdown 記法を用いることで、以下のメリットが得られると私は考えます。
  • 素早く書ける
  • 編集しているテキストが見やすい

ここでは Markdown 記法のすべてを説明することはせず、私がよく使用するものに限定して説明します。

見出し

見出しは以下のように書くことができます。

# 見出し1(h1)
## 見出し2(h2)
### 見出し3(h3)
#### 見出し4(h4)
##### 見出し5(h5)
###### 見出し6(h6)

引用

引用はメール的です。

> Markdown(マークダウン)は軽量マークアップ言語の1つである。
> 入力する形式と出力される形式の両方について、読みやすさと
> 「発行のしやすさ (publishability)」の最大化を支援することを目的として、
> John GruberとAaron Swartzによって作成された。

箇条書き

番号なし(ul)の書き方は以下の通りです。

* 素早く書ける
* 編集しているテキストが見やすい

'+' や '-' を使うこともできます。

番号つき(ol)の書き方は以下の通りです。

1. はじめに
2. つぎに
3. さいごに

'番号.' の後ろにはスペースが必要です。

リストの中に段落や引用を含めたい場合は、空行を入れた上で行頭に 4 つのスペースまたはタブ文字を入れます。

1. はじめに

    本エントリでは。。。
    > Markdown とは、。。。

2. つぎに
3. さいごに

リンク

リンクの書式は以下の通りです。

[<リンクテキスト>](<リンクURL><リンクタイトル>)

私の場合、リンクを Markdown で書くことはそれほど多くありません。 リンクはブックマークレットやプラグインで生成することがほとんどだからです。

Markdown 記法には他にも水平線や画像リンク、テキストの装飾などがありますが、ここでの紹介は割愛します。

参考

MarsEdit で Markdown

MarsEdit で Markdown を利用するには、以下の方法しかないと思っていました。

  1. Showdown - Markdown in Javascript で HTML に変換して MarsEdit のエディタに貼り付ける。
  2. WordPress の PHP Markdown プラグインを使用するなどしてブログシステム側で Markdown が変換されるようにする。 Tumbler と Posterous はもともと Markdown をサポートしています。 →Markdown 記法で HTML と疎遠になる

そこで出会ったのが以下の記事です。

想造ノート: あれ、もしかしてMarsEditってMarkdown記法できるんじゃね?

でもって、以下の会話で教えていただきました。

@sozonote プレビューのフィルタはありますよ〜。でも、残念ながら Blogger ではそのまま投稿してもダメです。Tue Apr 13 01:32:29 via TweetList Pro

@toshiya240 一旦RichTextModeに切り替えてやると変換してくれるかもです!Shift+Command+Tです!Tue Apr 13 06:57:40 via Twitter for iPhone

そう、MarsEdit だけで Markdown を HTML に変換することができるのです!

ということで手順です。

プレビューフィルタを Markdown に設定する

▼メニューの [Blog] > [Edit Settings...] からブログの設定画面を表示してください。 [Editing] タブの [Preview Text Filter] を「Markdown」にして [OK] ボタンをクリックします。 MarsEditPreviewFilterSetting

プレビューフィルタを設定することで、エディタに Markdown 記法で書くと該当する HTML を書いたかのようにプレビューに表示されます。

Markdown のサンプルPreview of  Markdown のサンプル

Markdown 記法で記事を書く

▼こんな感じで書いていきます。 MarsEditWritingWithMarkdown 1

Markdown から HTML に変換する

書き終わったら、おもむろに

⌘ + ⇧ + T

です!

▼こんな画面が表示されるので、[Convert] ボタンをクリックしてください。 MarsEditMessage

HTML への変換結果をチェックする

もう一度

⌘ + ⇧ + T

を押して、HTML 編集モードに戻します。

▼ [Convert] ボタンをクリックしてください。 MarsEditMessage2

多分、意図していない HTML になっている部分があるはずですw

ポスト

チェックが終わったらポストしましょう。

さいごに

Markdown のメリットについてもう一度引用します。

Happy-Go-Lucky: Markdown 記法で HTML と疎遠になる
Markdown 記法を用いることで、以下のメリットが得られると私は考えます。
  • 素早く書ける
  • 編集しているテキストが見やすい

と言っても、適材適所で使い分けるのが実際的だと思います。

あ。そうそう。プレビューに出来上がりイメージが表示されるので、HTML に変換しないままポストしてしまうことが私にはありました。要注意ですw