タグ

ブックマーク / www.koikikukan.com (11)

  • Pocketされた記事のランキングを作成する方法

    Pocketされた記事のランキングを作成する方法を紹介します。 1.はじめに Pocketは「あとで読む」サービスです。 ブログを運営している方にっては、各記事ページに設置したPocketボタンのランキングを知りたいのではないでしょうか。 ということで、Pocketされた記事のランキングを作成する方法を紹介します。 2.Pocket Publishersに登録する まず「Pocket for Publishers」のページにアクセスします。 (クリックで拡大) Pocket Publishers 「Request Access」をクリック。 次の項目を記入して「Request Access」をクリック。どれが必須でどれが任意か不明ですが、「Your Title」は空のまま登録しました。 Site URL:Pocketボタンを設置しているサイトのURL Site Name:サイト名 Site

    Pocketされた記事のランキングを作成する方法
  • ウェブサイトの画像にAmazonのアフィリエイトリンクを簡単に設定できる「Amazon Publisher Studio」の使い方

    ウェブサイトの画像にAmazonアフィリエイトリンクを簡単に設定できる「Amazon Publisher Studio」の使い方を紹介します。 1.完成イメージ まず最初に、「Amazon Publisher Studio」でウェブサイト上の任意の画像に設定したアフィリエイトリンク(赤枠部分)です。 このリンクにマウスをポイントすると、次のように商品情報が表示されます。 ということで、「Amazon Publisher Studio」の使い方を紹介します。 「Amazon Publisher Studio」を利用するにはサイトの登録が必要なので、その手順から説明します。 なおエントリーの説明では、Amazonアソシエイトの登録が事前に完了していることが前提です。 2.「Amazon Publisher Studio」へのサイトの登録 アソシエイト管理画面の上部メニューにある「Publi

  • Windowsのデフォルト機能だけでマウスカーソルをキャプチャする方法

    Windowsのデフォルト機能だけでマウスカーソルをキャプチャする方法を紹介します。 Windowsのデフォルト機能でマウスカーソルをキャプチャしたところ 1.問題点 Windowsではデフォルト機能で画面をキャプチャするための「Print Screen」キーが用意されています。 具体的なキーの使い方は次のとおりです。 Print Screen押下:デスクトップをキャプチャ Alt+Print Screen押下:アクティブになっているウィンドウをキャプチャ キャプチャ後、「スタート」→「アクセサリ」→「ペイント」を開き、メニューバーの「編集」→「貼り付け」またはCtrl+vでキャプチャした画面がペーストされます。 ですが、この機能ではマウスカーソルを同時にキャプチャすることができません。 下のスクリーンショットは「テスト」というリンクの上にマウスカーソルを当てた状態のものをPrint Sc

    Windowsのデフォルト機能だけでマウスカーソルをキャプチャする方法
    dal
    dal 2014/02/05
  • パスワードを表示するブックマークレット

    入力フォームのパスワードフィールドのパスワードを一発で表示するブックマークレットを作りました。 1.概要 ログイン時の入力パスワードをブラウザなどに記憶させて使っている人は少なくないと思います。 が、別のPCでログインしたり、パスワード変更時に前のパスワードを入力しないといけないときなど、入力していたパスワードをうっかりすっかり忘れてしまうケースもあると思います。 このブックマークレットを使えば、入力しているパスワードの内容を一発で確認することができます。 注:ご利用にあたっては、パスワードを忘れたときのみブラウザのお気に入りに登録し、確認後はすぐに削除するようにしてください。 1.ブックマークレットの使い方 以下のリンクをブックマークして、パスワードを見たいページを保存してブックマークをクリックまたは選択すれば、パスワードが表示されます。 パスワード表示 パスワード入力ページを表示します

    パスワードを表示するブックマークレット
  • CSSでfloatを解除する方法のまとめ

    CSSのfloatを解除(クリア)する方法をまとめてみました。 以前、floatを解除するテクニックとして以下の記事をエントリーしたのですが、その後色々なテクニックがあることに気がつきました。 CSS の after 擬似要素で回り込みを解除する ということで、そもそものfloatの問題(というか仕様)と、その対処方法についてネットで調べた情報を一通りまとめました。 1.floatにより親要素の高さが出なくなる(=背景がなくなる)問題 親要素の中にある子要素にfloatプロパティが設定されていると、内容をもたない親要素の高さが0になるという仕様になっています。 例えば、次のCSSHTMLを例にします。 <style> #container { width: 200px; background: #ddd; } .box { width: 25px; margin: 10px; paddi

    CSSでfloatを解除する方法のまとめ
    dal
    dal 2013/03/28
  • Firefoxを高速化する「SpeedyFox」

    Firefoxを高速化する「SpeedyFox」を紹介します。 SpeedyFox 1.Firefoxの問題点 Firefoxを長期間使っていると、閲覧履歴・ブックマークといった「プロファイル」を管理するためのデータベースが肥大化し、Firefoxの起動や動作が遅くなる原因のひとつになるようです。 2.SpeedyFoxの機能 「SpeedyFox」はFirefoxのデータベースを最適化するツール(アドオンではありません)で、ワンクリックでデータベースを最適化してくれます。 3.インストール SpeedyFoxのページにある「SpeedyFox for Windows」または「SpeedyFox for Mac OS X」をクリック。ここではWindows版での動作で説明を進めます。 ダウンロードしたファイルが実行ファイルになります。インストールウィザードによるインストールは不要です。 4

    Firefoxを高速化する「SpeedyFox」
    dal
    dal 2012/12/28
  • 「ノンプログラマーのためのjQuery生成ツール」作りました

    ノンプログラマーのためのjQuery生成ツールを作ってみました。よければご活用ください。 ノンプログラマーのためのjQuery生成ツール サンプル表示つき このツールは「7つのサンプルでjQueryを学ぼう!「jQueryが全く分からない人のため」の超初級者向け入門講座」にインスパイアされて作った、初心者向けのお勉強ツールです。 コールバックなど複雑な設定はできませんが、基的な設定とメソッドチェーンまでできるようにしています。 追記:イベントとAPIをプルダウンメニューで選択できるようにしました。過不足あればご指摘ください。 追記:イベントとAPIのプルダウンメニューでツールチップを表示できるようにしました。ざっくりした内容ですが、これでイベントやAPIの使い方が分かるようになります。 ツールチップを表示 やっつけで作ったので中のコードはかなりひどいです。あしからず。 1.使い方 エン

  • レスポンシブWebデザイン制作に便利なFirefoxの「レスポンシブデザインビュー」

    レスポンシブWebデザイン制作に便利なFirefoxの「レスポンシブデザインビュー」を紹介します。 「レスポンシブデザインビュー」はFirefox15から搭載されています。 1.「レスポンシブWebデザイン」とは 「レスポンシブWebデザイン」とは、PCやスマートフォンやタブレットなど、あらゆるデバイスに対応するWebデザインのことを指します。 レスポンシブ(Responsive)は、「よく反応して」「敏感な」という意味があるようです。 レスポンシブWebデザインを確認するには、複数のデバイスを用いるか、極端な話、PCでブラウザの幅を変更すればいいのですが、Firefoxの「レスポンシブデザインビュー」を利用すれば、より効率的に確認作業が行えます。 2.「レスポンシブデザインビュー」の使い方 レスポンシブWebデザインのサンプルサイトとして「NHKスタジオパーク」を利用させて頂きます。 N

    レスポンシブWebデザイン制作に便利なFirefoxの「レスポンシブデザインビュー」
  • FacebookページにブログのRSSフィードを表示する

    Facebookページ(旧ファンページ)にブログのRSSフィードを表示する方法を紹介します。ここではRSS Graffitiというアプリケーションを利用します。Facebookページの作り方は「Facebookのファンページ作成~FBMLを使えるようにするまでの流れ」をご覧ください。 RSS Graffiti 余談ですが、小粋空間のFacebookページを作りました。まだ何もありませんが25人以上の方からの「いいね」をお待ちしています(画像下の「いいね」ボタンそれです)。 2011.02.28追記:25人超えました。ありがとうございました。 小粋空間のFacebookページ http://www.facebook.com/koikikukan 1.Facebookページへのアプリケーション登録 「RSS Graffiti」のページ左にある「マイページへ追加」をクリック。 候補の一覧がでるの

    FacebookページにブログのRSSフィードを表示する
  • jQueryでサイドメニューの折りたたみを実現するListfolderプラグイン

    jQueryでサイドメニューの折りたたみを実現するListfolderプラグインを紹介します。同じようなプラグインはすでに存在すると思いますが、勉強がてら作ってみました。 1.機能 このプラグインを利用すれば、サイドメニュータイトルをクリックすることで、リストの折りたたみが簡単にできるようになります。 折りたたみ機能だけであればjQueryを数行書けば実現できますが、このプラグインのウリは折りたたみ状態をクッキーに保持することです。クッキーに保持するので、リロードや他のページに移動しても折りたたみ状態が初期状態に戻ることはありません。 動作は以下の配布ページで確認できます。配布ページのサイドメニュータイトルをクリックすれば折りたたみを行えます。 jQuery listfolder plugin 以下、インストールと利用方法を説明します。 2.プラグインのダウンロード・インストール List

  • Facebookページ(旧ファンページ)作成~FBMLを使えるようにするまでの流れ

    Facebook(フェイスブック)でファンページを作成し、作成したファンページでFBML(FaceBook Markup Language)を使えるようにするまでの手順を紹介します。 FBMLはMTML(Movable Type Markup Language)、つまりMTのテンプレートタグと同じようなものです。ネットで検索して手順を調べたところ、一番最初のページがリニューアルされているようでした。ということで、紹介するのは2011年1月30日現在の情報です。 注:Facebookで「スタティックFBML」は利用できなくなりました。新しくページを追加する場合はiframeタブなどを利用してください。iframeタブの概要や設定方法は「FacebookページにMovable TypeやWordPressの最近のブログ記事を表示する」をご覧ください。 蒲生さん率いる「Facebookファンペー

    Facebookページ(旧ファンページ)作成~FBMLを使えるようにするまでの流れ
  • 1