WEB/システム/IT技術ブログ

Windows上のXAMPPのローカル開発環境で、eclipseを使ったPHPプロジェクトのリモートデバッグ環境を構築します。

前提条件として、各々のバージョンは以下の通りで、既にインストール済みとします。

  • Windows 7 Professional 64bit
  • PHP 5.5.11
  • XAMPP 1.8.3
  • xDebug 2.2.3
  • eclipse 4.3

PHPとxDebugはXAMPPに含まれているものをそのまま活用するので、個別に用意する必要はありません。

高さが動的な要素について、そのエリアの上下(高さ)中央にテキストや画像を置きたい場合があります。

tableを使えば簡単に実装できますが、いくつか問題点があります。
そこで、「line-height」と「translateY」を利用した方法を紹介します。
しかしどれも万全とはいかないので、他に方法があればご教授いただけると大変助かります。

tableコーディングの問題点

容易な方法としては以下のようtableタグを使う方法がありますが、「テーブルコーディング」という言葉があるようにソースがあまりきれいではありません。

しばし、WordPressでページの引っ越しなどでページ単位でリダイレクトをかけたい場合があります。

リダイレクトさせたいページ毎に投稿を編集でJavaScriptなど記述してリダイレクトさせる方法もありますが、便利なプラグイン「Simple 301 Redirects」を発見したのでメモとして残します。

WordPress › Simple 301 Redirects « WordPress Plugins

WordPressカスタムフィールドプラグインの決定版「Advanced Custom Fields」(ACF)のご紹介です。

最近では開発コストの面からCMSをスクラッチでゼロから開発する事も少なくなりました。
一方で既存のフレームワークやCMSをカスタマイズする事が多くなってきたのですが、その中でもWordPressをベースにした案件が多いです。

WordPressを改造するにあたり、必須となるのが「カスタムフィールド」。今回はACFの導入方法とそのメリットについて検討します。

ACF { Advanced Custom Fields Plugin for WordPress

WordPressを含め、ブログサイトにソーシャルボタンは欠かせないツールとなりました。

メジャーなSNSボタンにはTwitter、はてなブックマーク、Facebook、Googleプラス、mixiなどのサービスがありますが、これらの技術仕様は全て異なるので、複数のボタンをブログに設置するにはそれなりの労力を必要とします。また、その機能は日々進化しており、予期なく仕様が変更されることもあるので、その管理は大変です。

そこで、これらの管理を一括できるWordPressのプラグインを探していたらありました。

「WP Social Bookmarking Light」
このプラグインを利用することで、先に述べたSNSボタンの他、数十種類ものサービスを管理画面から一元管理できます。

ホームページ制作においてダミー画像などを作成する場合がありますが、「placehold.it」を利用すると便利です。
Placehold.it – Quick and simple image placeholders

バナーなどがまだ確定していない状態でホームページをテストアップする場合に、PhotoshopやFireworksなどグラフィックソフトでダミー画像を作成することがあります。
ダミー画像が多い、サイズが様々、変更が多い時などは、その作業がめんどくさいです。

そんな時に「placehold.it」を利用すれば、コードを書くだけでダミー画像が生成できるので便利です。

WordPressで作成したブログで、簡単に記事の一覧を出力したい、つまり、簡単にサイトマップページを作成したいと思い、調べていました。

ある程度PHPをプログラミングできるので、初めはオリジナルでプラグインを作成してみようかとも考えていましたが、調べている中でとても便利なプラグインを見つけました。

「PS Auto Sitemap」
このプラグインをインストールすることで、簡単にサイトマップページを作成することができます。

WordPressには、テーマの管理画面からサイドメニューなどのウィジェットを操作できる機能があります。

HTMLやPHPなどWPソースを調整できない方には、ブラウザを通して管理画面からある程度ウィジェットをカスタマイズできるので便利な機能です。但し、そこから自動生成される各々のウィジェットのHTMLコードは、自由にカスタマイズするには都合が悪く、私の場合はその機能を停止していました。

ここで、Webの世界に入ってある程度CSSでのレイアウト力も身に付きましたし、今一度ウィジェット機能の仕様を見直してみて、活用できないか試してみます。

楽天RMSでページを構築する際に、ページ内リンク(アンカータグ)を貼る方法です。

Webサイトでのページ内リンク

通常、Webサイトを構築する中で、ページ内リンクを貼る場合は、以下のようにします。

<a href="#section1">ページ内リンクです</a>

このリンクをクリックすると、ページ内の以下の場所までジャンプしますね。

<div id="section1">
こんてんつ
</div>

ここで、楽天RMSで上のような実装をすると、リンクをクリックした時にエラーページへと遷移してしまいます。
これは、楽天RMSが外部へのリンクを全面禁止しており、「#section1」を外部リンクとして扱っしまっているのが原因のようです。
つまりリンクをクリックした時に、「#section1」は外部サイトなのでエラーです、といった趣旨のエラーページが表示されてしまうわけです。

RMS(Rakuten Merchant Server)は、いわゆる楽天のショッピングサイトを管理する機能、サービスです。
RMSを利用して商品の管理・販売はもちろん、サイトの構成やデザインを調整することができます。しかし、利用できるWeb技術の制約もあり、構築作業はなかなか一筋縄ではいきません。

さて、最近のWebサイトではボタン画像のマウスオーバーやスライドショーなどJSを活用して構築するのが一般的です。
しかし、RMSでは制約でJavaScriptが使用できません。正確には、RMSではデザイン構成する方法としてHTMLを流し込めるエリアがあるのですが、そこでいくつかののタグが使用禁止とされています。その中でJavaScriptを記述するエリアの「script」タグも禁止なのです。その他にも外部ファイルの読み込みが禁止なので、「.css」や「.js」などのインクルードも不可能です。
つまり、楽天RMSのみではJavaScriptを使用したWebサイトの構築ができないわけです。

Monthly Archives