Webの記録

Photoshopのテキストレイヤーからテキストを抽出する方法

投稿日:2012年11月8日 更新日:

この記事は約 4 分で読めます。

Photoshopで作られたカンプからコーディングをする時に、テキストレイヤーにある文字をいちいち入力するのは面倒だと思いつつ、今まで全て手打ちしてました。。。時間ロスと入力ミスをたくさんして、大変でした★

Photoshopのテキストレイヤーからテキストを抽出する方法がありました。

こんな便利な方法は忘れないようにメモ!です。

今回メモするのは、「PS_Bramus.TextExport-1.3」というスクリプトを利用する方法と、「PhotoshopとExcel」を利用する方法の2つです。

【2015.6.24追記】「PS_Bramus.TextExport-1.3を使った方法」の最後にAdobe Photoshop CC 2015へインストールする方法を追加しました。


目次

  1. PS_Bramus.TextExport-1.3を使った方法
  2. PhotoshopとExcelを使った方法


1.PS_Bramus.TextExport-1.3を使った方法

PS_Bramus.TextExport-1.3をダウンロードします(Bram.us)

PS_Bramus.TextExport-1.3をPhotoshop内にインストールします。(インストール方法は、下にある「参考サイト」をチェックしてみてください。)

(2回目以降はここから)Photoshopでテキストレイヤーを抽出したいPSDファイルを開きます。(画像は実験のためにテキストを打っただけのPSDファイルを開いたところです)

Photoshopの「ファイル」→「スクリプト」→「PS_Bramus.TextExport-1.3」を選択します。
複数のファイルをPhotoshopで開いている場合は、ここで複数処理するかを聞いてきます。

上記の分でtxtファイルが書きだされるので、これをエディタソフトで開くとテキストのみ抽出されています。(画像化したテキストは抽出出来ません)
ちゃんとレイヤーごとに整形してくれているので分かりやすいです!



参考サイト
  • Brau.us」・・・スクリプトのダウンロードとWindowsの場合のインストール方法が書かれています
  • blockworks」・・・Macの場合のインストール方法が書かれています




【2015.6.24追記】

この記事を書いた時はCS4で試していたのですが、私の環境ではCS5とCCでも使えました。(2014.8現在は、CCとCS5で使用しています)

上記サイトでダウンロードしたものを、CCにインストールする場合、私の環境では以下の所に「PS_Bramus.TextExport-1.3.jsx」を入れ込みました。

動作は、CS4,CS5,CCとも変わらず出来ました。

【CCの場合のインストール方法】
Photoshopが保存されている所(Adobe Photoshop CC等の名称のフォルダー)→「Plug-ins」→「Panels」→「ps_bramustextexport-13(上記をダウンロードした時のフォルダーごと入れ込む)」

使用方法などはCS4,CS5,CCともに同じでした。

【CC2015の場合のインストール方法】
Photoshopが保存されている所(Adobe Photoshop CC 2015)→「Presets」→「Scripts」に「ps_bramustextexport-13(上記をダウンロードした時のフォルダーごと入れ込む)」



2.PhotoshopとExcelを使った方法

※特に何もダウンロードせず、Excelが使える人はこちらの方法も良いかもしれません。
ただし整形は自分でExcelを使ってするのでExcelの操作に慣れない場合は、「PS_Bramus.TextExport-1.3」の方法がオススメです。

Photoshopでテキストレイヤーを抽出したいPSDファイルを開きます。

「ファイル」→「ファイル情報」→「詳細」で以下の画像の画面が出てきます。
ここで「保存」もしくは「書き出し」でOKします。

保存先に、xmpファイルが出来ているのでこれをExcelで開きます。
元データの形式は「カンマやタブなどの・・・」でも「スペースによって・・・」でもOK!文字コードは「UTF-8」にします。

以下の画像のように、Excelで開いたファイルは不要な行がたくさん入っています。必要な部分「photoshop:LayerText」がある行のみ抽出し、それ以外は全て削除します。

あとは、必要に応じてテキストエディタにコピペしたりして使います。

-Webの記録
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

苦手なJavaScriptをイチから勉強してみる【イベント編】

この記事は約 1 分で読めます。 苦手なJavaScriptをイチから勉強してみる【基本準備編】の続きとしてメモします。 イチから「JavaScript」を学び直しをする為に記録を残しています。少しず …

no image

WordPressサイト内検索でのキーワードが分かるプラグライン「Search Meter」を試してみた。

この記事は約 1 分で読めます。 アクセス解析をしていると、どんなキーワードで検索されたのか?を知ることができます。 しかし、キーワードを入力して検索できなかった結果を知る事はなかなか知る事ができない …

no image

Chromeの拡張機能FireBugとSnifferを入れてみた♪

この記事は約 1 分で読めます。Webサイト作っている時、大活躍しているのがFirefoxの「FireBug」です。 私が確認しているブラウザは、IE,Firefox,Safari,Chromeですが …

no image

Facebookページ コメント返信機能の設定をしてみた!

この記事は約 1 分で読めます。 Facebookページにコメントに対するコメントの返信、どのようにされてましたか? 私は都度相手の名前を入れて、誰に対する返信なのかを表示していました。 今回「返信機 …

no image

パソコンでスマホやタブレットの表示を確認出来るGoogle Choromeデベロッパーツール

この記事は約 1 分で読めます。Webサイトを制作する時、コーディングしながら都度いろんなブラウザで表示確認をします。 レスポンシブサイトとなると、今まで以上に表示をいろいろ確認しながら・・・の作業に …