BizVektorのアイキャッチ画像のサイズを設定する
BizVektorをお使いの方はご存じのように投稿を一覧表示するときにアイキャッチ画像も表示することができます。 投稿一覧に付いてくるアイキャッチ画像 もう少し大きく表示したいと思った方のために、表示サイズを設定する方法を紹介します。 BizVektorのアイキャッチ画像とは...
View ArticleBizVektorの投稿をグリッド表示できる「Grid Unit」プラグイン
BizVektorの初期設定では投稿やお知らせはタイトル・抜粋・アイキャッチ画像という構成で上から下に一覧表示されますが、Grid Unitプラグイン(有料)を使うとグリッド表示(タイルを並べたようなレイアウト)することができます。 BizVektorでも投稿のグリッド表示が可能です Grid...
View ArticleBizVektor 1.7にアップデートしたらレイアウトが崩れたとき
BizVektorのバージョン1.7ではCSS関連で大きな変更がありました。子テーマを使ってカスタマイズしていた場合、旧バージョンからアップデートするとレイアウトが崩れる場合があります。 原因は、テンプレートファイル(index.php、single.php、page.phpなど)の「id="content"」の部分です。 <div id="content">...
View ArticleBizVektor+WordPress Related Postsでスマホの関連記事タイトルが消える
BizVektorでWordpress Related Postsプラグインを使うとスマホで表示した関連記事のタイトルが消えてしまう場合があるので、対策を紹介します。 そもそもBizVektor自体で関連記事を表示できるので気づいた方は少ないかもしれませんが、他のテーマでも同じことがあるかもしれないので紹介しておきます。 WordPress Related...
View ArticleBizVektorとAll in One SEO Packでmetaタグが重複する
BizVektorではAll in One SEO Packプラグインを使うことは推奨されていません。大きな理由はmetaタグ(meta description・meta keywords)が重複することです。 meta descriptionとmeta keywordsが重複する 対処は簡単で、All in One SEO...
View ArticleBizVektorのグローバルメニューのフォントサイズを変更する
BizVektorのグローバルメニューのフォントサイズを変更する方法を紹介します。現在は次のようなイメージです。 BizVektorのグローバルメニュー 以下、メニュー全体のフォントサイズを設定する方法や個別のメニュー項目だけ微調整する方法を紹介します。 グローバルメニュー全体の文字サイズを大きく...
View ArticleBizVektorのフッターに背景画像を表示する
BizVektorのフッターに背景画像を入れる方法を紹介します。次のような感じに仕上げることができます。検証したバージョンはBizVektor 1.7.8/Defaultデザインスキンです。 BizVektorのフッターに背景画像を入れたイメージ ふわっと仕上げなので、アイデア次第でカスタマイズしたり違和感のある部分は微調整してください。Defaultデザインスキン以外では、おそらく調整が必要です。...
View ArticleBizVektorのフッターのコピーライトを削除する
「BizVektorのフッターからコピーライトを削除したい」は、BizVektorのカスタマイズでも人気上位の要件です。 BizVektorのコピーライトを削除したい さっそくこの記事で方法を紹介しようと思いましたが、やめておきます。 なぜなら、コピーライトを削除するプラグイン「BizVektor...
View ArticleBizVektorに標準装備されたFont Awesomeを使ってあちこちにアイコンを表示する
WordPressのサイト制作時に「グローバルメニューにアイコンを付けたい」とか、「サイドバーにアイコンを入れたい」という要望をよく聞きます。そこでBizVektorを例にヘッダーや電話番号、3PRエリア、サイドバーなどにアイコンを入れる例を紹介します。 BizVektorではバージョン1.7からアイコンフォント「Font...
View ArticleBizVektorのグローバルメニューとヘッダー画像の位置を入れ替える
BizVektorではデザインスキンを何パターンか選べますが、グローバルメニューとヘッダー画像を入れ替えてみるとさらにデザインパターンが増えたような感じがしてワクワクするのは私だけでしょうか? 「グローバルメニューとヘッダー画像の入れ替え」と聞くとheader.phpの編集が必要に思えるかもしれませんが、ここでは、PHPを変更せずにCSSを使って実現する方法を紹介します。...
View ArticleBizVektor NEATで「グローバルメニューのアイコンだけ」色を変更したいとき
BizVektor NEATでグローバルメニューのアイコンの色を変更する方法を紹介します。メニューで設定できる「キーカラー」はアイコンだけでなくサイト全体に反映されてしまうため、工夫が必要です。気になる方は参考にしてください。 BizVektor NEATでグローバルメニューのアイコン色だけを変更する BizVektor NEATのアイコンの色はサイトのキーカラーと共通...
View ArticleBizVektorのヘッダー画像の上にリンクボタンやバナーを重ねて表示する
BizVektorのヘッダー画像の上に別の画像を重ねて表示する方法を紹介します。「申し込みはこちら」や「こちらからクーポンをGet」のようなボタンやバナー画像を表示するのが定番の活用例です。たとえば、こんな感じです。 BizVektorのヘッダー画像の上にバナーを表示する BizVektorの特徴的なヘッダー画像を活かしてトップページに機能性を持たせたりユーザーの導線を作るのに役立ちます。...
View ArticleBizVektor Global Editionで子テーマのインストールに失敗するとき
BizVektor Global EditionにBizVektorの子テーマのサンプルでダウンロードした子テーマのたたき台をインストールすると、次のようにエラーメッセージが表示されるかもしれません。 BizVektorの子テーマのインストールでエラーになる これはBizVektor Global Editionのフォルダ名が子テーマの指定と異なるためです。 子テーマの指定 ---...
View ArticleBizVektor Vastのグローバルメニューを透過させる
BizVektorの拡張デザインスキン「BizVektor Vast」は画面最上部に表示されるグローバルメニューが特徴的です。 BizVektor Vastのグローバルメニュー このグローバルメニューを透過(半透明に)したり、スクロール時に色を変える方法を紹介します。サンプルサイトはこちらです。 谷根千散歩.com 通常のグローバルメニューの色 BizVektor...
View ArticleBizVektor Grid Unitのカスタマイズ(4列・抜粋表示・画像サイズ変更)
BizVektorで記事をグリッド表示できる拡張プラグイン「BizVektor Grid Unit」をカスタマイズする例を紹介します。たとえば、3列構成を4列に変更したり、記事の抜粋を表示したり、画像サイズを変更する方法などです。 BizVektor Grid Unitのカスタマイズ例(4列表示・抜粋追加・画像サイズ変更) サンプルサイトはこちらです。 谷根千散歩.com まだBizVektor...
View ArticleBizVektorの「連絡先」をウィジェットで変更可能にする
「BizVektorで画面右上の連絡先を画像に変更する」 BizVektorに親しんだ方にはおなじみのカスタマイズです。 BizVektorの画面右上の連絡先に画像を表示する ヘッダーの電話番号周りのカスタマイズ方法にあるコードを子テーマのfunctions.phpに入力すれば連絡先に好きな画像や文章を表示することができます。 それで良ければ話は終わりです。...
View Articleフローティングメニューにスムーズスクロールの「上に戻る」を追加する
BizVektorで作成するスマホサイトのフッターにフローティングメニューを作るときに、右端は「上に戻る」ボタンにしたい場合があります。 スマホのフローティングメニュー(右端が「上に戻る」) アイコンを使ったフローティングメニューの作り方は以下のページも参考にしてください。 フローティングメニューをフッターに表示する...
View Article幅広い業種で使えるおすすめのデザインスキン「BizVektor Attract」
BizVektorの拡張デザインスキン「BizVektor Attract」は画面幅いっぱいに広がるヘッダー画像が特徴的です。その他、フッターなどの色を細かく設定できたり、ページタイトルに背景画像を表示できるなど、無料版のBizVektorにはない機能が組み込まれています。 BizVektor Attractの画面イメージ BizVektor Attractの購入はこちらから 普通の企業サイトにも...
View ArticleBizVektor+インスペクタによるCSSカスタマイズ入門
WordPressに慣れてくると気づくのが「CSSを使えば自由にデザインをカスタマイズできる」ということです。たとえば、「グローバルメニューを画像に置き換えたい」も、CSSをカスタマイズして実現することができます。 メニュー項目の画像置き換えもCSSカスタマイズで可能 CSSカスタマイズの手法はさまざまですが、テーマのstyle.cssを開いて修正する方法は効率的ではありません。...
View Article「BizVektorの3PRエリアの数を増やしたい」の解決策
BizVektorのトップページで使える「3PRエリア」は自由な内容を3つの列に並べられるので非常に便利です。便利すぎて、「3PRエリアをもっと増やせませんか?」というご相談を多くいただきます。たとえば、4PRエリアや6PRエリアを作りたい方が多いようです。...
View Article