はてなブックマーク

表を検索したい！簡単に！都道府県別にある情報を簡単に絞り込みたい。というご要望。 セレクトボックスに47都道府県の情報をあらかじめ設定しておきセレクトボックスを選択すると該当の都道府県を検索（絞り込み）する。 というかたちで実装を考えました。 テキストボックスだと入力するの面倒だし、都道府県で絞り込みたいだけなのでこのような形でどうだろうと。 jQueryのプラグインが色々とありましたが、自分でも簡単に表検索の仕組みが実装できそうだったので実装してみました。 参考になればと思い、ソースコードとデモサイトを作ったのでご活用下さいませ。 動作デモ・ソースコード

「404 – ページが見つかりませんでした」というページってどんなアナウンスしていますか？リクエストしたURLにコンテンツが存在しなかった場合に表示される、404ページ。皆さんはどのように表示させていますか？ ちなみこのサイトでは、こんな感じで表示されます。（Twenty Fifteenテーマのデフォルトの表示です。） いやぁ、おもてなしの精神を感じませんね。私は悪くない、あなたがこのURLを開いたのが悪いんだ！お望みのページを勝手に探してくれって感じるナイスなアナウンスになっています。（言い過ぎ？！） さて、そんななか、レクサスの404 NOT FOUNDページがシンプルながらも素敵だったので今回紹介します。レクサスを見た後に、他の自動車メーカーの404 NOT FOUNDページも気になったので勉強がてら集めて見ました。 皆様のサイト制作の参考になれば幸いです。 レクサスの404 NOT

WordPressやconcrete5等のCMSを使うなら絶対あったほうが良いWAFWordPressに対する不正攻撃からサーバを守ってくれるWAF（Webアプリケーションファイアウォール）。 CPIのレンタルサーバ シェアードプランACE01にはWAFが標準装備されていて、クロスサイト・スクリプティングやSQLインジェクション等のサイバー攻撃を未然に防いでくれます。 詳しくはCPIの以下のページに分かりやすい解説が載っています。 https://www.cpi.ad.jp/shared/detail/waf.html CPIは、ジェイピー・セキュア社のSiteGuard Liteを導入しているようですね。 WAFがある安心感は非常に大きく、利用しないのはもったいない！というかWAFが使えるなら絶対に使ったほうが良い機能です。 しかしながら、WAFがしっかりと動作しすぎるために、サイト構築

Boostrapを使って作ったサイトをPC用の表示で印刷したい！Bootstrap利用して構築してあるWEBサイトを印刷すると、見たままの状態では印刷されず、紙媒体でも読みやすいように印刷時にレイアウト等が変更されて印刷されます。 以下のURLで印刷プレビューしてもらうと、Bootstrapのデフォルトの印刷スタイルを確認出来ます。 http://onocom.net/code/bootstrap-print/default.html これは、Bootstrapには予め印刷用のスタイルが定義されており、それが印刷時に適用されるためです。 この印刷スタイルには、 ・リンクテキストの後にリンク先のURLが表示される！（ハイテク！） ・背景がすべて消える（インク代節約！） ・レイアウトがシンプルになる（タブレットやスマホ用に近い、コンテンツを読みやすいレイアウトになる！） などなどが含まれます。

hostsファイルの場所一覧（Windowsの場合）WindowsのhostsファイルはOS毎に違うのかな。と思って一覧にしたけど同じっぽい。(Windows 10以外はネットで調べました) Macユーザの方はこちらの記事をどうぞ。[2019年7月17日追記] ●Windows 10のhostsファイルC:\Windows\System32\drivers\etc\hosts ●Windows 8 / Windows 8.1のhostsファイルC:\Windows\System32\drivers\etc\hosts ●Windows 7のhostsファイルC:\Windows\System32\drivers\etc\hosts ●Windows VistaのhostsファイルC:\Windows\System32\drivers\etc\hosts hostsファイルの書き方hosts

Press Thisを活用して簡単にブックマーク記事を投稿出来るサイトを作った今回、このPress Thisの機能を使って個人的なブックマークサイトを作ったのでご紹介したいと思います。 onocom.bookmark http://onocom.net/bookmark/ なぜこんなサイトを作ったかと言うと、Chromeのブックマークバーのブックマークが多くなりすぎて、同じサイトのブックマークを何個もしていることがあったから。そんな状況では、そもそもブックマークの意味が無い。 自分のブックマークを横断的に調べられたらいいなぁというのと、面白そうやなぁということで、こんなサイトを作りました。 はてなブックマーク使えば解決するのかもしれませんが、まぁ要するに自己満足です。 このサイトはウェブサービスでもなんでもなく、ただのWordPressのサイトを更新しやすくしただけなので、以下に書き記すこ

Adobe Illustrator CC 2017 からだと思われますが、文字ツールで文字や文章を入れようとすると、テキストボックスに「山路を登りながら～～～」という文字列が勝手に表示される様になって戸惑ったのでメモ。 解決策は、以下のIllustratorコミュニティフォーラム(Japan)に載っていました。 ■文字ツール | Adobe Community – Adobe Forums https://forums.adobe.com/thread/2230793 これを元に自分でも調べて自動表示を解除してみました。 山路を登りながら？フォーラムの回答にもあるように夏目漱石の草枕というお話の一節のようです。 全文は青空文庫で読めます。青空文庫すごい！ 夏目漱石 草枕 – 青空文庫 http://www.aozora.gr.jp/cards/000148/files/776_14941.

WordPressでもconcrete5でもそうですが、テーマを作るぜ！という話をした時に尻込みしてしまう方が結構います。（特にデザイナーさんに多いような） 理由は、「プログラム言語を怖い。PHP怖い。」という答えが私の周りには多かったです。 安心してください。 concrete5はWordPressよりもテーマの作り方が簡単です。 最初はおまじないだと思っておいて後から少しずつ理解していけばOK。 デザイナーさんでも怖がることが無いように、最低限必要なファイルだけでサクッとテーマを作って行こうと思います。 最低限必要なファイルとは以下の3ファイルだけです。 しかもdescription.txtとthumbnail.pngはただのテキストファイルと画像です。 デザイナーさんでもこれなら触れますね。 3のdefault.phpだけはプログラムですが、基本HTMLファイルですので気を楽にしてく

onocom WordPress、concrete5、Mautic、JavaScript、PHP、Docker、プログラミングなどの覚え書きをしていきます。 メニューとウィジェット

感想デザイン界隈では当たり前なことかもしれませんが、以下のIllustratorの機能を活用することでよりWEBへの親和性を高めるという話は大変勉強になりました。 ・スウォッチ ・段落スタイル ・文字スタイル ・グラフィックスタイル 上記機能を活用することで、 デザインの表現をモジュール化(部品化)してチーム内・会社内での共有することで生産性を高めること。お客様とのコラボレーションツールを使ってコミュニケーションコストを下げ、成果物の精度を高めること。Adobe CC からそういった共有化やコラボレーションツールとの連携が強化されていること。IllustratorやPhotoshop、更にそれを取り巻く環境がこんなにも進化しているとは。と感じた勉強会でした。 [コラボレーションツール] ・アボカド https://avocode.com/home/ ・ゼッペリン https://zepli

CodeIgniterのことを勉強したのでメモ。日本語サイトにCodeIgniter Ver.2のユーザガイドがあったのですがCodeIgniter Ver.3のユーザガイドの日本語版が無く、辞書とにらめっこしながら進めました。 間違い等あればご指摘くださいませ。 これからCodeIgniterを学ぶ方のお役に立てれば幸いです。 2016年2月23日追記 kenjis様より日本語ユーザガイドのURLをコメント頂きました。 現在翻訳中とのことです。ありがとうございます。 日本語ユーザガイド http://codeigniter-jp.github.io/user_guide_src_ja/ 2017/01/26 URLが変更されていました。以下が日本語ユーザガイドになります。 http://codeigniter.jp/user_guide/3/ CodeIgniterとはPHP言語のフレー