atomicbox

Macでウェブ制作するための開発関連メモを残していきます。(html/JavaScript/jQuery など)

Category: ウェブサイト (page 2 of 4)

【PHP】PHP入門・基本のきほん2

【PHP】PHP入門・基本のきほんに引き続き、PHP初心者の方向けにPHPのことを解説します。
前回はとりあえずPHPファイルを作ってみよう、というところの話だったのですが、今回は座学的にPHPを見て行ってみようと思います。
前回の続きというよりは、合わせて読んでいただけたら…という内容になっています。

Continue reading

【cakePHP】アソシエーションとContainableBehavior

久しぶりにcakePHPの記事。

cakePHPではアソシエーションという、テーブルとテーブルの関連付け機能を核にもっていて、なかなか便利です。

  • 「ユーザー(User)」は「プロフィール(Profile)」を一つだけ持つ
  • 「ユーザー(User)」はお気に入りの「曲(Music)」をたくさん持つ
  • 「ユーザー(User)」はお気に入りの「アーティスト(Artist)」をたくさん持つ
  • 「ユーザー(User)」はお気に入りの「映画(Movie)」をたくさん持つ
  • 「曲(Music)」は提供する「アーティスト(Artist)」を一つだけ持つ

このような構造を設定できるので、「ユーザー(User)」情報を取得した時に、関連する「プロフィール(Profile)」、「曲(Music)」、「アーティスト(Artist)」、「映画(Movie)」さらには曲に関連する「アーティスト(Artist)」のデータまでまとめて取ってくるということが簡単にできます。これがアソシエーションです。

しかし、このアソシエーション。
簡単に設定できるのですが、設定してしまうとユーザー情報と曲のデータだけ欲しいというときにも、アーティストや映画の情報まで引っ付いてきてしまいます。おまけに、不要なアーティストや映画の全フィールドがくっついてきます。

「今回はアーティストと、映画のデータはいらないから」と、関連を一個一個削除することもできますが、ContainableBehaviorを使うと、「曲のデータだけいるよ」と設定すればその他の余計なものが勝手に除外されるので直観的だし楽です。
さらに、フィールドのフィルタリング(曲データの中でも、「曲名」だけ取ってくるなど)も簡単に扱えます。

※ContainableBehaviorはあくまでアソシエーションに対してフィルタリングをするので、アソシエーションの設定と置き換わるものではありません。

Continue reading

【html5・css3】スマートフォン対応(レスポンシブデザイン)の設計ポイントまとめ

スマートフォンでネットサーフィンをしていて、PC用サイトがぎゅっと縮小されて見にくいサイトにあたると「今どきスマホ対応くらいしといてよ~」と思うのですが、いざ自分が作る立場になると「いやいや、そんな簡単じゃないんだから魔法みたいにすぐできると思うなよ?」なんてご都合主義な考えになりませんか。(私はなります。)

今回は現在主流だと思われる「レスポンシブデザイン」という手法でスマホ対応をする時の、設計ポイントをまとめました。

Continue reading

【jQuery】カスタマイズも簡単。定番スライドショーはbxsliderで

WEBサイトを作るとき、何かと入れる機会の多いスライドショー。簡単なようで、デザインを変えたいからといってゼロベースで作りだすと、意外に作るアクションも多くて大変です。

今回は、筆者がよくお世話になっている簡単設置・多機能・スマホにも対応、そして簡単なカスタマイズも対応しやすいおすすめスライドショーjQueryプラグイン・bxSliderをご紹介します。

Continue reading

【PHP】全角・日本語を含む正規表現のパターンマッチ(utf-8)

今回は毎度なにかと苦労させられる、正規表現についての備忘メモ。

日本語のようなマルチバイトの文字列を扱う場合、単純に$str[$i]のようにして一文字ずつ処理をしようと思うと文字がとれませんでした。
マルチバイトの文字列を一文字ずつ分割するには正規表現のpreg_splitを使うと良いみたいです。

Continue reading

【WordPress】カスタムフィールド管理プラグイン・Custom Field Suiteの使い方

WordPressのテーマ製作をしていると、カスタムフィールドをうまく取り入れてクライアントが更新しやすいようにカスタマイズしたいなぁと思うことが多々あります。

今回は、筆者もよくお世話になっている「Custom Field Suite」というプラグインの使い方を書き留めておこうと思います。
Continue reading

【WordPress】オリジナルテーマ製作・コピペシート(基本編)

WordPressのオリジナルテーマを何個か作ってみてだいぶわかってきたので、よくコピペするコードをまとめといたら便利だな~と思いまとめました。テーマ化の規模にかかわらず良く使うやつですね。「あれだよ、あれ!」コピペシート基本編。

Continue reading

【html5】レスポンシブデザインサイトへのSVGの埋め込み検証

SVGってご存知ですか?

Scalable Vector Graphics(スケーラブル・ベクター・グラフィックス)という、画像形式のひとつなのですが、これはJPEG、PNG、GIFなどのピクセルの集合体で表現される画像ではありません。

Continue reading

【PHP】PHP入門・基本のきほん

htmlのページは作ったことあるよーというレベルの人向けに、PHPの基本のきほんについて書いてみました。

Continue reading

【jQuery Plugin】透明画像のパラパラアニメが作れる SwitchAmimeChan

数枚のパラパラアニメが作れるスライドショーが欲しかったのですが、いいのが見つからなかったので作りました。
背景が透けて見える、透明画像をつかったパラパラアニメにも対応しています。

デモ用ページを作ったのでご紹介します。
デモとしてニュンニュン動いているロングなうさぎさんは、デザイナーの友人・ガーナさんに描いてもらいました。
どうもありがとう(^^)

スクリーンショット 2014-12-12 18.00.04

SwitchAmimeChanのデモページとダウンロードはこちらです。

SwitchAmimeChan – jQuery Plagin

一覧がさみしいので、まず5個くらいは作れたらいいな〜という目標でポツポツ作っていきます。
2014年残すところも少なくなってきましたが新年を迎えるまでがんばっていきましょう!

おわり

Older posts Newer posts

© 2017 atomicbox

Theme by Anders NorenUp ↑