fbpx

「PHP」の検索結果

WordPressのビジュアルエディタと実際の表示を合わせる

WordPressのビジュアルエディタと実際の表示を合わせる

WordPressのビジュアルエディタは実際の表示をプレビューしながら投稿や固定ページを作成できるわけですが、スタイルシートも編集に反映されたらより便利です。
特にクライアントに納品するWordPressサイトであれば、使える機能かもしれませんね。
今日はその方法を紹介します。

functions.phpを編集

functions.phpに以下のコードを記述をします。(※<>は全角で書いています。実際は半角にします。)

<?php
add_editor_style(‘editor-style.css’);
?>

ビジュアルエディタ用のCSSの設置

上記コード内の「editor-style.css」がビジュアルエディタに適用させるスタイルシートです。
テーマディレクトリ直下に「editor-style.css」を作成するとビジュアルエディタに反映されるというわけです。

CSSを編集

作成した「editor-style.css」に、通常どおりスタイルを記述するとビジュアルエディタに反映されます。
ビジュアルエディタ用に独立したCSSなので好きに記述して構いませんが、実際の表示に合わせる目的であれば…

<?php
php the_content();
?>

…に適用させているスタイルに近い記述が必要になります。
是非お試しください。

ギターづくりの思いを載せたWEBサイトづくり

ギター作りの街、長野県松本市のとなりの塩尻市にあるカスタムメードギターショップT’s Guitarsのサイトが完成した。T’s Guitarsの代表の高橋さんは過去のサイトでは1日の半分を顧客のメールの返信に使っていたらしい。時間を簡易見積りシステムの導入でお問合せメールが激減したらしい。多くのサイト構築では、お問合せメールを如何に多く得ることが出来るかを工夫するのだが、その逆となった。

WEBサイトを構築してビジネスが簡素化して便利になることを目的にサイト構築をする場合は少なくない。しかし、このサイト作りの最終的な目標はそこにない。私がこのサイトでアピールしたいのは、このサイトのクライアントであるT’s Guitarsの仕事へのこだわりである。カスタムメイドする顧客と代表である高橋さんがエレキギターに使われる木材や部品一つ一つを顧客と打合せするスタイルにある。人気の国外モデルではないのに多くのミュージシャに愛されるその理由を言葉ではなくサイト全体でアピールしたかったのです。

カスタムメイドギターという世界のコンテンツを十分に発信でききるようCMSのシステムをWordPressにし、Flashを使用せず(一部サイドバーに使用)、スマートフォンやiPadにも最適化した。そして、T’S Guitarsの若きスタッフのギターづくりの想いが届けらればと制作をした。

私のホームページ作りは、クライアントの思いや情熱をデジタル化することにある。

T's Guitars

ティーズギターWEBサイト

@importは時代遅れだって?

これまで様々なサイトに携わってきたが、CSSファイルの細分化には気を使ってきた。
なぜなら、圧倒的に管理が楽だからだ。

制作中もさることながら、再び改修する際も自分が見て分かるようにマークアップし、IDやクラスのネーミングも統一化させ自分の中で定義付けを行うことで、久しぶりに覗く自らが書いたコードにもすんなり順応できる。

@import

その際に多用してきたのが「@import」。
CSSを細分化し(要するにブロックごとに分けたり、用途によって分けたり…)読み込ませることで、加筆や削除を容易にさせておくことができる。全体的には変えないが、ちょっと大がかりに変えるなどという場合に、他の部分に影響なすることなくスムーズな改修ができる。

しかし、@importはレンダリングが遅いのも事実だ。おそらくPHPやCGIを使ったサイトだと軽く不愉快なほど遅く、昔のWordPressやXoopsではかなり体感できるほど読み込みスピードが遅い。

Object Oriented CSS

最近では「Object Oriented CSS」という手法が採用されているとのことだが、調べてみると既に自分も少し導入していた手法であった。
IDにスタイルを定義付ける手法が一般的だ。つまりロケーション(ヘッダやフッタ…)ごとにスタイルを作る。しかし、Object Oriented CSSとはサイト全体クラスを付けて、必要なプロパティを「パーツ」のように付けていく。
簡単に言うと、よく使うプロパティは色々なところで再利用できるということだ。サイト全体をObject Oriented CSSで作ったことはないが、パフォーマンスも向上するのだろうか?
初動制作時の工数はかかりそうだが、これも自分の中のスタンダードを徐々に構築しておくことで、再び改修する時に手間がかからなそうだ。

Object Oriented CSS

グローバルメニュー構築の効率化!

Webサイトを制作していくなかでグローバルメニューのデザイン・機能はサイトのナビゲーションとして使いやすく分り易くなくてはならない。マウスオーバーなどで画像を変えたり、ドロップダウンメニューを加えたり閲覧頂くユーザーに簡単に直感的に扱えるメニューでなくてはならない。

グローバルメニューを構築するのに便利なツールの紹介

画像のマウスオーバーを簡単にするJavaScript
JavaScriptのダウンロードはこちら»
便利な点は、上記のスクリプトを記述すると、マウスオーバーで変更したい画像の名前の最後に「_off」「_on」を付け加えるだけ!
2_off
「2.jpg」をマウスオーバー画像にする場合は、
通常時の画像「2_off.jpg」
オーバーの画像「2_on.jpg」
2つを同じディレクトリに置くだけなのだ。

とても簡単なスクリプトなのだが、画像ファイルにスクリプト書く必要もなくソースもシンプル、導入が非常に簡単なので多くの場所で使用することができる。
もっと詳しくはソースがシンプルなJSによるロールオーバー»で紹介されています。

簡単でデザインのいいjqueryドロップダウンメニューscript

JavaScriptでのメニュー機能で参考になるサイト
jQueryプラグイン サンプル(メニュー系):skuare.net
jQueryプラグインを使ったドロップダウンメニューやメガメニューなどが数多く紹介されているサイト。デザインや機能の実装に困った際に参考に。
こちらもJQueryで簡単に作るドロップダウンメニュー紹介
JQueryで簡単に作るドロップダウンメニューいろいろ

JavaScript・jQueryをつかってクオリティの高いグローバルメニューデザインでユーザビリティーをアップ!

Facebookページの制作とブランディングのページ考え方!

Web Atfではウェブサイト・ホームページ制作したクライアント向けにFacebookページ作成を行っています。iframeで作成したページ提供は、現在のFaxcebookの人気からしても必要なWEBマーケティングの一部となります。そして更にはFacebookページがビジネスサイトのプラットフォームの主流になる考えております。もちろん、WorldPressとの併用にはなりますがショッピングサイトへの連動などを図っています。ソーシャルメディアでの顧客獲得は、最もクチコミを誘発する現在の重要なコミニケーションツールとなったいます。その上、SEO的に効果のあるFacebookページにフォーカスしてまいります。

ブランディングページの考え方をしっかりと持つ!

Facebookの特性を理解することから始める。どうFacebookのファンを構築するかということがビジネスファンを構築し、顧客拡大に繋がる。ブランディングページとは、ある意味で企業の顧客に対する考え方を反映させる。また、顧客満足度を高めるための手法として用いることが新しいクチコミを誘発させる。キレーションの効果を高めることをおススメする。

Facebook Page ビジネス効果を得るための5つの方法。
ブランド力を高めるFacebook Pageの7つのApps
フジQのFacebook利用に学ぶ!
Facebook Pageは共有SSLでも独自SSLでも使えるレンタルサーバーを使えれば、簡単に設置出来る。
Facebook Pageのiframeで、こんなビジネスページを作らなければ!

Déjà vu - 11-365

Web Atfが作ったFacebookページ

クライントのFacebookページを作成しております。現在、Welcomeページを制作しております。

WEB 2.0の2010年を振り返る松本市のWEB制作屋のまとめ!

PALO ALTO, CA - OCTOBER 06: Facebook founder and CEO Mark Zuckerberg looks on during a news conference at Facebook headquarters on October 6, 2010 in Palo Alto, California. Zuckerberg announced the addition of a revamped personal groups feature and the ability to download everything you have posted to Facebook. (Photo by Justin Sullivan/Getty Images)

時代は完全にソーシャルメディアの時代ですね!その中でどうソーシャルメディアと関わって行くのかが今後のウェブ制作のポイントになりますね!

検索サイトを頼りにしないSEO対策!

検索サイトからのアクセスよりTwitterなどからのアクセスが高まっている。つまり多くのネットユーザーは検索サイトでお気に入りのサイトを見つけるのではなく、ソーシャルメディアによる友達の紹介や口コミでサイトを訪問するケースが多くなってきた。このことによりSEO対策よりソーシャルメディアへの最適化にウェブサイト作成の比重が高くなっていくと思われる。しかし、それは、企業がブランディングを行ったりファンづくりをする目的だけに種着するべだと私は考える。

例を挙げます!
○○を欲しいな〜:なんて人はソーシャルメディアでの情報を頼りにする。それは、○○が今すぐ必要ではない!・・・これをWantsという!
○○が必要だ!:なんて人は検索エンジンで情報を求める。よってSEO対策は重要である。・・・これをNeedsという!

つまり、人間が商品を求める時の動機によりWEBマーケテイィングは異なる。それに応じたアプローチが必要であると私は考える。

WEB2.0 ソーシャルメディアの意味!

ブログにしろ、Twitter,Facebookにしろ、個人が簡単にメディアを構成することの出来る時代になっている。そこでもっもと大切なのがコンテンツである。Googleがもっとも上位にランクアップしたいサイトは、上質なコンテンツのあるサイトである。アルゴリズムを駆使して日々挑戦を行っている。そして、世界第2位のアクセスを集めているFacebookは、それだけでビジネスサイトが構築出来るパフォーマンスを持っている。つまり、その特性を確実に理解して優良なコンテンツを発信するサイトがWEB2.0では勝者となる。そのことを踏まえてWEBサイト制作、WEBサイト構築を行わなければならない。地方には地方のコンテンツがあり、スモールビジネスにはスモールビジネスのコンテンツがあると私は考える。

iPhone,iPadの人気のモバイル全盛期!

モバイルへの最適化が必要な時代になった。iOSが、falashに対応しないことによってサイトからflashを取り除くサイトが続出した。iOs対応のテンプレートプラグインも大ブレークした。ソーシャルメディアをモバイルで利用する人が増えた以上その対応は当然のことだ。また、多くのアプリの開発によりウェブサービスの方向を転換を余儀なくされた2010年でもある。
2010ベストiPhoneアプリまとめ(仕事用、便利、Twitterとか、教養・趣味!なアプリまとめ75個)
2010年に誕生した新しいWEBサービスリンク集

「目から鱗」の情報の宝庫、ソーシャルブックマークはてな

100%は信用出来なくても目から鱗が出るような情報のまとめがはてなのブックマークにエントリーされている。まとめサイトの人気の日本ではNaverは注目のサイトだ!知らなかったことは、はてなのブックマークエントリーとNaverで十分カバー出来るような気もする。自己のビジネスに新しいヒントが得られるのもこのサイトからではないか?
モダンなUIを活用したショッピングサイト運営用phpオープンソース「LiteCommerce」

TwitterからFacebookへのスライド!

Web2.0へのかかクァリを意識しないTwitterのユーザーの増加にFacebookへとスライドするユーザーが増加している。2011年1月15日に封切られるソーシャルネットワークの映画の放映後は日本でもかなりブレークするだろう!やはりFacebookを使いこなすとTwitterが面倒になる。そして、Facebookの機能はネットユーザーの心をとらえているサービスが多い!時代は完全にFacebookの時代になる。WEBサイト制作には、このfacebookを取り入れ方がポイントなるだろう!

Googleの必死さが伝わるほどスゲェーChrome Web Store
FacebookプラスTumblrの時代!
日本マクドナルドに学ぶ松本市ローカルビジネス!

最後に!
ソーシャルメディアの活用を避ける訳に行かない時代に突入した。しかし、そればかり注目してはならない。また、web2.0やソーシャルメディアは、一見経費が掛からないように思えるが、時間と言う経費やコンテンツを構築する経費はそれほど安価ではない。また安易に参加すると効果を得るどころかマイナスになってしまうこともある。問題はやはり鮮度の高い良質なコンテンツを構築することが最も大切なことではないだろうか?ラーメン屋が新作メニューを作るまでのコンテンツなどは、顧客のファンを獲得するには最高のコンテンツである。ソーシャルメディアによりラーメンづくりに参加することも出来るからだ!
2010年は、多くの方に指示して頂き沢山のWEBサイト構築に携わることが出来て幸せです。心から皆様に感謝してます。

小さな会社のマーケティングとは