【WordPress】カスタマイズ機能を使ったメニューやソーシャルアイコンの設置 -テーマ「Hew」での例-

昨今、カスタマイズ機能を使ったテーマの調整がだいたい可能になっています。そして、この機能は WordPress.com とレンタルサーバ等にインストールして使うタイプの WordPress(以下、「インストール型の WordPress」と呼びます。)とで、だいたい同じ仕様になっています。

ここでは、WordPress のカスタマイズ機能を使って、メニューやソーシャルアイコンを設置する方法について覚え書きしたいと思います。

サンプルとしてはテーマ「Hew」を取り上げます。

続きを読む

WordPress.com のブログを自動でページめくりできるようにする

おそらく、この機能には賛否両論あるかと思いますが、とりあえず、自分のブログに自動でページめくりできる機能「無限スクロール機能」を追加したので、その覚え書きです。

続きを読む

WordPress.com のデザインなどをとりあえずざっくりと仕上げることのできる機能「カスタマイズ」のざっくりとした説明 (改)

!

以下の記事の改訂版です。

以前は、ヘッダー画像を追加したり、背景を変更したり、といった作業は、以下のところなどから行っていたのですが、

2016-01-20 at 16.35.png

2016-01-20現在は、以下のようなカスタマイズ管理画面 (カスタマイザー) でも設定できるようになっています。大きな違いはプレビュー画面を見ながら設定できるところかと思います。

2016-01-20 at 16.38.png

一時期、こんな感じの管理画面になっていましたが、

sdfgsdfgsfg

結局、レンタルサーバ等にインストールして使うタイプのものとだいたい同じ管理画面を採用したようです。

2016-01-20 at 16.40.png

レンタルサーバ等にインストールして使うタイプの WordPress のカスタマイズ管理画面

WordPress.com のカスタマイズ機能にアクセスするには、WordPress 管理画面からだと、ここや

2016-01-20 at 16.43.png

ここ。

2016-01-20 at 16.44.png

ブログ上からはここ。

2016-01-20 at 16.43.png

新しくできた管理画面からは、ここからアクセスできます。

2016-01-20 at 16.46.png

テーマにより、一部異なりますが、カスタマイズ機能のメニューはだいたいこんな感じです。

2016-01-20 at 16.56.png

各項目の内容について、上から順番に見ていきます。

ます、「サイトタイトル、タグライン、ロゴ」。

2016-01-20 at 16.57.png

次に「色・背景」。

2016-01-20 at 16.58.png

プレミアムプラン等にアップグレードすると機能がいくつか追加されます。

2016-01-20 at 16.59.png

フォント」。フォントを変更できる機能ですが、日本語には対応していません。

2016-01-20 at 17.01.png

プレミアムプラン等にアップグレードすると以下のリンクが追加されます。

2016-01-20 at 17.04.png

リンク先は以下のページとなっており、

日本語にも対応しているっぽいですが、

2016-01-20 at 17.07.png

WordPress.com にどこまで適用できるかなどについては未検証です。

ヘッダー画像」。

2016-01-20 at 19.01.png

メニュー」。

2016-01-20 at 19.02.png

メニューのセットを作成し、

2016-01-20 at 19.51.png

各メニューエリアにメニューセットを選定する、といった感じ。

2016-01-20 at 19.52.png

なお、新しい管理画面のところにもメニューを設定できるところがあります。

2016-01-20 at 19.56.png

今のところ、どちらを使うのがベターなのか等詳細についてはよくわかりません。

CSS」。ここから CSS を追加することができるようになっていますが、この機能を利用するためにはプレミアムプラン等へのアップグレードが必要です。

2016-01-20 at 19.59.png

ウィジェット」。

2016-01-20 at 20.06.png

個人的には、ウィジェットの設定状況を俯瞰してみることのできる、WordPress 管理画面のウィジェット設定機能の方が使いやすいと思っています。

2016-01-20 at 20.08.png

固定フロントページ」。

2016-01-20 at 20.13.png

ものすごくざっくりと説明すると、ここのところをこんな感じに設定するとウェブサイトっぽくなります。

2016-01-20 at 20.15.png

その他、テーマの種類によって、「おすすめコンテンツ」や「テーマオプション」などのメニューが追加されます。

2016-01-20 at 20.20.png

【WordPress.com】トップページにスライダーを設置する方法 -タグで指定する (改)-

記事「トップページにスライダーを設置する方法 -タグで指定する- ⚪️ | comemo com|2013-07-10」の改訂版です。

WordPress.com での投稿スライダーの設置方法について覚え書きしたいと思います。

昔は投稿スライダーを設定する方法は何種類かあったように記憶していますが、最近、リリースされるテーマについては、だいたいこの方法に統一されていると思います。

投稿記事の側での設定

どのテーマを使うにしても、あらかじめこの設定をやっておいた方が後々、便利だと思います。

投稿スライダー設定用のタグを設定する

投稿スライダーに表示したい投稿記事に「featured」というタグを設定します。別に「featured」でなくても投稿スライダーを表示させることは可能ですが、初期値が「featured」になっていますし、別にブログ上に表示しなくても問題のないタグですので、特にこだわりがなければ投稿スライダーの設定用のタグは「featured」にしておく方が無難だと思います。

2016-01-15 at 10.30.png

アイキャッチ画像を設定する

投稿スライダーに表示させたい投稿記事にアイキャッチ画像を設定します。ここで設定した画像が投稿スライダーに表示されることになります。

2016-01-15 at 10.30.png

テーマを頻繁に変更する方について特に言えることですが、できるだけ大きめの画像を設定しておくのが無難かと思います。例えば、テーマ「Toujours」の場合は、「横 1160 px、高さ 600 px」以上のものをアイキャッチ画像として設定することが推奨されていますが、これ以上の大きさのものを推奨するテーマも存在するからです。

ただし、特に最近リリースされるテーマの場合は、これ以下のサイズであってもそれなりに表示されるものが増えていますので、それほど神経質になる必要はないかもしれません。逆に言えば、数年前にリリースされたテーマの中には、小さい画像をアイキャッチ画像に設定してあった場合、表示されないケースがあるので注意が必要です。

 

カスタマイズ機能の側での設定

次にカスタマイズ機能の方での設定を行います。

WordPress 管理画面の側からは以下の2か所、

2016-01-15 at 10.27.png

2016-01-15 at 10.27.png

WordPress.com の新しい管理画面の方からは以下の箇所より、カスタマイズ機能にアクセスできます。

2016-01-15 at 10.28.png

投稿スライダーの設定場所は、一部、例外があったように記憶していますが、ほとんどのテーマでは「おすすめコンテンツ」のところにあります。

2016-01-15 at 10.26.png

何も考えずにとりあえず、以下のように設定しておけば問題ないと思いますが、例えば、投稿スライダー用に別のタグ名を使用したい場合にはタグ名のところを変更してください。

2016-01-15 at 10.26.png

なお、カスタマイズ機能の管理画面上で投稿スライダーの作動状況を確認することができます。

【WordPress.com】メニュー機能の使い方 -概要- 🔵

WordPress.com のメニュー機能の使い方についての覚え書きです。

2015-08-04 at 18.35

続きを読む

【WordPress.com】ヘッダー画像の設定方法 🔵

最終更新日:2016-04-11

ヘッダー画像の設定方法についての覚書です。

続きを読む

WordPress.com の参加サイトのコーナーにあるテーマ検索サイトでは日本語で検索ができる

WordPress.com のテーマを日本語で検索できるところがあったので、その覚書です。

WordPress テーマ — WordPress.com

WordPress テーマ — WordPress.com(WordPress.com にログインしているときに閲覧可能)

続きを読む