toggle
2017-06-10

WordPress人気テーマ【Sydney】の簡単カスタマイズ方法とは?

MacBookと手帳

 

WordPressのテーマの「Sydney」って、オシャレでいい感じっすよね。コーポレートサイトでもブログでも、かなりスタイリッシュにサイトをデザインしてくれる日本でも海外でも人気の超優秀なテーマっす。

 

このサイトも、その「Sydney」を使ってデザインしてるんですけど、カスタマイズしたくても、他のサイトの解説とか英語ばっかりで「何言うてんねん」てなりません?笑

 

しかも、俺自身「素人同然」のレベルで、なんとかググりながらサイトを作ってるんですけど、意外とこの「Sydney」の事を詳しく書いてる日本語のサイトが無いんすよね。。。泣

 

うおーぃ!!

シィドニィィィー!!!!

 

って部屋で一人何度発狂した事か。。

まぁそんなこんなで、完成したのがこのサイトっす。

 

なんとか根性出して、Google翻訳と共に1つ1つクリアしていったんすよ。アタシ。孤独な戦いやったな。。竜王強かったな。。。(しみじみ)

 

そんな自分が、どんな感じでクリアしていったのかを、これからWordpressのテーマで「Sydney」を選択しようとしてる人の為に話していきたいと思う。

 

 

※今回は「Sydney」のカスタマイズの方法がメインなので、「子テーマ」や「ナビゲーションメニューの作り方」などの「Sydney」以外の設定は、過去の記事「WordPress童貞がWEBサイトを完成させるまで」を参考にしてください。

 

まずは推奨プラグインをインストール

テーマで「Sydney」をインストールしたら、まず最初にテーマ側がオススメしている「推奨プラグイン」をインストールしよう。

 

そのプラグインが

Page Builder by SiteOrigin

SiteOrigin widget bundle

Sydney toolbox

という3つのプラグインっす。

 

何かややこしそうな、この3つのプラグイン。ぶっちゃけ何するモノなんかって言うたら「WEBサイトのページをカスタマイズする為のプラグイン」って感じの認識でOKっす。

 

まぁここは普通にインストールして有効にしちゃって下さい。

 

ページをカスタマイズしてみよう

インストールし、それぞれプラグインを「有効」にしたら、任意のページへ移動しカスタマイズを始めていこう。

 

今回は、トップページのカスタマイズを例に話を進めていきたい。

 

カスタマイズする場所まで移動

<主な手順>

 「ダッシュボード」→「サイトを表示」をクリック。

 「サイトを表示」したら、トップページの画面一番上の「Wordpressのメニュー欄」の「固定ページを編集」をクリック。(他のページをカスタマイズする場合は、任意のページへ移動し「固定ページを編集」をクリック。)

 このページを使って、カスタマイズしていきます。

 

さてさて、、ここからが本番の戦いでっせ。

 

まずは、タイトル記入欄の下にある、
ビジュアル選択欄の「ページビルダー」をクリックする。

 

 

ページビルダーを開き、主にどこを使ってカスタマイズするのかと言ったら、本来なら「文章を書く欄」に「ウィジェットを追加」「列を追加」「Layouts」などのツールボタンがあると思う。こいつを使ってカスタマイズしていく。

 

で。主に使うツールは、一番左上の部分にある「ウィジェットを追加」と「列を追加」の2つ。それ以外は、普通にカスタマイズする上では必要ないはず。(少なくとも俺の場合はそうでした。)

 

カスタマイズしてみよう

カスタマイズする手順はめちゃくちゃ簡単。

 

 

まずは「列を追加」のボタンをクリックする。

その時に「カラム」などの設定があるので、お好みの設定で決定する。

(上画像では、1カラムで設定し、それ以外は初期設定のまま。)

 

もっと細かい設定をしたければ、「列」の青の欄の右上の「レンチマーク」をクリックして、独自にカスタマイズできる。

 

 

その「列」をクリックした後に「ウィジェットの追加」のボタンを押し、必要なウィジェットを選んでカスタマイズするのが基本的な流れっす。

 

例えば「カレンダー」を入れたければ、ウィジェットで「カレンダー」を選択すれば、任意のページに「カレンダー」を載せることができる。こんな感じで簡単にカスタマイズする事ができるんです。

 

基本的な流れはこんな感じです。

 

Sydneyオリジナルのウィジェットを入れてみよう

さてさて。

 

基本的な「列」と「ウィジェット」の使い方が分かれば、次はSydneyオリジナルのウィジェットを入れていこう。

 

今回は、自分のトップページにもある「SERVICE」のウィジェットを例にカスタマイズしていきたいと思う。

 

この「SERVICE」の欄を設定する時に、自分が思いっきり勘違いしてたのが、「固定ページ」で作った「Service」のページじゃないって事。

 

このウィジェットを設定する為には、Wordpressのメニューバーにある「Services」を設定する必要がある。

 

その手順は簡単。

 

「ダッシュボード」→「Services」→「Add New Service」をクリックすれば、設定する事ができる。

 

実はたったコレだけなんす。笑

 

詳しく説明していきます。

 

 

このページのタイトルの部分に、自分の提供できるサービス名を記入し、トップページの「SERVICE」のアイコンの下に説明が必要ならば、下の説明欄にその内容を記入する。(ちなみに、俺は入れていない。)

 

 

で。アイコンの設定は、まずは上の画像の「here」をクリック。

 

 

アイコンを選択するサイトまで飛んだら、好みのアイコンの名前をコピペして、「Service Icon」記入欄にコピペして記入するだけ。

 

これで「サービス名」「説明」「アイコン」の設定は完了。

 

この手順でサービス1つ1つを設定していく。

自分の場合は、これが合計3つあるって事っす。

 

その工程が全て終われば、最初に追加した「列」に「シドニーフロントページ:サービスタイプ」を追加すれば完了。

 

他の「Sydney」専用ウィジェットの大半も、内容は違えど似たようなプロセスで設定する事ができるので、是非トライしてみて欲しい。もし、分からない所があれば、Google翻訳片手に「Sydneyサポートリンクまで行く事をオススメする。俺はそこで謎を解明しとります。笑

 

合わせて、この「ドキュメンテーション」も参考に。

この記事でも書いたような基礎的な事はここに書いてある。

俺は最初ここを参考にしました。

 





関連記事