はてなブックマーク

キーボードだけでChromeをすべて操作できる拡張機能「Vimium」をご紹介 ショートカットを増やす、なんてレベルじゃない まずは1週間使ってみて！ 目指せ脱マウス！ NICOAをご覧頂きありがとうございます、どんぎ(@_Donngi)です。 マウスで選んで、ポチポチ選択。 どんなアプリでも、まずはじめはここから入ると思います。 それがだんだん慣れるにつれ、ショートカットやジェスチャーなど、とにかく早く動かすための方法を探すようになってくる。 さらに来るとこまで来ると、全部キーボードだけで動かしたいなんて思うようになりますよね? 「うんうん、なるなるー！！」今日はそんなふうに共感してくれる、みなさんに向けた記事。Chromeを全部キーボードだけで操作できるようになる拡張機能、「Vimium」のご紹介です。 全リンクにショートカットがつく 説明するより見たほうがはやい！というわけでこちら。

といった感じ。実際のアプリの画面はこんな具合です。 UIはよくあるチャットアプリなんですが、かゆいところに手が届くのなんの。会話の管理からデータ共有まで、一度使ったらもう離れられません。 チャンネルがコミュニケーションの中心 Slackの会話グループは、LINEでいう「グループ」の中に「話題ごとのページ」があるようなイメージになっています。 もう少し詳しくいうと、 の2つからできていて、1つのワークスペースの中に、複数のチャンネルがある構造です。 話題ごとにページが分かれている理由は、ビジネスではやり取りするメッセージの数が膨大だから。 ほら、LINEの1個のグループに「未読1000件」とかあったら、読むの辞めちゃうじゃないですか。 プライベートと違い、1日に何百何千のメッセージを受け取るビジネスでは、こんなことがしばしば。なので、話題ごとに小分けで会話がまとまっていたほうが、みやすいんで

捨てられてしまう食品と人を繋ぐ「Reduce GO」の紹介記事 残り物をわざわざ探すメリットを生む、とてもよく考えられたシステム NICOAでは全力で応援していきます すばらしすぎるプロダクト。 NICOAをご覧頂きありがとうございます、Jimon(@jimon_s)です。 621万トン。100万頭のゾウさんと同じくらいのこの重さ、いったいなんの量かわかりますか？ 答えは、日本で1年に捨てられるまだ食べられる食品の量。 もったいない、というよりも悲しくなってきますよね。 「食品」と簡単にいうものの、元は僕たちと同じ「限りある命」。それが食べられることもなく、ゴミとして処理されてしまうのですから、申し訳なさでいっぱいになります。 かといって、飲食店を経営するなら余剰を出さざるを得ないのもまた事実。毎日売り切ればかりでは、店がまわりませんもんね。 解決の糸口が見えなかったこの問題。この度解決を

iPhoneの写真バックアップ方法を比較 iCloud、GooglePhotos、Amazon Prime Photosの3種をレビュー 無料ならGooglePhotos、プライム会員ならAmazon Photosがオススメ 突然の事故に備え、とっておきたいバックアップ。中でも思い出の詰まった写真のデータは、なにがなんでも守りたいところです。 でも今はバックアップの手法もたくさんあって、どれを使ったらいいか迷っちゃいますよね。「ラクに、安く、安心して使いたい、だけどどれがいいのかわからない」、そんな方も多いのではないでしょうか？ そこで今回はiPhone1台だけでバックアップがとれることを条件に厳選した、主流な3つのクラウドサービス

別次元の快適さ！ウィンドウ移動に革命を起こすMacアプリ「Flexiglass」どこをドラッグしても移動可能に！ これはいいアプリに出会いました！ NICOAをご覧頂きありがとうございます、Jimon(@jimon_s)です。 パソコン作業における基本の基、「ウィンドウの移動操作」。 Finder、ブラウザ、メモにエディタとパソコン作業をしていると多くのウィンドウを立ち上げることになりますが、使えるスペースは限られているので使いたいものを都度移動して使うことになりますね。 今回はそんなウィンドウ移動をとっても快適にしてくれるMacアプリ「Flexiglass」を見つけたのでご紹介します。 まさに「革命」と言えるレベルのアプリです！ なにができるの？ 「Flexiglass」はMacの制御系アプリ。 制御系アプリというのは立ち上がっているとMacに機能を追加してくれるアプリのこと。有名所では

断線したLightningケーブルを無料で交換してもらう方法。iPhone付属のイヤホンなどでも使えます！ iPhone5S発売から2年、6発売から1年が経ちました。 毎日使うモノなので、そろそろ本体やアクセサリにガタが来ている方も多いのでは？ 僕の周りで特に多いのが「Lightningケーブルが断線した」という事案。 ほぼ毎日、人によっては1日に何度も使うものなので、仕方がないといえば仕方がないですね。 とはいえケーブルがないと充電ができず、iPhoneが使えません。 「新しいケーブルを買うよ！」という方も多いかと思いますが、実は壊れたライトニングケーブルは「無料で交換してもらえる」んです。 今回はLightningケーブルを無料で交換してもらう条件と方法をご紹介します。 同じ方法でイヤホンなども交換してもらえるようですよ。 条件は1つ！保証期間内であること！ Lightningケーブル

「あるファイルを決まった時間にEvernote へ送れたら」。 これ、できたらすごい便利だなぁと、ずっと思っていました。 たとえば、大量の写真やpdfを送るとき。 今すぐ送ると今月の容量が尽きてしまう。なので、リセット期限ギリギリに送りたい。容量の少ない無料プランでは、よくあるシチュエーションですね。 他には、作業のバージョン管理をしたいとき。 1日のおわりに、編集中のファイルを自動でEvernoteに送れれば、日ごとのバージョン管理が楽にできる。全自動なら余計な手間もかかりません。 こんなニーズを叶えるべく、今回指定した時間にEvernoteにファイルを自動で送る仕組みを作ってみたので、仕組みと作り方をご紹介します。 アイティア次第でいろいろな使い方ができると思うので、みなさんもぜひ作ってみてください。 こんな仕組みを作っていくよ まず、今回作る仕組みの完成形をみてみましょう。 完成する

絶大な人気を誇るWordpressテーマ「Stinger」。 最新版のStinger5はどのデバイスから見ても見た目が自動で最適化される「レスポンシブデザイン」を採用しています。 大きなウィンドウでも小さなウィンドウでもキレイにサイトが表示され、よりユーザーフレンドリーになりました。 この魔法のような表示の秘密は「style.css」にあります。 cssを画面の横幅で分岐させることでレスポンシブデザインを可能にしているんですね。 今回は「style.css」のどの部分がどのデバイスに適応されているのかを分析してみたいと思います。 これを読んで頂けばcssの最後にある「}」がなんのためのものかもわかりますよ。 ※class,id構造が知りたい方はこちら: Stinger5カスタマイズ！最新版class,id構造早見表 -トップページ編- 「style.css」のざっくりした構造 デフォルトの

Stinger5カスタマイズ！目指せ収益UP！管理画面のウィジェットのみで広告の場所を変える方法（ダブルレクタングル対応） 自分のサイトを持っていれば誰もが気になる「サイトの収益」。 収益がすべてではないにしても、やっぱり利益があると嬉しいですよね。 広告の場所を変えてみたり、枠の大きさを変えてみたり、高い収益を上げるためにはしっかりとした分析が重要です。 でもこうした分析って意外と大変。 広告の場所ひとつにしてもコードを直接触らないと変更することはできません。ある程度の知識がないと思うようにはいかないので、初心者の方にはとっつきにくいかもしれませんね。 そこで今回は管理画面のウィジェットだけで広告の表示場所を変える方法をご紹介します。 一度設定してしまえば今後の管理がとっても楽になりますよ。 完成するとこうなるよ！ まずは完成形のご説明から！ 今回のカスタマイズを終えると管理画面に各場所

WordPressスライダープラグインの決定版！「Dynamic Content Gallery」の使い方 ホームページのデザインで一番こだわりが出るのはやはりトップページではないでしょうか。 あまり派手すぎても見づらいし、地味すぎるとぱっとしない、頭の悩ませどころです。 僕の場合は大きなコンテンツスライダーを表示してページの見た目を引き締めています。 見るたびに違う画像が出てくると見ていて飽きませんし、スライドの色味がサイトの表情をがらっと変えてくれます。 今回は記事からコンテンツスライダーを自動生成してくれるプラグイン「Dynamic Content Gallery」を紹介していきます。 Dynamic Content Galleryって？ Dynamic Content Galleryは選択したカテゴリーから自動的にスライドを作成してくれるWordpressプラグインです。 記事を書

Stinger5カスタマイズ！記事一覧をオシャレな写真付き2カラムにする方法、もちろんレスポンシブ対応だよ 最近いろんなサイトで見かける「大きな写真に記事タイトル」というカード型デザイン。 スタイリッシュでカッコイイ上どんな記事かひと目でわかる、まさにいいことづくめのスタイルです。 今回はStinger5であのデザインを再現してみたいと思います。 完成するとこんな感じになりますよ。 ※Stinger3で同様のカスタマイズをしたい方はこちらの記事をご覧ください。 カスタマイズ概要 まず記事一覧の背景色を消去します。 つづいてカテゴリーや抜粋分などいらないものを取り除いていきます。 最後にcssで見た目をカード型に整えて、今回のカスタマイズはおしまいです！ カスタマイズ手順 Step1 main部分の背景色を透過 まずは背景色の透過から。main部分の白背景を消去します。 ただし！「style

という方針でカスタマイズしていきます。 全ページから削除したい場合 カスタマイズ概要 全ページから削除する場合、変更するのは「sidebar.php」と「style.css」の2つのみ。 はじめに「sidebar.php」を編集して、読み込む中身をなくしてしまいます。 次に「style.css」を調整して見た目を整えれば完成です。 Step1 「sidebar.php」の中身をなくす まず「sidebar.php」に書いてある中身を全削除してください。 これで読み込んだ中身をなくせます。 ※サイドバーを復活させる可能性が少しでもある場合はどこかにメモをとっておいてくださいね Step2 cssを調整 このままだとサイドバーがなくなった分余白や大きさがおかしくなっています。 修正のために以下のコードをcssの「領域④」に追記してください。 (Stinger5のstyle.cssはデバイスごと

ついにレスポンシブとなった大人気Wordpressテーマ「STINGER5」 SEOの強さとカスタマイズ性の高さがその人気の理由ですね。 多くの方が使われているのでカスタマイズ記事が多いのもその強み。 今回はStinger5のカスタマイズ記事を部分ごとにまとめてみました。きっとあなたのやりたかったモノも見つかりますよ。 ※Stinger3のまとめはこちらのサイトをご覧ください。 (ここを見ておけば検索不要！Stingerカスタマイズ辞典) STINGER5の構造理解 STINGER5のid,class構造 テーマの構造がわかっているのといないのとでは、カスタマイズの自由度、楽しさが大きく変わってきます。ざっくりとでもclass,id構造は把握しておきましょう。 Stinger5カスタマイズ！最新版class,id構造早見表 -トップページ編- ディスプレイサイズによるcss適用範囲の違い

ついにリリースされた「Stinger5」。 レスポンシブ対応ということで心待ちにされていた方も多いのではないでしょうか。 カスタマイズ初心者の方には「どこがどのクラスなんだ？」と困っている方も多いはず。 また、先代Stinger3から構造やclass,id名が大きく変更されているので「変更点が知りたいよ」という方も多い気がします。 そこで今回はStinger5のid,class構造がひと目で分かる早わかり画像を作りました。 今回はトップページ編です。 ※今までStinger3を使われていた方はこちらの記事と比較しながら読んで頂くとどこが変わったのかわかりやすいかと思います。

Stingerのカスタマイズ楽しまれてますか？ テーマをカスタムしていくとき、まず変えたい部分のclassとidを調べると思います。 慣れてきた今でこそ「Developer Tools」からすんなり目的のものを見つけられますが、はじめの頃は大変でした。 また入れ子の階層構造がうまくつかめていないと思ったとおりに変更できなかったりしますよね。 今回はStingerのid,class構造がひと目で分かる早わかり画像を作ったのでご紹介します。 今回はトップページ編です。 【関連】Stingerカスタマイズ！あると嬉しいclass,id構造早見表2 -記事ページ編- 注意:id,classの範囲はわかりやすさのためデフォルメしている場合もあるのでご留意ください。画像が小さくて見えないときはクリックで拡大します。 ざっつりとしたファイル構造 まずざっくりとどの部分がどのファイルで管理されているのか説