ShitTakaBull by tetch1987

WordPressやjQueryなどのウェブ制作をはじめとするテクニックデータベースです。知ったかぶっているていで読んでもらえると幸いです。

スマートフォン対応について

作成日
2015/01/27
更新日
2016年8月16日

iPhoneやアンドロイドなどのスマートフォンが流行り始めてから数年もしない内に、すぐにweb制作においてスマートフォン対応が注目されてきました。ここでいうスマートフォン、いわゆるスマホはiPhoneやアンドロイドなどここ数年で出てきた携帯電話としておきます。フィーチャーフォンと呼ばれるガラケーの対応でも、ウェブ制作者の方々は時と場合によって表示の切り替え方を変えてきたと思います。.htaccessを変更してディレクトリで振り分けるのか、サブドメインなどを取得して個別のサイトを構築するのか。個人的には制作費が許される限り1つのデータベースでそれぞれのサイトを構築し、デバイスによって切り替えるのが理想的だと考えています。しかし、最近のGoogleではどうも1つのHTMLにCSSでの対応させる方法を勧めているようです。そのことをGoogleは色々と理由は述べていますが、私はGoogleが絶対正しいかというとそうではなく、あくまでGoogle検索にとっては都合がいい程度に考えています。はっきり言って日々変わっているGoogleが今後より高性能のアルゴリズムを作ってしまえばそれで終わりだと思うからです。
スマホ対応もフィーチャーフォン対応と同じように、色々な対応の仕方があります。製作費や時間、サーバ環境などはあると思いますが、維持管理や今後のウェブ展開も考え、正統な対応をしていればしばらくは衰えないと思います。
このようなスマホ対応についてのページは沢山あるため、このページでは個人的に思うことを多く書いていこうと思います。主流に乗っかるのではなく新しいデザインや方法を見つけるヒントになれば一番嬉しいですが、どちらかというと意見が欲しかったりします。そのためこうすればいいという記事というより、こう考えているんだけど、程度に見てください。
(さらに…)

WordPress 固定ページの最上親ページを取得する

作成日
2014/12/27
更新日
2016年8月16日

WordPressで固定ページの一番上の親を取得したいときがあるかと思います。get_postなどで得られる固定ページの情報には親のIDしかなく、さらにさかのぼった情報はありません。そのため、孫まで行ってしまったときに祖父を言い当てるのには少々工夫が必要です。
(さらに…)

WordPress:検索フォームを設置する

作成日
2014/11/05
更新日
2016年8月16日

WordPressの検索フォームを設置するためには、決まり事があります。今までは独自に検索フォームを作ってWP_Queryに組み込む方法をしていたのですが、勉強も含めて通常のループで表示できる検索フォームをまとめてみようと思います。
余談ですが、キーワードは1600文字以内と制限されているみたいですね。「Fairly insane upper bound for search string lengths.」と書いてあるように、非常識な文字数ではあります。
(さらに…)

WordPress管理画面にメニューを追加する

作成日
2014/10/31
更新日
2016年8月16日

WordPressのテーマやプラグインを作成時、管理画面にメニューまたはページを追加したいときがあると思います。特にプラグインの作成するときは独自の設定画面を作る場合が多いと思いますが、どこのメニューに追加するかサクッとできるように記事にしてみました。
参考元:http://wpdocs.sourceforge.jp/Adding_Administration_Menus
(さらに…)

jQueryでアニメーション:要素を動かす

作成日
2014/10/07
更新日
2018年4月13日

jQueryでアニメーションをする際、要素を動かすのは比較的分かりやすい効果かと思います。もちろん目的にあった実装でないと目障りになってしまう可能性もありますが、アニメーションっぽさはぐんと上がり作っている最中も楽しくなります。jQueryでの動きの実装は、基本的にレイアウトを徐々に変更するイメージのため、CSSと密な関係にあります。ブラウザ対応の問題もありますし、jQueryではなくCSSの設定が問題で動かないこともあります。jQueryの要素を動かす方法をまとめるために、徐々に更新していこうと思っています。
主流になっているCSS3のアニメーションについてを追記(2018/04/13)しました。
(さらに…)

jQuery + PHPでHTMLに画像アクセスカウンターを設置する

作成日
2014/09/09
更新日
2016年8月16日

アクセスカウンターの設置は最近減ってきたかもしれませんが、作ることがあったのでメモ。アクセスカウンターはフリーのcgiなどが落ちていましたが、デザインを決めれたり著作権表示をしなくてくていいので、自作した方が早いと思いました。
今回はHTMLからjQueryのAjax()からPHPを実行させ、あらかじめ用意しておいた画像で+1したアクセス数を出力させる方法です。PHPファイルで表示している場合はそのままPHPで表示させればいいのですが、HTMLファイルの場合は静的ページとなるので、Ajaxを利用してPHPを実行させます。
PHPは動作するけど既にあるHTMLファイルにアクセスカウンターを表示させたい場合に便利かと思います。
(さらに…)

外部ECCUBEの商品RSSをWordPressのテンプレート内に表示する

作成日
2014/07/15
更新日
2016年8月16日

会社概要やトップページをWordpress、商品販売ページをECCUBEとして利用している方も多くいると思います。しかし困ってくるのがトップページなどに新着情報(WordPressの投稿)と新着商品(ECCUBEの商品)を同時に掲載したい場合。この方法ではWordpress内でECCUBEの商品RSSを取得して表示します。ECCUBEにWordpressの投稿を表示させるプラグインなどはあるようですが、ページを簡単に作れるWordpressの方をメインに使いたい場合などに便利です。また、外部にECCUBEがある場合にもこの方法は利用できるため、ショップ専用のサーバから取得することもできます。
(さらに…)

jQueryでグリッドデザイン:縦横が任意の大きさのボックスで埋め、外枠の縦を可変にする。

作成日
2014/07/04
更新日
2016年8月16日

グリッドデザイン的なものをjQueryでしようかと思っていたのですが、ちょうどいいのが見つからなかったので自作してみました。
今回の場合、グリッドの大枠の横幅は制限があり、縦に伸びる形です。また、グリッドの各マスは正方形で、入れるボックスはマスの倍数の大きさになります。たとえば、2マス×3マスのようにボックスは縦横が任意の大きさにすることができます。大きさはボックスのHTMLクラスによって指定し、jQueryで指定した大きさに変更する形です。
クラスによって大きさを指定させたのは自分でボックスごとに指定したかったためなのですが、内容物に合わせて大きさを変更するにはもうちょっとカスタマイズが必要です。
(さらに…)

WordPressのループ

作成日
2014/05/13
更新日
2016年8月16日

WordPressのループについてまとめてみました。普段テーマ作成をする度に書くのも面倒くさい時があるので、テンプレートを用意しておくと楽かと思います。

WordPressのループとは

投稿の情報などを表示する際に必要なPHPコードで、Wordpressのテンプレートタグなどを利用します。
管理画面から入力した投稿などの情報をデータベースから引っ張って来るわけですが、接続や取得する条件などをWordpressのテンプレートタグによって行うことにより、簡易化したPHPコードで取得条件の指定や表示ができるようになります。
ループは何をしているかというと、次の記事があるまで記事を取得して処理を繰り返し行います。次の記事がなければループが終わります。このようにして取得→処理の繰り返しを行うのですが、記事ページや最新記事一覧などもループで行う場合がほとんどだと思います。
ループで何を取得するかはパーマリンクと関係があります。パーマリンクによって記事が読み込まれています。そのため、記事ページではその記事をループで処理し、カテゴリーページでは該当カテゴリーの記事を管理画面で設定した表示件数分だけ繰り返し処理します。これはメインループといい、表示されているページによって異なる記事を読み込みます。パーマリンクについてはこちら
(さらに…)

Category

Archive