2018/01/18

サイト更新はページビルダーで簡単に [1]

ページビルダーの概要

当社にホームページ制作をご依頼のクライアント様には主にWordpressという更新システムを使っていただく事になります。Wordpressは一般のブログのように手軽に記事を書いたり、写真の管理も行えるのですが、標準のままではブログ同様、あまり自由度が高くありません。

 

そこでサイトの更新を行っていただく際には「ページビルダー」というシステム(WordPressのプラグイン)をインストールさせていただいております。ページビルダーを使うと、本格的なサイト更新がさらに簡単に行うことができ、ついつい億劫になりがちな記事の更新を短時間で、しかも見栄えのする形で仕上げる事が可能となります。

 

こちらがページビルダーによる編集画面です。

ブロック(Row - 行)単位で文章や画像を並べていく様子がビジュアル的に分かると思います。

 

行はさらに複数のカラム(Column - 列)に分けることができ、従来のWordpressのエディタでは面倒だった複数の画像を並べる事や、複雑なレイアウトを行う事が可能になります。

ページビルダーで出来ること

ここではページビルダーで作ることが可能な記事のサンプルをご紹介します。まずは見出しから見ていきましょう。

見出しサンプル(フォントサイズ=48 中央)

見出しサンプル(フォントサイズ=32 左揃)

見出しサンプル(フォントサイズ=20 右揃)

キャッチフレーズサンプル(フォントサイズ=20 中央)

見出しキャッチフレーズの違いは、h3タグh4タグの違いのみです。フォントサイズを自由に設定できるので、デザインイン上の違いはありませんが、SEOでは見出しの方が効果が高いです。

ビジュアルエディタによる文章の装飾

こちらは文章のサンプルです。Wordpress標準のビジュアルエディタと組み合わせることによって文字の太さや色を自由に設定できます。他にも下のようにテーブル機能を使った表や、画像の回り込み等も作ることが可能です。

 

要素1
要素2
要素3
要素4

 

他にも下のようなテキスト装飾機能を使えます。

 

リンク

打ち消し

文字サイズ

文字色の変更

 

下のように画像に対するテキストの回り込み表示も可能です。

 

行の左右分割とは違って、回り込みの場合はテキストが画像の高さよりも長い場合は、さらに画像の下に入り込みます。これによって雑誌のような記事になります。

 

回り込みが終わったら、できるだけ書式をクリアして下さい。

回り込みの解除には「TinyMCE Clear Float」プラグインが必須です。

(ページビルダー単体では回り込み解除が出来ません)


 

GoogleMapsを埋め込むことも可能です。

次回はレイアウトのサンプルや便利な機能をご紹介いたします。

このサイトは Internet Explorer 10 以下には対応しておりません

あなたがお使いの Internet Explorer はセキュリティ問題と表示の不具合を多く抱える古いブラウザのため、開発元のMicrosoft社でも移行を勧めております。
WEB閲覧には安全上の問題や、快適性を考慮して、現在主流となっている Google ChromeFirefox または Opera 等の最新ブラウザをご利用ください。
Chromeのダウンロード