テーマVirtue(海外)を使ってみる 第1回目

 
テーマ virtue

 

Virtue
https://wordpress.org/themes/virtue/

今回は WordPressのVirtue(ヴァーチュー)というテーマ(テンプレート)を使っていきます。
第1回目です。
 
Virtueというテーマはとても自由度が高いテーマです。

デザイン的にも自由度が高いと言えます。

また、Virtueには 無料と有料のものがありますが、
今回は無料を使います。
 
スライダー設定やテーマオプション、その他の設定項目もあります。



 

テーマ Virtueのインストール方法

「ダッシュボード」 から 「外観」を選択して、「テーマ」をクリックします。

テーマというページが開きましたら、ページの上側にある、「新規追加」ボタンを押します。

右側に、「テーマを検索」と書いてある部分に Virtue と入力します。
 
Virtueのイメージ画像が表示されます。

Virtueのイメージ画像上にマウスのカーソルをのせると、

画像の下側に 「有効化」と書いてありますので、

そこをクリックします。有効化されました。

これにて、 Virtueが使えるようになりました。

 



 

各 種 設 定 方法

基本的な部分から始めます。

まず、ダッシュボードから

下の方にある 「設定」を選択 「表示設定」を開き

以下のように設定します。

 

フロントページの表示

 

次に、表示ページの続きとして、
以下の項目があります。

 

表示設定の続き

 

以下 説明です。

1ページに表示する最大投稿数

1ページの中に表示する、ブログ(投稿)リンクの表示数です。

 

RSS/Atom フィードでの各投稿の表示

RSS/Atom フィードは
ブログ記事を公開した時に自動的に登録者に通知してくれる機能です、
現在、RSSリーダーがあまり使われていないため、
あまり意味がないかもしれません。

 

検索エンジンでの表示

検索エンジンでの表示ですが、
基本的にホームページの作成時はチェックしておいて、
完成後、チェックを外すのがいいと思います。

 



 

次に、ダッシュボードから「外観」を選択して、Theme Optionsをクリックします。

すると画面が切り替わります。

切り替わった画面には、
左側にメニューが縦に並んでいます。

 

theme options menu

 

 
一番上の「Main Settings」をクリックします。

ここでは、基本的なレイアウト、フッターのカラム数、
ロゴの位置の設定 ロゴ画像をアップロードできます。

正しいものはないので、自由に設定できますが、

sabidomeでは以下のようにしました。

明るい青で囲まれた部分が今回設定したものです。

 

Main Settings

 

以下 説明です。

Site Layout Style

左側は左右全面に、ホームページが表示されます。
右側は 左右に背景画像が表示されるものです。

 

Footer Widget Layout

トップページの下側に画像かアイコン(イラスト)をいくつ表示しますか?
ということです。

 


Logo Layout

・一番左側は、ロゴを画面左側に配置して普通の大きさのロゴを設置する設定です。

・真ん中は、ロゴを画面左側に配置して大きなロゴを設置する設定です。

・右側は、ロゴをページの中心に配置するという設定です。

 

次はLogo(ロゴ)の設定です。

 

Main SettingsのLogoの説明

 

 
Logoの設定ですが、

ロゴを「Uploadボタン」を押してアップロードして下さい。
もし、空欄にした場合は、文字でサイト名が表示されます。
ということです。

 

Upload Your @2x Logo for Retina Screens

ここでは、スマートフォンのRetinaディスプレイでの設定です。

画像のロゴをRetinaディスプレイで見ると解像度が低いのでぼやけた感じになります。
ですので上下左右2倍高くしたロゴを使用して通常通りの見え方にします。

そして、名前を以下の用にして、

○○○@2x.jpg
○○○@2x.png

○○○はなんでもいいのですが、
小文字のアルファベットか数字にします。
「Uploadボタン」を押してアップロードして下さい。

 

Sitename Logo Font

ここでは、Logo(ロゴ)を文字に設定した時の、
文字の種類やサイズ、色の設定となります。

 

Site Tagline – Below Logo
ここでは、ロゴの下に、キャッチフレーズを表示という事です。
必須ではないので書かなくてもいいです。

 

 
最後にLogo Spacingの設定です。

Logo Spacing

 

Logo Spacing
Top Spacing

ロゴの上側のスペース(空間)の高さを設定します。

 

Logo Spacing
Bottom Spacing

ロゴの下側のスペース(空間)の高さをします。

 

Logo Spacing
Top Spacing

ロゴの上側のスペース(空間)の高さを設定します。

 

Logo Spacing
Left Spacing

ロゴの左側のスペース(空間)の長さを設定します。

 

Logo Spacing
Right Spacing

ロゴの右側のスペース(空間)の長さを設定します。

 

Primary Menu Spacing
Top Spacing

右側にあるメニューの上側のスペース(空間)の高さを設定します。

 

Primary Menu Spacing
Bottom Spacing

右側にあるメニューの下側のスペース(空間)の高さを設定します。

 

Sitewide Banner
Upload a banner for bottom of header.

ロゴやメニューの下側のスペースに横長のバナーを設置する
ということです。

必須ではないので設置しなくてもいいと思います。

 

 



 


確認をしたあと、ページの上側と下側にある、「Save Changes」を押します。

保存されました。

これにて、人気テーマVirtue(海外)を使ってみる 第1回目は終了です。

2回目と続きます。

よろしくお願いいたします。