ビジネスサイト制作教室

ビジネスサイト制作教室 ホームページ作成のアドバイスをさせていただきます。

先日、当教室で開発したワードプレステーマ「simpler」を使って、ビジネスサイトを制作中の生徒さんから、こんな質問を受けました。(すみませんsimplerのPRもしたかったので…) 質問)写真を自動スライドで流して表示したいのですがよいプ...
13/07/2015

先日、当教室で開発したワードプレステーマ「simpler」を使って、ビジネスサイトを制作中の生徒さんから、こんな質問を受けました。(すみませんsimplerのPRもしたかったので…) 質問)写真を自動スライドで流して表示したいのですがよいプラグインはありますか? 回答)ブログや Web サイトで画像を表示するスライダーのことですね。 質問)そうです!自動で画像が横にスライドしていくページです。トップページに使うのではなくて、物件の説明用なので、それぞれの写真の説明文やサムネールも同時に表示させたいのです。 回答)サムネールが必要ならば、とりあえず「マスタースライダー」でしょうかね。 ということで「マスタースライダー」を紹介しましたが、後日インストールしたが、設定項目がすべて英語なので、よくわからないとのことでした。 ということで、ここで簡単に説明しておきます。 画像をあまり使わずに説明しますので、マスタースライダーの設定画面を見ながら読み進んでくださいね。 サムネール付のスライダーができるプラグイン「Master Slider 」 スライダーは各種設定が可能です。 ・画像の自動スライドができます。 ・横幅の長さ調節ができます。 ・サムネイルが表示できます。 ・サムネイルの表示場所が選択できます。 ・画像の説明テキストが表示できます。 ・画像の説明テキストの表示場所が選択できます。 ・Slide duration継続時間(スライドの変移スピード)の設定ができます。 などいろいろと設定できます。 こんなスライダーを作ってみましょう! 最初の設定 まずプラグインを「Master Slider 」で検索して探し、インストールして有効化します。 通常の操作なのでインストール方法は省略します。 ダッシュボードに「Master Slider 」が表示されるのでクリックしさらに「Creiate New Slider」をクリックします。 「Sample Slider」が8つ表示されるので、左上の「Slider With Horizontal Thumnailes」を選択し「Cliate」をクリックします。 すると10枚のサンプル写真が入ったスライダーが自動で作成されます。 サンプルの写真を削除して自分で用意した写真に差し替えます。 下部に表示されているショートコードをスライダーを表示したいページに貼り付けます。 基本はこれで終了ですが、希望のスライダーに仕上げるために、つぎに詳しい設定方法を説明します。 スライダー設定画面 画面上に表示されている項目な中から次の3つのメニューを使います。 ■Slider settings スライダーセッティング スライダーの名前を入力したり、背景色、表示方法を選択する基本設定です。 ■Slids スライド 使用するスライドの選択や修正、説明文の入力を行います。 ■Slider control スライダーコントロール サムネールや説明文(SlideInfo)を設定します。 Slider settings スライダーセッティング 1.一般設定General Settings… [ 106 more words. ]

http://school.b-hp.net/web/%e3%83%9e%e3%82%b9%e3%82%bf%e3%83%bc%e3%82%b9%e3%83%a9%e3%82%a4%e3%83%80%e3%83%bc%e3%81%ae%e4%bd%bf%e3%81%84%e6%96%b9%e3%80%8cmaster-slider-%e3%80%8d/

先日、当教室で開発したワードプレステーマ「simpler」を使って、ビジネスサイトを制作中の生徒さんから、こん…

新開発 http://wp.me/p4mAFk-qp
17/03/2015

新開発 http://wp.me/p4mAFk-qp

Simpler50で使っているテンプレートファイル ブログを使用しているのでファイルが増えました。使用するテンプレートファイルを最小限に絞りました。これだけでも実用的なホームページが出来てしまいます。あとは自分でデザインを変更したり、機能を付け足していけば完成です。 現在の「simpler50」が最も実用的なテーマと考えてください。 [ 43 more words. ]

テーブル作成 http://wp.me/p4mAFk-q7
08/03/2015

テーブル作成 http://wp.me/p4mAFk-q7

テーブル作成のプラグインを試してみました。 JetPackにバンドルされている「Jetpack Markdown」をインストール・有効化して、Wordpressの投稿画面テキストエディタにルールに乗っ取り記入します。

ワードプレスサイトの簡単移設 http://wp.me/p4mAFk-pN
19/02/2015

ワードプレスサイトの簡単移設 http://wp.me/p4mAFk-pN

ワードプレスサイトを丸ごと移設するのも大変なので、管理画面ツールのエクスポート、インポートを使って行う方法を自分メモとしてまとめました。 1.移設元サイトから管理画面ツールのエクスポートで記事データXMLファイルを取り出す。 2.移設先のサイトにワードプレスをインストール 3.使用するテーマをインストール。 4.取り出した記事データをインポートする。  (インポート用のプラグインのインストールが求められる。管理者IDで、チェックする) 5.公開ページを見るとメニュー等の画面崩れが確認できるので以下の調整をする。 6.管理画面「外観」「メニュー」でメニュー位置を確認して保存  (グローバルナビ、フッターナビなど) 7.

[できる100ワザ WordPress http://wp.me/p4mAFk-px
15/02/2015

[できる100ワザ WordPress http://wp.me/p4mAFk-px

「できる100ワザ WordPress必ず集客できる実践・サイト運営術WordPress 4.x対応」 インプレス、2014/12/1 初版発行、1,992円(税込) ワードプレス関連書籍を購入することが多いので、最近手に入れた良書について感想を記してみたいと思います。インプレスからごく最近出版された「できる100ワザWordPress」という本です。第一刷の発効日が2014年12月1日となっています。 これを渋谷の書店で買ったのが発効日と同日だったのにはちょっとビックリでした。(笑) [ 7 more words. ]

できる100ワザ WordPress http://wp.me/p4mAFk-pz
15/02/2015

できる100ワザ WordPress http://wp.me/p4mAFk-pz

「できる100ワザ WordPress必ず集客できる実践・サイト運営術WordPress 4.x対応」 インプレス、2014/12/1 初版発行、1,992円(税込) ワードプレス関連書籍を購入することが多いので、最近手に入れた良書について感想を記してみたいと思います。インプレスからごく最近出版された「できる100ワザWordPress」という本です。第一刷の発効日が2014年12月1日となっています。 これを渋谷の書店で買ったのが発効日と同日だったのにはちょっとビックリでした。(笑) [ 7 more words. ]

さくらサーバーのワードプレス自動インストール http://wp.me/p4mAFk-oL
11/02/2015

さくらサーバーのワードプレス自動インストール http://wp.me/p4mAFk-oL

さくらサーバーのワードプレス自動インストールはフォルダ設定で少し癖があり、躓く方の多いので簡単にまとめてみました。 条件としてはすでに独自ドメインを取得していて、新たにさくらサーバーを契約してそこにサブドメインを作成し、wordpressをインストールするまでの作業をまとめてみたいと思います。 お忙しい方のために、以下の流れを短くまとめました! 特に赤字表示は、他のサーバーと異なる留意事項です。自分でもよく忘れるので覚えておこう。 設定の条件と流れ ・独自ドメインは既に持っているとします。(ムームードメインなどで取得済み、取得方法の説明は省略) ・さくらサーバーをとりあえず契約(お試し期間2週間) ・独自ドメインを設定 ・サブドメインを設定 ・wordpressをクイックインストール ・ブログを作成 さくらサーバの契約 さくらサーバーのサイトにアクセスして「スタンダードプラン」500円/月を「2週間の無料お試し」をクリックします。初期ドメイン名を入力してメールアドレスや住所氏名などを入力します。 30分~1時間で自動的に「契約者情報」がメールで送られてくるので、さくらの管理画面にログインします。 「ドメイン設定」を見ると最初に登録した初期ドメインが登録されているのが分かります。 ネームサーバーを設定 ドメインを取得した業者(ムームードメインなど)のサイトを立ち上げ、管理画面からネームサーバーを上記のように設定します。 ムームードメインの場合は、ドメイン一覧から選択しネームサーバーを次のように設定変更をします。 プライマリネームサーバ ns1.dns.ne.jp セカンダリネームサーバ ns2.dns.ne.jp 独自ドメインでの設定 さくらサーバーの管理画面から「ドメイン設定」の「新しいドメインの追加」から「5. 他社で取得したドメインを移管せずに使う」「ドメインの追加へ進む」をクリックします。 取得済みの独自ドメイン名を入力し「送信する」をクリックします。 ここで大事なのはフォルダ欄は空欄にしておくことです。指定してしまうとあとが面倒です! さくらの管理画面のドメイン一覧をみると、新しく設定した独自ドメインが登録されています。フォルダを指定してないことを確認。 注意!さくらサーバーではフォルダを指定しても自動的にフォルダは作成されません。ワードプレスをインストールするときにフォルダを作成します。 ここではまだ、ドメイン名をクリックしてもまだWebに反映されていないのでエラーになると思います。通常は1時間くらいかかると思います。 サブドメインでの設定 今回はいくつかワードプレスサイトを作成するので複数のドメインが必要です。このためサブドメインを作成しました。 サブドメインとはhgehoge.tokyo に対してtest.hogehoge.tokyoなどを追加して作るということです。 ここでも同様に「ドメイン設定」の「新しいドメインの追加」から設定します。 「他社で取得された独自ドメインのサブドメインを追加」にサブドメイン名とメインのドメイン名を入力し送信するをクリックします。 マルチドメインは20個まで設定できます。 データベースの設定 ワードプレスをインストールするには「クイックインストール」から「ブログ」「wordpress」を選択します。 まだデータベースを作っていないと「MySQL バージョン 5.0 以上 事前にデータベースを作成する必要があります」というメッセージが表示されます。 なので最初の管理画面に戻り「データベースの設定」で作りましょう。 「データベースの新規作成」から入力します。データーベース名と接続用パスワードは自由に設定できます。 データベース文字コードは「UTF-8」を入力します。 入力が終わったら「データベースを作成する」をクリックします。新規作成したデータベースが一覧に表示されます。 複数作る場合は続けて設定します。20個まで作成できます。つまりワードプレスサイトが20個別々に作れるということですね。 wordpressをクイックインストール いよいよインストールです。こんどはデーターベースが完成したのでインストール項目が表示されます。 まず「ライセンス、インストール規約、注意事項の内容に同意する 」にチェックを入れます。 インストール先は自分で設定したドメインの一覧から選択します。 フォルダにはwpを入力します。注意!さくらサーバーは、このフォルダは空欄することができない!!!空欄だと「インストール」をクリックしても何も起こらない??? 使用するデーターベース名を一覧から選ぶ。 データーベースのパスワードを入力する。 テーブルの接頭語はそのままでOKです。 [ 9 more words. ]

wordpressテーマ「simpler」とは http://wp.me/p4mAFk-oD
07/02/2015

wordpressテーマ「simpler」とは http://wp.me/p4mAFk-oD

simplerについて シンプルで良質のワードプレステーマの提供を目指して活動しています。 また、ワードプレスの学習がしやすいテーマ制作を進めています。 本当に作りたいテーマは自作するのに越したことはありませんが、ハードルが高いと思っていませんか?しかし、HTMLとCSSの簡単な知識があれば自作のテーマ作成は可能です。 一歩一歩確実に手順を踏んで、具体的な制作事例を使いながら学習すればそんなに難しいものではありません。 ぜひ自分のテーマつくりに挑戦してください! ワードプレステーマ「simpler」について このテーマはなるべくシンプルで分かりやすくワードプレスを学習するために作りました。 ワードプレスのテーマを自作する学習に役立ち、しかも美しいデザインで実用的なブログのテーマです。(自画自賛ですみません…) テーマ「simpler」についてはご連絡いただければ無料で配布いたします。 ※ページテンプレートが切り替え可能な「simpler51」も用意しています。 ※ビジネスサイトのテーマ「simpler20」は現在準備中です。 使っているテンプレートファイル 使用するテンプレートファイルを最小限に絞り9個になりました。もっと減らすこともできますが、逆に変にまとめすぎると学習しにくくなりそうですのでこれぐらいがいいですね。 ページ関係 1.index.php   共通 アイキャッチ画像50pxの右にテキストを配置 (カテゴリー、アーカイブなど該当ページがない場合に使用する) 2.home.php    トップページ アイキャッチ画像150pxの右にテキストを配置 (index.phpとほぼ同じ内容なので省略できる) 3.single.php   単一投稿ページ アイキャッチ画像30pxの下にテキストを配置 4.page.php   固定ページ アイキャッチ画像は表示なし フレーム構成関係 5.header.php   ヘッダー 6.sidebar.php   サイドバー 7.footer.php    フッター その他 8.functions.php  ファンクションズ テーマのための関数 9.404.php    404エラーページ CSSファイルについて なるべくシンプルなstyle.cssにしてみました。 全体の行数を400行以内に収めました。公式サイトのように何千行というCSSファイルにはうんざりしますよね。 ここではコメントにしっかりと説明をつけて使いやすいように仕上げました。 プラグインについて テーマ「simpler」はなるべくプラグインを使わないで動作するようにしましたが、以下はインストールしてください。 1.デフォルトプラグイン「WP Multibyte Patch」 は有効にします。 本家版、日本語版 WordPress のマルチバイト文字の取り扱いに関する不具合の累積的修正と強化を行うプラグインです。 2.あったほうがいいプラグイン「WP-PageNavi」 記事が多数増えてきた場合ページネーション(ページナビ)が必要です。

ビジネスサイトに最適 BizVektor http://wp.me/p4mAFk-oB
07/02/2015

ビジネスサイトに最適 BizVektor http://wp.me/p4mAFk-oB

ビジネスサイトとして優れているテーマBizVektor BizVektorは、名古屋のホームページ制作会社、株式会社ベクトルさんが提供されているWordPressテーマ。お店などの企業サイトをWordPressで作成したいという場合も便利です。 100%GPLライセンスで無償&商用利用できます。 ともかくビジネス用には最適です。 テスト的にwordpress4.0で使い心地を試してみたのですが、結論を言うと「使える!」ということですね。 最近は更新が頻繁なので最新版をチェック 最新版は2014.9.17に関連記事表示や広告一括挿入など、ブログも捗るWordPressテーマ BizVektor 1.1.1 を公開しました。 管理画面より更新する場合は、古いBizVektorを削除してから最新版のBizVektorをアップロード有効化します。 ダウンロード先  完成度が高いテーマ 何が優れているかというと、WordPressは、本体やテーマをインストール、管理画面の各種設定をしても、そこから実際に使える見映えあるサイトにするまでがかなり骨の折れる作業なのですが、BizVektorを使うと、その作業がほとんど必要なくなります。 日本語フォントに最適化されたデザイン その理由は、やはり日本のホームページ制作会社さんが作っているWordPressテーマなので、日本語フォントに最適化されたデザインになっていて、海外のWordPressテーマのように、日本語フォントの問題に関連した修正を行なわなくてもすむというのがあります。 テーマにビジネスサイトに適した仕組みが施されている また、テーマそのものに、スマホ対応のレスポンシブデザインやイメージ画像のスライドショー、パンくずリスト、ソーシャルボタンなど、ビジネスサイトに適した施策がすでにいくつも組み込まれているので、プラグインをあれこれとインストールする必要がなくなり、必要最小限でよくなります。テーマのデザインも製品レベルなので、ユーザーがスタイルシートで修正する必要もほとんどないといっていいと思います。 管理画面で設定を行えば速攻で使える つまり、WordPress本体にBizVektorをインストールして、管理画面の設定を行えば、もうほとんど、速攻で使えるWordPressサイトの骨格ができあがってしまいます。 あとは、ユーザーがコンテンツの充実に力を注ぐことだけ。 WordPressサイト構築のために費やしてきた時間と労力は、最小限で済みます。 使い方はフォーラムで質問できる 分からないことはBizVektorのサイトでまずは調べてみましょう。 公式サイトにはたくさんの情報が書いてあります。まずは、設定ガイドやよくある質問を調べてみましょう。 フォーラムでは過去の質問と答えを閲覧できます。似たような質問をした人がいないかどうか検索することもできます。 デザインのバリエーションが豊富 デザインも豊富でデフォルトでたくさんのテーマバリエーションが用意されています。 初期状態では 「Rebuild」「Default」「Calmly」「プレーン」という4種類のデザインスキンを選択する事が出来ます。デザインスキンはプラグインとして扱います。 スキン名,デザイン,内容 Rebuild, 新バージョンのスキン,メニューがシンプルで好感が持てる。ヘッダーの連絡先が表示しない。 Default, 当初のスキン,配色が赤でややきつめ、キーカラーを変更すれば落ち着く。 Calmly,多機能のスキン,標準的でデザインも落ち着いている。使いやすい。 プレーン,シンプルなスキン,メニューのバックグラウンドなどが平坦でシンプル。 また「Calmly Plus」「WCT2012 SP1」「WCT2012 SP2」 などのプラグインをインストールすると、さらにテーマバリエーションを増やせます。 またテーマのカスタマイズから「キーカラー」を設定すれば、テーマの基調カラーを別の色に変更することも簡単にできます。 拡張デザインスキン一覧(無料) スキン名,デザイン,内容 calmlyplus, 拡張デザインスキン,BizVektor新デフォルトテーマ「Calmly」の拡張デザインスキン「Calmly Brace」「Calmly Flat」「Calmly Brace & Flat」を追加する為のプラグインです。 WCT2012 SP1, 拡張デザインスキン WCT2012 SP1,BizVektorのデザインを拡張する為のテーマです。WordCampTokyo2012のサイトを『インスパイア』したデザインとなっています。 WCT2012 SP2,無料拡張デザインスキン ,BizVektorのデザインを拡張する為のテーマです。WordCampTokyo2012 SP1 の派生デザインバージョンです。 [ 57 more words. ]

wordpressのテーマ「compasso」 http://wp.me/p4mAFk-od
05/02/2015

wordpressのテーマ「compasso」 http://wp.me/p4mAFk-od

ワードプレステーマのご紹介です。このテーマは海外で制作されたもので有料ですが、使い勝手がよさそうなので購入してみました。円安の折ちょっと出費が気になりますが約$50です。まあ、これだけの機能があるならば安価だと思います。本家のマニュアル参考にしましたが、なるべくわかりやすいように作成してみました。 テーマの特長は「Masonry Magazine Theme」だそうですが、なんと訳すのでしょうか。石造建築(石積み)風マガジンテーマでしょうか。 試作サイトはこちらです。 1.テーマの購入方法 販売先は Envato Pty Ltd.というニュージーランドの会社です。 Compasso - Masonry Magazine Theme 「purchase」をクリックして購入ができます。PayPal使用時のメールアドレスだけで会員登録などは不要です。 支払確認ができるとすぐにメールが送られてくるので、指定されたサイトからコンパッソテーマのzip形式のパッケージをダウンロードします。 2.インストール コンパッソテーマはもちろんテーマ一覧にはありません。インストールするためには、まずダウンロードしたzip形式のパッケージを解凍します。抽出されたパッケージでは、ワードプレスのテーマである「コンパッソ」フォルダがあります。 このコンパッソフォルダをそのままワードプレスのコンテンツ/テーマフォルダにFTP等でアップロードします。 そしてWordPressの管理パネルにログインし、外観⇒テーマに移動します。テーマを有効にします。 3.固定ページの作成(以下ページ) 新しいページを作成するには、管理画面から「新規作成」をクリックします。 コンパッソの[新しいページ]画面は次のようになります。 ページのタイトルを入力してください。 ページのコンテンツを入力してください。 ページ属性は以下の種類があります。 子ページとしてこのページを使用する場合は、親ページを選択します。 ページ・テンプレートを選択できます。 (このテーマは、いくつかの異なるページテンプレートが付属しています) 1.default, デフォルト、 2.Categories,  カテゴリ、 3.Categories Masonry, カテゴリ石積み、 4.Contact Form,  お問い合わせフォーム、 5.Grid,  グリッド、 6.List, リスト、 7.Masonry,  石積み、 8.Sitemap, サイトマップ コンテンツエディタの下には、カスタムメタボックスがあります。レイアウトオプションとSEOオプション:デフォルト・ページには、2カスタムメタボックスを持っています。 レイアウトオプション: 右側のサイドバー、左のサイドバー、全幅またはデフォルト:ページレイアウトを選択します。デフォルトを選択した場合、それは一般的な≫テーマオプションでデフォルトのレイアウト設定を使用します デフォルトのサイドバーまたはカスタムサイドバー(テーマオプション≫サイドバーから生成):サイドバーを選択します。 SEOのオプション: このページのメタ説明を入力します。 このページのメタキーワードを入力し、カンマで区切って指定します。 あなたが検索エンジンによってインデックスこのページをしたくない場合NOINDEXを確認してください。 ページ・テンプレートを変更すると、追加のカスタムメタボックスが表示されることがあり、ページの種類によって異なります。あなたはサイトマップのテンプレートを選択した場合、それはマップのオプションを持つことになります。(各ページテンプレートでの)この後ののより。 完了したら、ページを保存するボタンを「公開」をクリックします。 (1)固定ページ・テンプレート:デフォルト デフォルトのページには、特別なフォーマットなしで通常のページです。これは、標準的なタイトルと内容が表示されます。 [ 68 more words. ]

Facebookの「いいね!ボックス」と「いいね!ボタン」の設置 http://wp.me/p4mAFk-nR
31/01/2015

Facebookの「いいね!ボックス」と「いいね!ボタン」の設置 http://wp.me/p4mAFk-nR

Facebookの「いいね!ボックス」(Likebox)と「いいね!ボタン」(Like button)について説明します。 また、「いいね!」と「シェア」の違いなどについても確認しておきます。 どうだと目的が異なりややこしいので自分のメモ代わりにまとめてみました。 WordPressではプラグイン(WP Social Bookmarking Lightなど)をインストールすれば、初心者でも簡単にFacebookやtwitterなどのソーシャルボタンを設置することができますが、ここではプラグインを使わないFacebookに限った設定方法を紹介します。 「いいね!」とは Facebookの記事内容に「良い!」「共感した!」という意思表示をするのが、「いいね!」ボタンです。 「いいね!」を付けてもそれ自体では書いた相手に分かるだけで拡散はしません。つまり誰かの記事に「いいね!」を付けても、自分の友達などには伝わりませんし、記事のアクセスが増えるわけでもありません。 ブログに「いいね!」ボタンを設置する場合は、少し目的が異なります。ブログ記事に設置している「いいね!」ボタンが押されている数が多ければ多いほど、ブログコンテンツをソーシャルメディアによって拡散させられるので沢山のアクセスが集まります。 「シェア」とは Facebookのシェアとは共有という意味なので、他人と共有する、他人に知らせるのが目的です。 リンクや画像付きの情報で「この内容を自分の知り合いにも広めたい」場合に使用するのが、「シェア」ボタンです。自分のコメントを付けて、友達に情報を送ることができます。シェアできるのは、あくまでもFacebook外部の情報です。どこかのウェブサイトのリンクとか写真とか動画などです。単なる近況の書き込みなどの投稿はシェアされません。 WordPress に「いいね!ボタン」を設置 ブログにFacebookの「いいね!」ボタンを設置するのは、ブログコンテンツをソーシャルメディアによって拡散させることです。 LikeBox を設置するには、まず、生成ページ にアクセスします。 いいねをするページのURLを入力。(URL to Like:「いいね!」ボタンを設定したいブログ記事のURL)また、横幅などを入力し「GetCode」を押すとiframeのコードが出てくるので、これをページまたはウィジェット内に貼り付けます。また、全ページに表示させたい場合はWordPressのテーマ内、任意の場所に貼付けます。 WordPress に「いいね!ボックス」を設置 ブログに Like Box を設置する目的は「Facebookページ」のファンを獲得し、自分のビジネスに対するファンを増やすことです。 LikeBox を設置するには、まず、Facebook Developers にアクセスします。 自分の「Facebookページ」のURLを入力します。(page URL)また、横幅などを入力し「GetCode」を押すとiframeのコードが出てくるので、これをページまたはウィジェット内に貼り付けます。

インディアンターコイズ http://wp.me/p4mAFk-nF
28/01/2015

インディアンターコイズ http://wp.me/p4mAFk-nF

インディアンターコイズのペンダントトップを扱っています。 BASEで販売していますので、よかったらのぞいてみてください。

住所

野沢
Setagaya-ku, Tokyo
1540003

営業時間

月曜日 10:00 - 18:00
火曜日 10:00 - 18:00
水曜日 10:00 - 18:00
木曜日 10:00 - 18:00
金曜日 10:00 - 18:00
土曜日 10:00 - 18:00
日曜日 10:00 - 18:00

電話番号

03-6450-8901

ウェブサイト

アラート

ビジネスサイト制作教室がニュースとプロモを投稿した時に最初に知って当社にメールを送信する最初の人になりましょう。あなたのメールアドレスはその他の目的には使用されず、いつでもサブスクリプションを解除することができます。

共有する