Pique

最終更新日:2016-05-13

pique-responsive.png

テーマの解説 Pique Theme — WordPress Themes for Blogs at WordPress.com
デモ Pique | A one-page scrolling theme for small businesses
更新情報
レンタルサーバ等にインストールして使うタイプの WordPress 用テーマの解説等 テーマの検索機能よりダウンロードすることができます。 

2016-05-13 at 14.25.png

テーマの制作者 Automattic

テーマ「Pique」の背景/特徴

カスタマイズ →  テーマオプション」より、

2015-12-20 at 18.57.jpg

1ページサイトを作成することができます。

2015-12-20 at 19.01.jpg

iPhone 等にも対応しているレスポンシブデザイン設計のテーマです。

2015-12-20 at 18.55.jpg

外観設定のバリエーション

4つのウィジェットエリアがあります。

2つのメニューエリアがあります。

このうち、フッター部の方はソーシャルアイコンを設置することもできます。

2015-12-20 at 19.09.jpg

なお、1ページサイトの場合は、「カスタマイズ → テーマオプション →  メニュー設定」のところで、各分割ページに対応したメニューに切り替えることができます。

2015-12-20 at 19.11.jpg

ロゴ画像を追加することができます。

2015-12-20 at 19.13.jpg

ヘッダー画像を追加することができます。

2015-12-20 at 19.15.jpg

背景を変更することができます。

2015-12-20 at 19.24.jpg

記事設定のバリエーション

テンプレート

4つのテンプレートが準備されています。

投稿フォーマット

10個の投稿フォーマットが準備されています。

2015-12-20 at 19.30.jpg

アイキャッチ画像

記事にアイキャッチ画像を設定すると、アーカイブ表示等のときにアイキャッチ画像が以下のような感じで表示されます。

なお、アップロードする画像のサイズが小さいと以下のような感じになるので、幅1400px × 高さ 1000px 以上を推奨しているようです。

2015-12-20 at 19.16.jpg

テーマ固有のタグ

アイコン
<i class="fa fa-phone"></i>
<i class="fa fa-location-arrow"></i>
<i class="fa fa-calendar"></i>
<i class="fa fa-envelope-o"></i>
<i class="fa fa-facebook-official"></i>

<i class="fa fa-camera"></i>

comemoarrow

2015-12-20 at 19.42.jpg

その他、以下のページで紹介されている各種アイコンを使うことができます。

2015-12-20 at 19.49.jpg

ボタン
<a class="button" href="#">Learn more</a><a class="minimal button" href="#">Try it out</a>

comemoarrow

2015-12-20 at 19.42.jpg

ボックス
<div class="overlay alignright">本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文 本文</div>

comemoarrow

2015-12-20 at 19.43.jpg

例えば、こんな感じで使われます。

2015-12-20 at 19.46.jpg

その他のカスタマイズ(色等)・CSS 編集のバリエーション

カスタマイズ:色

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。