はてなブックマーク

こんにちは。マークアップのMikaです。 前回、「Foundation 5 のSass版のセットアップについて」お話しましたが、Sass/Compassのバージョンを指定するためにBundlerを使いました。バージョンを指定できるので、環境構築にはとっても便利なBundlerですが、compassのコンパイルにイチイチ「bundle exec compass w」って打たなきゃいけなくて、これちょっと面倒だなぁﾊｧ━(-д-；)━ｧと。 ということで、今回は「タスクランナー」を使ってコーディング⇔ブラウザ確認のもろもろを自動化しちゃいましょう！ タスクランナーって何？ ざっくりと言うと、コーディングしてからブラウザで表示するまでにやりたいこと（タスク）をスクリプトにして書いておくと、まとめてやってくれる便利なものです。例えば、 Sass/Compassのコンパイル CSSのベンダーpref

フロントエンドの、のりこです。 今日はとれたてのネタを一つ。 カスタム投稿タイプはメニューの位置を大体決めることが出来るのですが（位置に関してはこちらのページのmenu_positionの項目を参照） 5（投稿の下） にしているにも関わらず、なぜか5つ目からメディア（10）の下に回っちゃうんです。 そんなときは、function.phpに以下を追記すればカスタム投稿タイプの数がそこそこ増えてもメディアの上に置くことが出来ます！！ function customize_menus(){ global $menu; $menu[19] = $menu[10]; //メディアの移動 unset($menu[10]); } add_action( 'admin_menu', 'customize_menus' ); 投稿が$menu[5] メディアが$menu[10] 固定ページが$menu[20

こんにちは、マークアップのmikaです。 今日は、コーディングをちょっと楽にするPhotoshopの小技をお話したいと思います。 1.テキストデータは「TextExportToCSV」まとめてぽいっと！ コーディングをするときに大切なことは、正しくて、美しいHTMLやCSSを書くことはもちろんですが、原稿を正しく流し込むことも当然のことですよね。 そのため、わたしはコーディングの際に、原稿の手打ちは極力しません。もらった原稿からコピペです。楽をするだけでなく、誤植を減らすという意味合いの方が強いです。 テキスト原稿をデザインデータ（PSD）とは別にもらえる場合はよいのですが、PSDデータだけでコーディングしなければならない場合は、結構やっかいです。 テキストレイヤーを探して、文字情報をコピーして、フォントサイズや色を抜き出して・・・これをレイヤーごとにやるとなると、もう面倒ฅ(๑*д*๑)

こんにちは、Founderのヒロです。 突然ですけどバージョン管理ってご存知でしょうか？ 聞いたことあっても使ったことがないとか。 例えば、制作や開発をチームで或いは複数で行う場合にこんなことないですか？ いろいろ捏ね繰り回した挙げ句、どうにもならなくて戻そうと思ったんだけど、うっかり元ファイルを上書きしちゃった 複数で同じファイルを書き合っちゃった ちょっと書いてるだけで冷や汗が出ますけど、いくら注意していてもこういう事ってありますよね(´・ω・`) 特にコーディングでよく起こり得る現象ですが、こうなってしまうと、いろいろと厄介です。 上書きしちゃった人は、自分のバカさ加減や浅はかさを嘆くしかありませんし、書き合っちゃったらお互いに舌打ちするしかありません<(｀^´)>ﾁｪｯ! バージョン管理は、こういう時に更新される前の状態に戻したり、効率的にマージしたりするのに非常に便利なシステムな

NEW こんにちは。マークアップの胡夢です。 わたしが個人で請けている、外部のWebデザイナーさんから送られてくるデザインデータで、「これだけはやめて欲しい」って事をつらつらと書いてみます(´・ω・｀)ｷﾋﾞｼﾒ 基本的にPSD（Photoshopデータです、一応念のため）を頂いて、そこからマークアップに必要な画像を切り出して使うのですが、毎回苦労する羽目になっておりまして、同じように苦労しているマークアップさんの声をTwitter等で見かけるので、「Webデザインをやるなら、これくらいは知って置いて欲しいなぁ」という内容をまとめてみましたので、記憶に留めてもらえると非常に有り難いです。 お願い【１】レイヤーについて ●レイヤーの結合はホントにヤメテ！ わたしが対応するマークアップ案件はこういったことはほとんど無いのですが、コーディングをしたことがないデザイナーさんでこれをやっちゃう方が居

フロントエンドの、のりこです。 スライダーなどの便利なライブラリを多くの開発者さんが無償提供してくださっていて、利用させていただくことも多いと思いますが ちょっと何かどうにかすればできそうなのにできない！！！ という局面に当たった事はないでしょうか？ こんなときに、親切なライブラリにはcallback関数（コールバック関数）やメソッド群が用意されていますので、ありがた～く利用してみようというお話です。 今回はbxSliderのバージョン4を使用しています。 まずは完成品をご覧いただきましょう。 はい、確かに何の変哲もないスライダーです。 が、bxSliderの場合、最初に自動再生をさせる事は出来るんですが、サムネイルをクリックしてスライドさせたとき・＜＞をクリックして前のスライドや次のスライドを表示した際に、その後自動再生が始まらず静止してしまいます。 そこを克服したのが↑のスライダーにな