レスポンシブ対応のフラットなUIフレームワーク·Furatto MOONGIFT
FurattoはHTML5/JavaScript/CSS3製のオープンソース・ソフトウェア（Apache License 2.0）です。 最近流行のフラットデザインでサイトを作ってみたいと思いつつ、そのデザインフレームワークを使いこなすのが大変…と感じている方はFurattoを試してみましょう。BootstrapをベースにしたフラットUIデザインが実現できます。 ボタンデザイン。四角い、立体感のないデザインです。 カラーバリエーションも良くあるフラット系になっています。 ボタンにアイコンを載せることもできます。 画像。丸く表示もできます。 囲みをつけることもできます。囲みの色も変更可能です。 テーブル表示。こちらは通常のテーブルです。 ちょっと詰まった感じのテーブル。 行ごとの色変更も可能です。 レスポンシブなテーブルもありますが、幅をスマートフォンサイズまで縮めるとうまく表示できませんで
WordPress + XMLRPCでiOSアプリのバックエンドAPIを作る | 高橋文樹.com | プログラミング
この投稿は 11年 前に公開されました。いまではもう無効になった内容を含んでいるかもしれないことをご了承ください。 検証機のAndroidが放電して仕事がストップしたので、メモ代わりに書きます。拙作決済用プラグインLiterally WordPressを9.1にアップデートしたのですが、次期アップデート9.2ではiOSのIn App Purchaseの非消耗プロダクトと連携させようと思っています。要するに、角川BOOK☆WALKERみたいなアプリを作る場合のバックエンドとしてWordPressを利用しようという魂胆です。 角川BOOK☆WALKER ただし、このプラグインで実現できるのは、あくまで決済情報とファイルダウンロードの管理だけであって、よいアプリケーションを作るには他にも必要なものが色々とあります。今回はアプリ – サーバ間の通信の基本を説明するとともに、サーバサイドで必要な設定
iPhone、iPad、PC対応！カッコ良く雑誌風に横スクロールさせて全画面の記事をみせる「Treesaver.js 」
今年はスマホ元年といわれるほど、iPhoneやAndroidなどスマホやiPadなどのタブレットが一気に吹き出すように浸透した一年になりましたね。 おかげで、PCでは縦スクロールが当たり前だった頃に比べて横スクロールさせるUI（ユーザーインターフェイス）が身近になってきました。 jQueryを使用して、簡単に全画面横スクロールで雑誌風にサイトをみせることができるのがこの「treesaver」。スマートフォンにも対応しているので、iPhoneなど指で左右にスクロールさせて表示させたい時に便利です。しかも画面の大きさによって、自動的にレイアウトを変更してくれます。 「treesaver.js」はPython製、HTML5/JavaScript用のオープンソース・ソフトウェアです。テキストや画像、動画と言ったメディアを織り交ぜた電子雑誌を作ることができます。 この機能を文字では説明しきれないので
Twitter BootstrapでさくさくWeb開発 : アシアルブログ
<div class="container-fluid"> <div class="row-fluid"> <div class="span4"> Span4の中身 </div> <div class="span8"> Span8の中身 </div> </div> </div> Preタグで囲むコード エンジニアの皆さんなら、ブログにコードを書きたいですよね。 Twitter Bootstrapでも、かっこ良くコードを見せる手法を提供しています。 ・codeタグで囲む 赤くなります。 ・preタグで囲む 囲み枠がつき、灰色になります。 ・Preタグ+Google Prettifyを使う preタグのclassに、prettyprint linenums を入れましょう。 これが超かっこいい！！コードを見せるならこれがよさそうですね！ さて、かっこいいGoogle Prettifyですが、こ
Rails3 と jQuery で真面目にオシャレなエロサイトをつくってみました
いつぞやの飲み会で、 これだけウェブの技術が進化しているのだから、もっとオシャレなエロサイトがあってもいいんでないかい？ << という話になりまして。 だけどどうせ作るんならということで、Rails3 と jQuery を使って結構マジメにつくってみました。 （※大人の事情により、リンクはやむなく削除しました） 当初はエロにオシャレは必要ないのかなーと思ったときもありましたが、いざつくってみると、やっぱり選べるならオシャレなやつの方ががいいよね、という結論に落ち着きました。 今回つくったのは試験的なものなので 90日間限定でしか公開しないつもりですが、日本のエロサイトが今後もっとオシャレに発展していくきっかけになってくれたら嬉しいです。 以下、サイトのコンセプトや使っている技術についてまとめてみます。 **Rails3 と jQuery で真面目にオシャレなエロサイトをつくってみました 1
どや！？ひよっこデザイナーにもできるWebページ高速化！鍵は「HTTPリクエストの数を減らすこと」 | デザインどや！？
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー＆カルーセルプラグイン、チャート＆グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
Passenger を使ってサブドメインではなく Rails と Sinatra を共存させる - oooooooo
概要 redmine.example.com や sinatbbs.example.com ではなく、 www.example.com/redmine/ や www.example.com/sinatbbs/ にする方法。 Rails 編 DocumentRoot が /www/htdocs/ だとする。 Rails で作られた Skip や Redmine が /home/oooooooo/redmine-0.8/ や /home/oooooooo/skip-1.1.0/ だとする。 $ cd /www/htdocs/ $ ln -s /home/oooooooo/skip-1.1.0/ skip $ ln -s /home/oooooooo/redmine-0.8/ redmine httpd.conf に下記を追加。 RailsBaseURI /redmine RailsBaseUR
Webデザイナーは要チェック。WordPress用テーマフレームワーク·Whiteboard MOONGIFT
WhiteboardはPHP/HTML/CSSによるオープンソース・ソフトウェア。最近はちょっとしたサイトであればWordPressを使って開発するというのが多いようだ。確かに認証、ブログ、CMS、リンク管理などWebサイトを運営する上で必要な機能が多数揃っている。 デスクトップ向け 次に必要なのはデザインだ。個人用途であれば外部のテーマを使っても良いが、専門的に進めるならばやはり自作したいと思うだろう。とは言え一から作る必要はない。Whiteboardというテンプレートフレームワークを使えば良い。 WhiteboardはWordPress3.0以降に対応したソフトウェアで、テーマとしてインストールする。とてもシンプルなデザインで、上部に大きなロゴ、左にテキストコンテンツ、右にサイドバーが並んで表示される形式になっている。だがiPhoneやAndroidで見ると1カラムになるように設定され
勉強会やセミナーに。動画と別コンテンツを連携させるHTML5動画フレームワーク·Popcorn.js MOONGIFT
Popcorn.jsは動画と別なコンテンツを連携させるHTML5ビデオフレームワーク。 Popcorn.jsはHTML5/JavaScript製のオープンソース・ソフトウェア。Webサービスの説明動画や、勉強会の内容など動画をWebサイトに掲載するケースが増えている。そんな時には動画以外の資料も一緒に掲載したいと思うはずだ。 デモ ニコニコ動画は動画とコメントと一緒に閲覧できるが、同じように動画と別なコンテンツを一緒に掲載したり連携させたいと思う事はないだろうか。それを実現するライブラリとしてPopcorn.jsを紹介しよう。 Popcorn.jsはHTML5動画フレームワークで、動画と任意のコンテンツを連携させるライブラリだ。例えば動画の横にスライドを載せ、指定時間になったら切り替えると言った具合だ。手で時間を進めたりした場合もコンテンツが切り替わってくれる。 外部の様々な情報を表示して
Webサービスをインクリメンタルに検索する·Search as you Type MOONGIFT
Search as you Typeはテキストボックスに文字を入力するとその候補を表示するソフトウェア。 Search as you TypeはPHP/JavaScript製のオープンソース・ソフトウェア。Googleでは検索ボックスにワードを入力すると、その候補を表示するようになっている。よく使う検索単語はみんな似ている傾向があるので、大抵その候補の中に検索したいワードがある。とても便利な仕組みだ。 デモ それだけに自分のサイトでも実装してみたいと思わないだろうか。自分の友人を検索したり、ブログの検索など使い道はとても多いはずだ。しかしサーバサイド、クライアントサイドともに用意するのに手間取るかもしれない。そこで使えるのがSearch as you Typeだ。 Search as you TypeはJavaScriptとPHPを組み合わせて検索候補を表示するソフトウェアだ。サンプルでは
AKIBE - FTPの接続情報を設定せずにWordPressを自動更新させる方法
WordPressの自動更新機能を使用する時、環境によって、FTPの「接続情報」画面が表示されます。 この判定を行っているのが wp-admin/includes/file.php の以下の箇所です。 function get_filesystem_method($args = array(), $context = false) { $method = defined('FS_METHOD') ? FS_METHOD : false; if ( ! $method && function_exists('getmyuid') && function_exists('fileowner') ){ if ( !$context ) $context = WP_CONTENT_DIR; $context = trailingslashit($context); $temp_file_name
WebKit最新開発版に見るCSS3の「縦書き」 - builder by ZDNet Japan
論理プロパティでの実現という課題を残しつつも、CSS3でのサポートおよびEPUB3.0でのサポートが決まった「縦書き」ですが、そろそろビューワレベルでの対応（実装）も開始されました。その先陣を切るのが、SafariやGoogle Chromeに採用されているHTMLレンダリングエンジン「WebKit」です。 WebKitのブログ「Surfin' Safari」では特に触れられていませんが、先日公開された最新開発版（Nightly Build）から、縦書きのサポートが開始されています。まだ実装の初期段階ではありますが、EPUBの描画機能とは切っても切れないHTMLレンダリングエンジン分野における最新動向ということもあり、本連載で検証してみたいと思います。 CSS3の縦書き対応で最先端を行く「WebKit」 最初のテストは、とにかく「横書きを縦書きで表示する」ことにしました。H1タグなど見出し
手っ取り早く携帯サイトを作成する時のhtmlテンプレート - webの人 @ryryo
最近phpをいじるがてら、ひさびさに携帯サイトに触れているためメモメモ。 携帯サイトで装飾を入れるとなるとi-cssが云々って話があったりしますが、正直テストサイトでそんな面倒なことをしていられないので、だいたい以下のようなhtmlで作成しています。 とりあえず携帯サイト作りたい時テンプレート <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Co
2chのまとめを作る - こども(てれび)
twitterについては http://www.scrapi.jp/intro に書いたので、2ちゃんねるのまとめ記事の作り方を説明します。 現在のscrapi拡張は、2chを直接ブラウザで見た場合、及びFirefoxの2chブラウザ拡張 Chaika で見た場合でのみ使えるようになっています。今回はchaikaを使って説明します。直接ブラウザで見た場合も手順はこれと同じです。 まずchaikaでまとめたいスレッドを表示して、引用したいレスのレス番号のところをscrapiサイドバーにドラッグします。 これで1の発言が取り込まれました。質問スレなので、まず1の人の他の発言を抽出します。 発言を右クリックして「このIDで現在のページから抽出」を選択。それから1の全発言をレスポンス設定にします。 全選択してから「レスポンスにする」を選択。レスポンス設定は単に発言がインデントされるだけです。見た目
ブログアフィリエイトで稼ぐのに役立った「最強ツール」２７選【保存版】
検索キーワードを調べるツールまとめ キーワードを調べる決定版「Google キーワード プランナー」 Googleが運営するキーワードツールで、おおよその月間検索数や競合性が高いかどうかを調べることができます。 キーワードリストをダウンロードしておいて、そこから作る記事を考えるのが効率的。 一定の広告料を使わないと細かな数値は分かりませんが、Googleのデータを元に記事タイトルを決められるので、使ってない人は絶対使っておきましょう。 Googleキーワードプランナー キーワードの組み合わせが分かる「ラッコキーワード」 キーワードの組み合わせを探せるアドバイスツール。 Googleのキーワードプランナーほど細かなデータは分かりませんが、シンプルで使いやすいツールです。 ラッコキーワード 検索順位を調べるツールまとめ 業者も使う順位チェックツール「GRC」 他のツールだと毎回キーワードを入力
Apacheのアクセス制御をちゃんと理解する。 - こせきの技術日記
Apacheの設定で Order deny,allowとか Satisfy anyとか、なんだか意味わからん人のために。僕はずっとわかってなかった。 基本 Apacheのアクセス制御には、 ホストによる制御 (Order,Allow,Deny) ユーザ認証による制御 (Auth*, Require) の2通りがある。 Satisfyは、2通りあるアクセス制御の両方を満たす必要があるかどうかを決定する。デフォルトはSatisfy all。Satisfy anyなら、どちらか片方満たせばよい。 Order http://httpd.apache.org/docs/2.2/mod/mod_authz_host.html#order Order deny,allowは、全てのホストからのアクセスを許可する。 Order allow,denyは、全てのホストからのアクセスを拒否する。 Order d
まとめサイトのアンテナサイトを評価してみた。２回目(`・ω・´)ｷﾘｯ ニュース速報BIP
1 以下、名無しにかわりましてVIPがお送りします 2010/08/29(日) 23:31:44.49 ID:+vpRXFe/0 やあ。また評価するよ。(´∀｀*)ｳﾌﾌ 前回は少なかったので、今回は７０サイト。 これ以上はみつけられなかった。 「Google PageRank」は、被リンク数に影響するので、新参サイトに不利と判断。 その為点数は最大10点と低めにした。 基本情報は、Ｗｅｂアプリ作成基準からユーザビリティに影響すると思われる項目を抜粋。 デザインはなるべく客観的に努力した。 劇的なリニューアルがあるといけないので、評価した日付も記載した。 ユーザビリティは利用性、理解性、運用性などを考慮しつつ、最終的には個人的好みで評価。 ここまでが100点満点の評価内容。 さらに付加価値が付いているサイトは、１機能につき５～１５点を付ける。 これにより、単なるパクリサイトや更新が少ないサ
縦書き表記をサポートするテキストレイアウトエンジン·Nehan MOONGIFT
NehanはJavaScript製のオープンソース・ソフトウェア。コンピュータはアメリカ発とあって、左から右に表記されるのが基本だ。アラビア語のように右から左に表記される場合もあるが、それでも横に流れるのは変わらない。日本語のように縦に書かれることは考慮されていない。 だが日本人である以上、慣れはあるとは言え縦書きの方が分かりやすい。それは今後電子書籍が流行っていく中で必ずネックになるはずだ。とは言え出力自体縦書きにするのは難しい。そこで表示だけを切り替えるのがNehanだ。 NehanはHTMLでは通常通り横向きに書かれている文章をJavaScriptを使って縦書きに変換する。カギ括弧など単純に縦に並べると問題のある文字は画像を使って置き換えてくれる。これによってぐんと見やすい状態になる。 実際の使い方としてはclassの中に幅、高さ、フォントサイズを指定する程度で良い。特に何も考えずに
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Responsive Cat
MindTouch Dev Center Wiki