regular
最近gulpという単語をよく目にするようになりました。 gulpとは何ぞや？と思い調べてみると、Gruntと同じようなタスクランナーらしいです。 Gruntよりタスクが書きやすい/見やすいとこと。 とりあえず使ってみようということで導入してみました。 その際のメ…
先日、社内の勉強会でLT大会がありました。 以前からLTに興味があったので、思い切って発表者として登壇してみました。 色々と考えが甘く、ボロボロだったので記念に記録しときます。 スライド作りが大変 これですね。 LTって5分じゃないですか。 だからスラ…
「Package Control: List Package」でインストールしているパッケージの一覧を見ることが出来ますが、一覧をテキストで出力したく、何か方法は無いかと調べました。 調べてみると、同じことを書いている方がいらっしゃいました。 本当にありがたいです...！ …
ソーシャルボタンをオリジナルの画像にしたい、ってことありますよね。 そのときにしなければいけないのが、対象ページのURLやタイトルのURLエンコード。 今までは URLエンコードをしてくれるツールやWebサービスを開いて エンコードしたい文字列をペースト…
ページを見ているとたまにSafariのURLバーの色が白ではないサイトがあり、どうやってるんだろうと思い調べました。 bodyの背景色を変えるだけだった CSSを見たらbodyの色を変更しているだけでした。 これだけで出来るんですね。 ただ指定した色になるわけで…
Sublime Textのプラグイン作りがきっかけで、Pythonの勉強を始めました。 書籍を片手に写経をする日々。 Python面白いよPython 書籍のコードを眺めていると、1行目に必ず #!/usr/bin/env python という記述が。 おまじないだと思ってスルーしていましたが、…
案件が落ち着いてきたので今までちゃんと勉強してこなかったSassを勉強しようと『Web製作者のためのSassの教科書』を読み始めました。 変数の書き方など初歩的なことから案件で使えるようなコードまで載ってて素晴らしいですね。 もっと早く読めばよかった。…
ガラケー用ページを制作している時に、半角カタカナを一々入力するのが面倒で面倒で...。 練習も兼ねて「toggleKatakana」というプラグインを作成しました。 toggleKatakana 使い方 HTMLの文書中でコマンドパレットを開き toggleKatakana: convert to Single…
Sublime Text(以下ST)2で愛用していたプラグインの「Hayaku」がついにST3ネイティブになってしまいました。 それを受け、やっと重い腰を上げてST3に移行してみましたが、タイトルの通りの部分でハマったのでメモ。 因みに、次に説明するのはMacのみです。 Wi…
今更感が凄いのですが、案件で必要そうだったので勉強がてら作りました。 このプラグインを使用すると特定の要素の背景またはページ全体の背景にYoutubeの動画を流すことが可能になります。 デモページを作ったのでご覧ください。 デモページ ページ全体の背…
去年辺りから増えてきてますよね、1ページで完結するサイト。 僕もシングルページの案件を色々と携わっているのですが、ちゃんとした仕組みを調べたことはなく...。 流石にマズイかな...と思い、勉強がてら作りました。 デモページを作成しましたので、まず…
最近重い腰を上げてGitを使い始めました。 「開発効率をUPする Git逆引き入門」を片手にコマンドをポチポチ打っています。 やはりバージョン管理ができるといいですね。 プラグイン作りがとてもやりやすくなりました。 今日はローカルで作成したブランチをリ…
ティッカーっぽく画像が次々に流れるスライダーが案件に必要になり、思い切って作ってみました。 折角なので公開しようかと思います。 コード プラグインは以下の場所においています。 見て頂けますと幸いです。 jquery-imageslider.js デモ デモ用のページ…
前回に続きまたAndroidの問題です。 スマホサイト案件で画面いっぱいの固定配置の要素を敷かなけれいかず、以下のようにコードを書きました。 HTML <div class="mod-posf"></div> <div class="mod-page"> . . . </div> CSS .mod-posf { background: rgba(0, 0, 0, 0.6); height: 100%; position: fixed; width: 100%; …
Android(4.x)端末で position: fixed; した画像がぼやけてしまいます。 百聞は一件に如かずということで、次の画像を御覧ください。 枠線で囲んでいる部分は position: fixed; にした要素です。 比べてみると画像がぼやけて見えるのがわかるかと思います。 …
タイトルのとおりです。 以前からレイアウトが気になっていたので思い切って変えてみました。 人生2度目のデザインですｗ レイアウトを考えるにあたって、以下のツールやスライドには大変お世話になりました。 HUE360 Font Awesome Google Fonts 連休中にな…
タイトルの通りです。 今回のCSS Niteは技術的な話ではなくUI/UXについてでした。 UI/UXという言葉はよく聞くのですが、詳しくは知らなかったので参加してみた次第です。 講師の方々ですが、「UI/UXといえばこの人！」というと真っ先に名前が上がるであろう…
Tumblrって月別投稿数を表示するタグってないんですね。。 某案件でこの機能が必要だったので、jQuery Boilerplateを使用してのjQueryプラグイン作りの練習も兼ねて作成しました。 WordPressやMTなら割と簡単にできるのに。。 Satoh-D/jquery-tumblrMoArcs-j…
3/20に発売された「Web製作者のためのSublime Text2の教科書」を読みました。 普段からSublime Textをメインのエディタとして使っている自分としてはとても気になっていた本で、やっと入手することが出来ました。 インストールから基本設定・使用する上での…
せっかくGitHubのアカウントを取得したことだし、スニペットをGistで管理したくなりました。 普段Sublime Text2で作業しているので、何か良いパッケージが無いか調べたらGistというものがありました。 さすがSublime Textですね。ありがたやありがたや。 ※Su…
VMWare上で動いているWindows7のブラウザから、Macのlocalhostを閲覧するのにすごいハマったのでメモ。 今回の作業環境 とりあえず、今回ハマった環境がこちら Mac OS X 10.9.2 VMWare 5.0.1 Windows8 64bit XAMPP for Mac 1.8.3 設定方法は以下のとおりです…
今まで自分の中で勝手にcontentプロパティ内で改行は出来ないものだと思ってましたが、出来るんですね。 案件で入れたい事態になり、調べてみたらありました。流石Google先生。 content内で改行する方法 以下の様に指定します。 .hoge { content: "\A"; whit…
タイトルのまんまです。 スマホサイトを作っている際、img要素のwidth, heightの値って画像サイズの半分の値をいれなければいけませんよね。 今までは自分で計算して都度値を入力していたのですが、その作業がとても面倒...。 何かうまい方法は無いかと調べ…
最近よく聞きますよね、Git。 言わずと知れたバージョン管理システムですね。詳しいことはここを読むといいと思います。 僕は今まで使ってなかったのですが社内でも話を聞くことが多くなり、そろそろ使わなければ...！と思い、使い始めることにしました。 使…
tumblrで1ページにあたりに表示する記事の数を変更する場合のメモです。 あまり記事の数が多いとスクロールが面倒なので、適宜調整すると良いかと思います。 記事数の変更方法 管理画面から「テーマのカスタマイズ画面」を表示します 画面左下にある「詳細設…
急に「タルトを作りたい！」と思い、作っちゃいました。 作るまでは生地作り面倒…とか思ってたけど意外と簡単に作ることが出来て若干拍子抜けしました。 忘れないようにメモしときます。 材料とか作り方は以下のとおり。 材料 タルト型16cm 1枚分 無塩バター…
SSI(Server Side Include)を使用する案件に携わった際、ローカルの環境を整える際にハマったのでメモ。 サーバでは .html でSSIが使用できていたのにローカルでは何故か出来ない...。 調べてみると簡単に見つかりました。 XAMPPは初期状態だと .shtml しかSS…
先日、Stocker.jp様の新春プレゼント企画のお知らせという記事にて ダメ元で「プロになるためのWebデザイン入門講座 実践で役立つPhotoshop＆Illustrator徹底ガイド」 に応募したところ、見事当たりました。 今年はコーディングだけでなく、デザインも少しず…
新年明けましておめでとうございます。 今年もゆるゆると記事を書いていこうかと思います。 WordPressでテンプレートを作成している際、日付を表示するために the_date() 関数を使用していました。 ある日、同僚の指摘により「同じ日付の記事が複数ある場合…
今回携わった案件で、初めて子テーマ機能を使用したのですが、 子テーマのディレクトリのパスを出力する際にハマったことがあったのでメモ。 子テーマ内でのbloginfo('template_url'); は非推奨らしい 子テーマのディレクトリにあるファイルを指定しようとい…
