サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
katachigfx.jp
レスポンシブウェブデザインとやらをやってみると、色々気をつけなければならない事が出てきたので、少し紹介。 今回、デルタ浜松支部さんのサイトをレスポンシブウェブデザインで構築した。 ●デスクトップ表示 ●タブレット表示 ●スマートフォン表示 ウェブサイト:総合探偵社デルタ浜松支部 ●ポイント1 UAで切り替えるのではなく、画面サイズで切り替える JSやPHPでUAを調べCSSを切り替えたり表示するhtmlを切り替えてたりするのではなく、CSSのメディアタイプを使って表示を切り替えると、よりスマートなサイトになる。 @media screen and (max-width: 768px) { タブレット専用のスタイル } @media screen and (max-width:640px) { スマートフォン専用のスタイル } スクリーンサイズが768px以下の場合タブレット表示。640px
久しぶりのブログ更新は、制作メモ。 つまらない内容ですみませ〜ん。 Movable Type5(スタティック)にて、自動的に更新するには、サーバ側のcronを使って定期的にプログラムを叩く必要がある。 なんとやっかいな。 今回、ハマったのは、ブログ記事のステータスを「日時指定」した際、ブログ以外のウェブサイトインデックスページと他ページに、その新着を表示させるというもの。 「日時指定」の公開は、cronを使って「mt/tools/run-periodic-tasks」を叩けばよい。 ※cpiサーバの場合は、run-periodic-tasksの11行目あたりlibとextlibのパスを/usr/home/…からのパスに変更する必要がある。 ../lib →/usr/home/……/mt/lib ../extlib → /usr/home/……/mt/extlib ウェブサイトインデックスペ
親ページA ├子ページA ├子ページB └子ページC 親ページAに子ページA~Bのタイトルと本文を表示したい場合、親ページA(page.php)に下記コードを記入。 <?php $child_posts = get_posts( 'numberposts=-1&order=ASC&orderby=post_title&post_type=page&post_parent=' . $post->ID ); if ( $child_posts ) { foreach ( $child_posts as $child ) { $c_title = apply_filters( 'the_title', $child->post_title ); $c_content = get_extended( $child->post_content ); $c_content = apply_filter
デバイスの横幅480pxで振り分ける方法がスマートかと。 デバイス画面サイズ480px以下はsmart.cssを読み込み、デバイス画面サイズ481px以上はstyle.cssを読み込む。 <link rel="stylesheet" type="text/css" media="only screen and (max-device-width:480px)" href="css/smart.css"> <link rel="stylesheet" type="text/css" media="screen and (min-device-width:481px)" href="css/style.css"> さらに、以前紹介した「スマートフォンviewport の指定」を組み合わせると綺麗に表示される。 <meta name="viewport" content="width=devic
すでに4年もフル稼働だったHDDが、最近悲鳴をあげているのに気づいたので、休ませてあげることにした。そして、MacBook Pro[ Mid 2007 – 17inch]を買ってもう4年も経ったことに気づいた。 もう4年も経ったのか…。 持ち歩かないのにMacBook。 というか17inchのMacBookなど重くて持ち歩きたくないし! どうせだったら、iMacでも買おうか!?いや、MacBook Airだ! なんて、妄想する毎日だったが、このMacBook Proは独立した時に買ったもので、愛着もある。カタチグラフィックスの歴史が刻まれた道具だ。 汗水垂らして必死に貯めたお金で買ったものだし、こいつのおかげて今までやって来られた。 と思っていると、MacBookは、レインボーをいつも以上にクルクル回し、HDDをガリガリ音を立てながら「おれはまだまだやれるぞ!」と言っているよう
携帯サイトはShit_jisで作らなくてはならない。 じゃないと、文字化けしてしまう。 WordPressなどSJISではないシステム環境を使って携帯サイトを作る場合、ブチあたる問題だ。 そこで、最終的にブラウザで表示するタイミングでUTFもしくはEUCをSJISにしてしまう方法を教えてもらった。Thanks enworks!!! ※実際は、一度UTF(EUC)で書き出したものをキャッシュし、そのキャッシュをSJISにして表示する。そのため、ソースのcharsetにはSJISと表記されていない。 方法 テンプレートになるphpファイルの頭に、 <?php header("Content-Type: text/html; charset=Shift_JIS"); ob_start(); ?> phpの最後に、 <?php $out = ob_get_clean(); $out = mb_co
画像のマウスオーバーをきもちよ〜くする方法。 サンプルはBOOMBOOM-BASHのGllary フワッとした感じがたまらない★ 必要なものは、jQueryとちょっとしたJavascriptだけ。 まず、jQueryは、Google AJAX Libraries APIを使うと便利。 AJAX Libraries API についてはこちら 今回使うjQueryのURLは「http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js」 これをhead内に書く。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2/jquery.min.js"></script> ちょっとしたJavascriptはこれ $(docu
<?php if( is_page(‘ページID’) || is_page(‘ページID’) || is_page(‘ページID’) ): ?> 内容 <?php endif; ?> –制作メモ
最近、このブログにも登場!ウィンドウ下部から離れたくないフッター。 そんな愛嬌いっぱいのフッターを作る方法を紹介します。 CSSはこう html,body { height:100%; } html { overflow-y:scroll; } div#footer { position:fixed; bottom:0; width:100%; } /* IE6 */ * html, * html body { overflow-y:hidden; } * html div#main { height:100%; overflow-y:scroll; } * html div#footer { position:absolute; bottom: expression(this.parentNode.clientHeight % 2 == 0 ? 0 : -1); } IE6対策としてハッ
WordPressのPageに対する条件分岐が、非常に弱い。 例えば、特定の親Pageにぶら下がる子Pageに対して条件をかけたい。 Pageに対する条件分岐テンプレートタグは <?php if (is_page( PageのID/タイトル/スラッグ )):?> 〜 <?php endif; ?> しかなく、Page全てか、特定のPageにしか条件をかけられない。 そこで、下記の2つのファイルを修正することで「特定の親Pageにぶら下がる子Pageに対して条件をかける事が出来る」 ● wordpress/wp-includes/post-template.php このphpに下記のソースを追加する function thePostParent(){ global $post; return $post->post_parent; } ※thePostParent()は、そのPageの親Pa
静岡のセレクトショップ、ルシェルシュ(recherche)、フロレゾン(FLORAISON)、 スープ(SOUP)の商品が楽天で買える! Le Texte楽天店舗の制作をKatachigfxでやりました。 楽天サイトは昔と比べてだいぶ作りやすくなっていました。 ●取り扱いブランドはこちら(2013.10) women's Acne / ADAWAS / AG / CARVEN / Chan luu / Chloe / CITRUS / CLARE VIVIER / Current Eliott / DUVETICA / ENSORCIVET / EPICE / FABIO RUSCONI / FLORENT / Frank&Eileen / Gaimo / GIORGIO BRATO / HUMANOID / iliann loeb / JAMES PERSE / Jerome Drefu
このページを最初にブックマークしてみませんか?
『ローズドレス口コミ副作用|乾燥するシーズンに入ると…。』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く