俺流WordPress攻略法の理論編と実践編!!

俺流 WordPress 攻略法
実践WordPress講座
(俺流WP攻略法・実践編)

WordPressサイトの構築方法には、いろいろな方法があると思いますが、筆者なりの一番簡単な方法を「俺流WordPress攻略法」として纏めてみました(上記の左)。
その概略としては、WordPressのインストールから始まってナビゲーションメニュー(グローバルメニューとも呼ばれる)やサイドバー、フッター等のサイト全体の構成が分かるイメージ作りがメインとなります。

その「俺流WordPress攻略法」の具体的な操作手順を、画面イメージ付きで解説した記事が上記の右になります。即ち「俺流WordPress攻略法」が理論編としたら、記事「実践WordPress講座」(上記の右)は、所謂、「俺流WordPress攻略法」の実践編となります。

その「理論編」と「実践編」の2つの記事が、表裏一体となって筆者の制作代行手法・方法を、暴露したノウハウ記事になります。即ち、Elementorでページ編集する制作代行の前段階の処理を明らかにした記事になります。

自分で更新できるWordPressサイトを作って
みませんか?

WordPressのスキルを取得するのなら「ELEMENTOR」の存在は外せません。
ELEMENTORが分かればWordPressのハードルを下げることが可能です。
「もっと手軽に、もっと易しく」を前提に、プラグイン「ELEMENTOR」による
ページ編集に特化した「オンライン個人レッスン付きWordPress塾」が
お薦めする講座となります。

製品納入後の個人レッスンは、ZoomやGoogle Meet等を導入した
オンライン・リモート会議形式で開催し、Elementorの操作方法を
レクチャー致します。

以前の面談形式のレッスンではなくて、ユーザー様と一対一のレッスンですので、
感染症リスクの不安も心配ご無用、安心してWordPressスキルを取得できます。

2種類のアイコンで作る新ポートフォリオです。

藤心のWebアイコンには、大きく分けて2種類のアイコンが存在します。
一つ目は、Webページより自動的にアイコンを作成してくれる「SnapCrab」という画像ソフトで作成できるアイコンです。
もう一つは、「SnapCrab」よりはちょっと難しくなりますが、「簡単バナー」と言う画像ツールで作成するアイコンです。

「SnapCrab」で作るアイコンは、Webページさえできていれば、そのページより自動的に画像アイコンを作成してくれますが、「簡単バナー」ではアイコンの背景色やアイコン上のテキスト文字や文字の位置や文字サイズ等など、全てがユーザーの責任で作成する必要があります。

「簡単バナー」は「SnapCrab」のような自動的にアイコンを作成できない分、「SnapCrab」よりは難しくなります。その分、画像作成の自由度は「SnapCrab」以上にあります。

WPテーマ「Sydney」で作るWP-LP見本を紹介します。

Elementorに存在するフィルタ・ギャラリーと言う素晴らしい機能を紹介します。
下記のボタンの何れかをクリックしても、そのフィルタ・ギャラリーが実装されたページに辿り着くことになります。

そのフィルタ・ギャラリー・ページが見つかりましたら、ページの最下段にある「以下の一覧表が、実際のフィルタ・ギャラリーです。」のすぐ下にあるフィルター「SYDNEYテーマ」をクリックすると、WPテーマ「SYDNEY」で作った見本ページが3サイト見つかる筈です。この一連操作は、前記のフィルタ・ギャラリー・ボタンに共通する操作です。

このフィルタ・ギャラリーのフィルター「SYDNEY」は、WordPressのテーマ「Sydney」を意味しています。要するに筆者が過去n年の間、制作した数多くのWordPressサイトを、WPテーマをキーワードとしてギャラリーを検索する画像ギャラリーとなっています。

藤心のランディングページ(By Sydney)とは?

Sydney/Plumber
Sydney/Shop
Sydney/Photografy

上記の3サイトは、全てWordPressテーマのSydneyで作成した見本ページです。Sydneyには、テーマをインストールした後、初心者用にスターターサイトと言うデモページが沢山用意されています。但し、デモページの殆どが有料版ですが、今回、無料で使える上記の3例を紹介します。

デモサイトの共通するイメージはランディングページ(LP)となっています。LPというと一般的にイラストレーター等で作成したイラスト満載の縦長ページをイメージされますが、筆者の考えるLPは脱イラストのLPを志向しており、今回の見本例が正に脱イラストLPと言えます。

有料・無料に拘わらず、デモページは全て英語版となっていますので、今回の公開では、日本語化にも試みてみました。

将来性、拡張性、10年先にも存在するWordPress

藤心のWordPress塾は、個人レッスン付き制作代行プログラムです。QHM/HAIKは、旧メーカー(北研)が見捨てた絶滅危惧種の古いシステムです。QHM/HAIK⇒WordPressへの移行をご検討中のユーザー様、是非、この機会に当方がお薦めする移行プログラムに便乗してみては如何でしょうか?

製品納入後の個人レッスンは、ZoomやGoogle Meet等を導入したオンライン・リモート会議形式で開催し、Elementorの操作方法をレクチャー致します。以前の面談形式のレッスンではなくて、ユーザー様と一対一のレッスンですので、感染症リスクの不安も心配無用、安心してWordPressスキルを取得できます。

カラム編集で画像を垂直方向に整列

左のサイトは、WordPressテーマ:Astraの初心者用に作られたスターターテンプレート「Online Health Coach」で作成された見本ページです。

そのトップページの最下段の見出し「Happy Faces of Happy Students」にある以降の画像に目が釘ずけになりました。4段の段組での画像表現は、どのように作成したのか?

Elementor操作を教えることに特化した塾です。

e工房フジサキは、WordPressのプラグイン「Elementor」を個人レッスンを通じてレクチャーして行くこと。即ち、「Elementor」の普及活動を、最大で且つ最終目標とした活動を続けて行けたら幸いと考えております。

製品納入後の個人レッスンは、ZoomやGoogle Meet等を導入したオンライン・リモート会議形式で開催し、Elementorの操作方法をレクチャー致します。以前の面談形式のレッスンではなくて、ユーザー様と一対一のレッスンですので、感染症リスクの不安も心配無用、安心してWordPressスキルを取得できます。

フリップ・ボックスとは?

フリップ・ボックスとは、オンマウスすると画像が反転したり、拡大したりするElementorのEssential Addonsの拡張機能です。 画像にオンマウスしてみれば、すぐ分かります。その画像反転も左右で反転するケース、上下で反転するケースといろいる有るみたいです。 機能は分かりましたけど、何に使えるのかイマイチよく分かりません。ただそれだけと言った感じですね。

WordPressの導入をサポートする藤心WordPress塾

藤心WordPress塾は、新しいプラグイン ELEMENTOR によるページ編集を全面的に導入し、WordPress 初心者にも易しく丁寧に WordPress の楽しさと素晴らしさを、レクチャーすることをモットーとして活動しております。

Elementorを使う/使わないの判断基準について

WordPressサイトのページ編集に、「Elementorを使うか否かの判断基準には何があるのか?」と言う質問を受けたことがあります。この質問に回答する前に、WordPressでElementorを使用する場合、以下の前提条件があることを明記しておきます。この前提条件を知らずに使用しているユーザーが意外と多くいます。

  1. Elementorを使うか否かは、各ページ毎にユーザーの自由意志で決められること。
  2. Elementorを使った特定ページのページ編集は、以後、Elementorを使うことを前提としていること。
  3. Elementorを未使用のWordPressページは、ある時からElementorを使用することが可能であること。
  4. 一旦、Elementorを使用したページは、その後も引き続きElementorを使用すること前提としている。
  5. ある時点までElementor未使用のページで、Elementor使用を開始した場合、WordPressページ全体を1セクションとしたElementor領域が設定される。

以上の前提条件があることを踏まえて、前記の質問にお答えします。
筆者の場合のElementor使用の基準は、編集対象ページに段組みを使用するか否かで、そのページをElementor導入ページとするか否かを決めています。

即ち、段組みを設定する必要が生じる場合は、Elementorを導入します。この場合の段組みとは、ページ領域を2段の段組みを設定して、例えばテキスト文書を左側段組み内に設定したり、画像を右側段組み内に設定したりするケースを意味します。

即ち、前記のような段組みを一切使用しないケースでは、Elementorを導入しないページが設定されます。ページによってElementorを使用しているか否かを判断する手順として、ダッシュボードで固定ページ一覧や投稿ページ一覧を見れば、どのページがElementorを使用しているか否かが一目瞭然で直ぐ分かります。

また、一旦、Elementorを使用したページをダッシュボードで見ると、管理メニュー上に「Elementorで編集」というテキストリンクが表示されていると思います。

私も「ELEMENTOR」を使っています。
それも無料で!

WordPressのスキルを取得するのなら「ELEMENTOR」の存在は外せません。
ELEMENTORが分かればWordPressのハードルを下げることが可能です。
「もっと手軽に、もっと易しく」を前提に、プラグイン「ELEMENTOR」による
ページ編集に特化した「オンライン個人レッスン付きWordPress塾」が
お薦めする講座となります。

製品納入後の個人レッスンは、ZoomやGoogle Meet等を導入した
オンライン・リモート会議形式で開催し、Elementorの操作方法を
レクチャー致します。

以前の面談形式のレッスンではなくて、ユーザー様と一対一のレッスンですので、
感染症リスクの不安も心配ご無用、安心してWordPressスキルを取得できます。

カラム(段組)の背景画像

左のサイトは、WordPressテーマ:Astraの初心者用に作られたスターターテンプレート「クリスティーナのメイクアップスタジオ」で作成された見本ページです。

そのトップページのアイキャッチ画像の直下にある以降の画像に目が釘ずけになりました。4人の女性の画像が4列のカラム(段組)で表現されています。

自分で更新できるWordPressサイトを作って
みませんか?

WordPressのスキルを取得するのなら「ELEMENTOR」の存在は外せません。
ELEMENTORが分かればWordPressのハードルを下げることが可能です。
「もっと手軽に、もっと易しく」を前提に、プラグイン「ELEMENTOR」による
ページ編集に特化した「オンライン個人レッスン付きWordPress塾」が
お薦めする講座となります。

製品納入後の個人レッスンは、ZoomやGoogle Meet等を導入した
オンライン・リモート会議形式で開催し、Elementorの操作方法を
レクチャー致します。

以前の面談形式のレッスンではなくて、ユーザー様と一対一のレッスンですので、
感染症リスクの不安も心配ご無用、安心してWordPressスキルを取得できます。

今更、「始めまして」でもないのかも?

(e)工房フジサキの「始めまして」のページは、つい最近作成して公開したページです。 本来なら、(e)工房フジサキを公開した最初の頃に作成公開すべきページだったのですが、 忘れていた訳でもないのですが、ページそのものを作成しておりませんでした。

「始めまして」の内容そのものは、元々、既に作成してあった(e)工房フジサキの「当サイトについて」に 近い内容のページでした。ただ、「当サイトについて」は、(e)工房フジサキの画面遷移に関する 内容が主なテーマで、「始めまして」的な自己紹介的な内容とは、ほど遠い内容でした。

ここは自己紹介に始まり、WordPressに特化し、Elementorを実装した経緯を説明する 「始めまして」的なページを作成する必要性を感じて、このようになりました。

ブログページのトップは「ポスト・グリッド・メニュー」です。

Elementorに存在するポスト・グリッド(Post Grid)と言う素晴らしい機能を紹介します。 下記のボタンの何れかをクリックしても、そのポスト・グリッドが実装されたページに辿り着くことになります。

ポスト・グリッド(Post Grid)とは、ElementorのEssential Addon の中にあるポスト・グリッド(Post Grid)ウジェットを意味する投稿記事や固定ページの一覧表を表示する機能です。そのページ一覧表は、所謂、ブログページが存在するブログサイト等で、その存在価値が発揮されます。

前記の各リンクボタン押下で表示されるページは、下記のブログサイトのトップページになります。即ち、藤心関連のブログサイトの各トップは、ポスト・グリッド形式の記事一覧となっていることが、ご理解頂けると思います。
・Elementorユーザー支援サイト
・e工房フジサキ
・藤心ステーション