show-timaのブックマーク (172)

  • Wordpressでクライアントのためにできる6のこと | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    WordPressはCMSとして大変多機能で便利な反面、普段パソコンを使い慣れないクライアントにとっては難易度が高め。 メニューや編集画面がごちゃごちゃしていると、記事をひとつ投稿するだけでも一苦労です。 誤動作がないように、出来るだけ使う機能だけを表示させたシンプルな状態にしてあげたいですね。 クライアント側の更新がスムーズに出来るように、納品前にこちらでやってあげたい6つのことをまとめました。 01 カスタムフィールドを設定する ご存知カスタムフィールド。 こちらはいろいろなサイトで詳しく解説されている上、使い方も様々なので、詳しい説明は省かせて頂きます。 下記リンクは、あまりにも有名な機能拡張プラグイン。私も使用時には必ず入れています。 Custom Field GUI Utility 02 記事の複製を出来るようにする WordPressの七不思議。デフォルトでは記事のコピー投稿が

    Wordpressでクライアントのためにできる6のこと | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • WordPressでカテゴリに画像を設定するプラグイン「Category Icons」 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    カテゴリごとに画像を設定したいと思ったのですが、デフォルトではカテゴリ名前、スラッグ、ディスクリプションぐらいしか設定できません。そこで使ったのが、カテゴリに画像を持たせることができる「Category Icons」です。 今回は、「Category Icons」の使用方法についてご紹介していきます。 1. インストール WordPress Plugin Directory http://wordpress.org/extend/plugins/category-icons/ まずはこちらからプラグインをダウンロードして、プラグインフォルダにアップしてください。 アップが完了したら、プラグインの中にカテゴリーアイコンが表示されるので、有効化してください。 2. 設定 プラグインが有効になったら左カラムにある「投稿」タブの中にカテゴリーアイコンのメニューが入ってきます。 それを選択すると、設

    WordPressでカテゴリに画像を設定するプラグイン「Category Icons」 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • [WP]カテゴリーのアイコンを表示するプラグイン「Category Icons」

    各カテゴリーに任意のアイコンを設定・表示するWordpress用プラグイン「Catgory Icons」の紹介と日語化ファイルの配布。 このプラグインは、カテゴリーそれぞれに独自のアイコンを設定することが出来て、 サイドバーのカテゴリーリストや記事のタイトルに設定したアイコンを表示してくれます。 インストール WordPress2.3~2.6.1対応 最新バージョン2.0.7 ※ver2.0.5の翻訳ファイルそのまま使用してても問題はありません。 ダウンロード後展開、wp-content/plugins/にアップロードしたら、有効化する。 日語化ファイルは、解凍したmoファイルをlanguagesフォルダに入れます。 moファイルのアップロード形式はバイナリで。 2.0.5からプラグインに同胞されたようです。ワーイ ダウンロード var2.0.7» “category_icons-ja

    [WP]カテゴリーのアイコンを表示するプラグイン「Category Icons」
  • メールフォームプロ

    無料の高機能で作り方も簡単なメールフォームプロCGIです。複数送信やアンケートフォームや応募フォームとして利用できます。文字コードUTF-8対応でレスポンシブWebデザインでスマートフォンにも対応。MTでもWordPressでも使えるショッピングカート機能付き高機能無料メールフォームCGIです。中国語や韓国語への対応やクレジット決済機能も。Googleスプレッドシートとの連携も可能。 メールフォームプロCGIの概要Perlで書かれたアンケートフォームや応募フォームとして無料で利用できるメールフォーム(エントリーフォーム)のCGI高機能版です。高機能と言うことで、DOMを駆使した確認画面と一般的なメールフォームにたぶんあまり付いていない効果計測機能が実装されております。簡単設置の概念を幾分抑え、全ての設定をCGI側に設定する必要がある点が大幅な変更点となります。 もちろんスマートフォンへも完

  • メールアドレス暗号化(メール暗号化ツール)

    <a href="mailto:abc-xyz@yahoo.co.jp">abc-xyz@yahoo.co.jp</a> ↓ <script type="text/javascript"> <!-- function converter(M){ var str="", str_as=""; for(var i=0;i<M.length;i++){ str_as = M.charCodeAt(i); str += String.fromCharCode(str_as + 1); } return str; } function mail_to(k_1,k_2) {eval(String.fromCharCode(108,111,99,97,116,105,111,110,46,104,114,101,102, 32,61,32,39,109,97,105,108,116,111,58) +

    メールアドレス暗号化(メール暗号化ツール)
    show-tima
    show-tima 2012/05/25
    メアドのエンティティ化・javascript表示に使えるツール。
  • CSSベースのかっこいいボタンがぱっと簡単に作成できるオンラインサービス -Twitter Bootstrap Button Generator

    生成したボタンとコード ページに実装する際は、生成されたコードとTwitter Bootstrapを用意します。 外部ファイル <link href="css/bootstrap.min.css" rel="stylesheet"> HTML <a href="#" class="btn btn-danger"><i class="icon-white icon-heart"></i> ボタン</a> [ad#ad-2] ※アイコンを使用する場合は、Twitter Bootstrapのimgフォルダも必要です。 アイコンは下記のものが利用できます。

    show-tima
    show-tima 2012/05/23
    これ使えるかも!どのブラウザならOKなのかにもよるけど。
  • ファビコン favicon.ico を作ろう! リアルタイム 5サイズ版

    このページでは 16x16, 24x24, 32x32, 48x48, 64x64 の5つの画像を含むマルチアイコンを生成します。 16x16のみ、16x16と32x32の2個、などのアイコンも作成可能です。 入力された画像は指定サイズに拡大縮小されます。 長方形の画像を指定した場合は正方形に変形されます。 透過情報を含むPNG画像も指定可能です。 指定した大きさの画像がアイコン内に作成されます。 16x16の画像のみ作成する場合は16x16に画像を指定して下さい。 32x32の画像のみ作成する場合は32x32に画像を指定して下さい。 同時に複数画像を指定すると、マルチアイコンになります。 16x16と32x32に画像を同時に指定すると2サイズのマルチアイコンになります。 16x16,24x24,32x32,48x48,64x64すべてに同時に画像を指定すると、5サイズのマルチアイコンにな

    ファビコン favicon.ico を作ろう! リアルタイム 5サイズ版
    show-tima
    show-tima 2012/05/18
    16x16/32x32/48x48の3種類のマルチアイコンを作る
  • [css] フォームのボタンをスタイルシートで画像ボタンに変更する

    フォームのボタンについては以前、buttonタグにボタン画像をそのまま入れるという手法を書きましたが、 もう一つ、ボタンの見た目をCSSで変更する手法がございます。 この記事ではCSSでスタイリッシュなフォームボタンを作る方法について解説します。 メリットとしては、ロールオーバーアクションをCSSで制御出来るという点と、 タイプ属性にimageを指定しないので、送信やリセットなどの機能を殺さないという点があります。 ただし、CSSでのロールオーバーはIE6未対応なので、気になる方はJavascriptと併用してください。 (個人的にはスルーしても問題ないと思っています) (X)HTMLソース buttonとinputどっちでもOK <button id="submit" type="submit">Submit</button> <input id="submit" type="submi

    [css] フォームのボタンをスタイルシートで画像ボタンに変更する
  • jQueryサンプル集 | DesignWalker

    jQueryサンプル集 | DesignWalker
    show-tima
    show-tima 2012/04/24
    スライダーとか作品サンプル集の見せ方とか。lightboxとか。
  • Free Icon Sets: 1000+ Vector, Social, PSD, UI Icons Graphic Design Junction

    Icons has become an important part of modern web design. If you are looking free icon sets like vector icons, social icons, psd icons and ui icons sets so your in right place. Here you can find  1000+ vector social, psd and ui icons sets. Icons are one of the most useful and attractive way to engage our visitors. Icons are the basic requirement of any web related projects and good icons are like a

    Free Icon Sets: 1000+ Vector, Social, PSD, UI Icons Graphic Design Junction
    show-tima
    show-tima 2012/04/19
    ベクターデータもあり。
  • CSS Arrow Please - By Simon Hoejberg - @shojberg

    Create and export CSS code for a custom box with an arrow extending out from the side. Great for tooltips, flyouts and the like.

    show-tima
    show-tima 2012/04/13
    アロー付きの吹き出しのスタイルシートが簡単に作成できるオンラインツール -CSS Arrow Please! | コリス
  • hail2u.net - Weblog - floatで並べたリストのセンタリング

    ページング・ナビゲーションなどでリスト項目をfloat: left;で横に並べるというのは割りと良く使われると思う。並べること自体は特に難しいわけではないが、その並べたリスト全体をセンタリングしようとするとちょっとややこしい。display: inline-block;を使う手法やdisplay: table;を使う手法という黒魔法的(私見)な手法で実現可能だが、position: relative;でもいける。 ややこしい理由は簡単で、センタリングでよく使われるtext-align: center;やmargin: 0 auto;といった手法が通用しないから。検索するとすぐ出てくる比較的メジャーなdisplayで頑張る方法もわかりやすいし悪くはないのだけど、同一セレクタ内で複数のdisplayを駆使する必要があることやzoomマジックなどを併用する必要があることからコードがややこしくなる

    show-tima
    show-tima 2012/04/10
    フッターのリストをセンタリングするところでつまづいた。この方法で解決。
  • [Favicon]faviconの記述(いまさらだけど)【apple-touch-icon-precomposed】 - [FORCE]

    最近のパターンを記載しました こちらをごらんください 各ブラウザごとに サポートするようになっているので 自分用のメモもかねて GIFファイルを使う <link rel="shortcut icon" href="favicon.gif" /> <link href="http:/XXXXXXXXXX/favicon.gif" rel="shortcut icon" type="image/gif"/> PNGファイルを使う <link rel="shortcut icon" href="favicon.png" /> <link href="http:/XXXXXXXXXX/favicon.png" rel="shortcut icon" type="image/png"/> WindowsIcoファイルを使う <link href="favicon.ico" rel="icon" ty

    [Favicon]faviconの記述(いまさらだけど)【apple-touch-icon-precomposed】 - [FORCE]
    show-tima
    show-tima 2012/04/06
    iPhone/ iPadで使われるファビコンを作るときはここを見よう。[icon][iphone]
  • iPad用マルチユーザ向けブラウザ『Switch』 | ライフハッカー・ジャパン

    iPadのみ:自分用のiPadを買ったからといって、家族や友達に一切触らせないのは、なかなか至難の業でございます。しかも、iPadではユーザアカウント、またはブラウザの設定などが個別にできないようになっています。これに不都合を感じたことがある方は、ぜひ『Switch』をお試しください! Switchは、ユーザアカウントの設定やゲストブラウジングを可能にしてくれる、賢いブラウザです。 Switchでは、パスワード保護されたブラウザ用のユーザアカウントを設定でき、起動するたび、またはスクリーンロックを解除するたびに、アカウントが表示されます。 これだけでも、99セントという価格設定ならば安い、と感じる方もいるかと思いますが、Switchでできることはこれだけではありません。iPadオーナーにとって恐らく一番うれしいのは、自分の設定や履歴、クッキー、パスワードの設定などを他人が変更してしまうこと

    iPad用マルチユーザ向けブラウザ『Switch』 | ライフハッカー・ジャパン
  • ホームページ作成 大阪|WordPressで集客とアピールのお手伝い

    show-tima
    show-tima 2012/03/31
    テンプレートタグをもっと覚えて使いこなせるようになりたい。のでメモ。
  • jQueryで背景画像をフルスクリーン表示してスライドショーに出来るやつ色々 - かちびと.net

    気が向いたのでメモ。背景に配置した 画像をフルスクリーンで表示して、更 にスライドショー化できるjQueryのプ ラグインとか。さほど数は無いですけ ど・・・使う可能性があるかもなので 備忘録的にまとめておきます。 タイトル考えるの結構面倒くさいので適当になってきました。語彙が中学生レベルですが気にしないで下さい。 さて、フルスクリーンにした背景をスライドに出来るjQueryいろいろです。ほぼ択一っちゃ択一なんですけど・・・ちょっと出来上がりすぎていじりにくいので他もチェックしたい、という事で調べたものを羅列しておきます。触ったこと無いのもあるのでその程度の記事という事で。 Supersized 定番の高機能プラグインです。IE6では動作しません。スマートフォンでも大丈夫っぽい。多数のオプションも用意されており、FlickrAPIにも対応してるくさいです。ライセンスはMIT/GPLのデュア

    jQueryで背景画像をフルスクリーン表示してスライドショーに出来るやつ色々 - かちびと.net
    show-tima
    show-tima 2012/03/26
    100%表示で背景スライドショーしつつ、手前でHTMLを表示したいときに使えるかも。
  • WordPressで会員認証ページを作る

    WordPressでWEBサイトを構築していると、時折Basic認証を使いたくなる場面に遭遇します。 Basic認証は手軽に、ユーザー名とパスワードを知らなければ閲覧できない会員のみのページを設定することができるんだけど、通常ディレクトリごとの領域で設定する。 WordPressでオリジナルテーマを制作した人ならお解かりだろうけど、WordPressは固定ページ(下層ページにあたるページ)を生成する際にディレクトリ構造にならない。 パーマリンク設定でカスタム構造を使用している人がほとんど(当サイトもそう)ですが、ディレクトリに見えてもmod_rewriteでパーマリンクをカスタム構造に書き換えているだけなので、下層ディレクトリがありそうなあくまで擬似的なURIとなっている。擬似的なのでBasic認証をかけるってことは基的に出来ないのです。 WordPressの構築サイト全体をロックかける

    show-tima
    show-tima 2012/03/20
    ワードプレスの固定ページはディレクトリ構成になってないので.htaccessでのベーシック認証はできないけど、この方法なら可能かも。
  • Cat Speak – ヨガ&Webデザイン – 札幌 | 固定ページにカスタム投稿タイプのアーカイブを表示する

    wordpressのカスタム投稿タイプを利用してみました。 カスタム投稿タイプでは「投稿」と同じ機能を追加できます。 基的な導入方法については、下記がとてもよくまとまっていたので、参考にしました。 Web Design RECIPE – WordPressをカスタマイズするなら絶対覚えておきたい条件分岐やカスタム投稿タイプなどいろいろ Odysseygate.com – カスタム投稿タイプ(Custom Post Type)の導入と使い方 [WordPress 3.0] 難しそうだと思い込んでいたのですが、導入自体は思った以上に簡単にできました。 しかし、一般的には、カスタム投稿タイプは、カスタムタクソノミーと組み合わせて使うことになっているのか、 「カスタムタクソノミー」のアーカイブを表示する下記のようなURLは用意されてますが、 http://example.com/タクソノミー名/

    Cat Speak – ヨガ&Webデザイン – 札幌 | 固定ページにカスタム投稿タイプのアーカイブを表示する
    show-tima
    show-tima 2012/03/10
    投稿タイプ名には複数形を、カスタムリライトスラッグには単数形を指定しておかないとページ送りがうまく表示されない件、メモ。
  • [CSS]この発想はなかった!inputとlabelを使って実装する美しいデザインのアコーディオン

    パネルが開いた+ホバー時 パネルが開いている時のアローは上向きに変わります。 デモでは上記のチェックボックス版だけでなく、ラジオボタン版などもあります。 デモページ:チェックボックス版 デモページ:ラジオボタン版 デモページ:チェックボックス版・デフォルトオープン 実装 HTML 一つのアイテムに含まれるのは、チェックボックス、ラベル、コンテンツの3つです。それらをdiv要素で内包します。 <section class="ac-container"> <div> <input id="ac-1" name="accordion-1" type="checkbox" /> <label for="ac-1">About us</label> <article class="ac-small"> <p>Some content... </p> </article> </div> <div> <

    show-tima
    show-tima 2012/02/22
    キレイなアコーディオン。Mac Safari5ではスライドがうまく表示されなかったけども、FirefoxではOK。Q&Aページで使えそうなのでメモ。
  • CSS3をサポートしていないブラウザでどのように見えるか簡単に確認できるブックマークレット -deCSS3

    CSS3でスタイルした箇所をサポートしていない古いブラウザ、まぁ主にIEなのですが、でどのように見えるのか簡単に確認できるブックマークレットを紹介します。

    show-tima
    show-tima 2012/02/02