Help us understand the problem. What is going on with this article?

SlackでLINEみたいなスタンプを使いたいと言われたので

More than 3 years have passed since last update.

Slack Advent Calendar 2014 - Qiita の 14 日目の記事です。

準備が間に合わなくて、ソースコードの公開もなくただの紹介するだけの記事となってしまいました。すいません m(_ _)m

LINEからSlackへの移行

社内チャットツールをSlackに移行する前はLINEを使っていました。
移行は楽に済んだのですがLINEの「スタンプ使いたい症候群」に陥る人が多く発生してしまいました。

Slackの絵文字

Slackでは絵文字を追加することが出来ます。ですがこの絵文字の大きさは(当たり前ですが)22pxなので単体でメッセージを伝えるには小さくて見難いんです。

ss 2014-12-12 16.33.01.png

絵文字を大きくしてみる

ss 2014-12-12 16.42.04.png

絵文字の大きさはemoji-sizerにて定義されています

span.emoji-sizer {
  line-height: 18px;
  font-size: 22px;
}

このfont-sizeを124pxにしてあげれば...

span.emoji-sizer {
  line-height: 18px;
  font-size: 124px;
}

こうなります。

ss 2014-12-12 16.41.48.png

スタンプメニューの追加

ss 2014-12-12 16.54.31.png

メッセージ欄の絵文字メニューの隣にスタンプメニューを追加しました。

メニューを開くとこんな感じになります。

ss 2014-12-12 17.55.48.png

スタンプ選ぶと画像のURLがPOSTされます。

ss_2014-12-12_17_57_46.png

ss_2014-12-12_18_33_32.png

Web版Slackに埋め込む

Web版では、このようにお気に入りに埋め込むためのJavascriptを登録しています。これでいつでも絵文字の大きさ変更・スタンプボタンの埋め込みが出来るようになります。

こんな感じ

javascript:$("body").before($("<script/>").attr({src:"https://*****/*****.js"}));

ss 2014-12-12 18.07.00.png

Mac版Slackに埋め込む

Web版と同じようにJSを埋め込みます。

Slack.appのバージョン0.43までは、右クリックをすることで「Inspect Element」が表示され、インスペクターのコンソールで埋め込みが可能でした。

ss 2014-12-12 18.10.13.png

ですが最新のSlack.appは「Inspect Element」が表示されなくなっているので出来ません。

何か方法ないかなー...

iOSでスタンプ

iOS 8からのカスタムキーボードを使用します。

2014-12-12_18_06_21.png

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away