【WordPress.com】半透明の画像を使って、背景全体の色合いや明暗の調整をしやすくする

WordPress.com のカスタマイズ機能では、一般に、背景に画像や色を設定することができますが、画像を設定した場合には、色の設定は画像の下に隠れてしまい、見かけ上、無効となります。

2016-02-09 at 16.49.png

そのため、WordPress.com にあらかじめ準備されている不透明な背景パターンを背景画像として使用する場合、その色合いや明暗の調整をするためにはその都度、画像を編集し、差し替える必要があります。

2016-02-09 at 16.50.png

ここでは、画像を半透明にすることにより、下色を使って、背景の色合いや明暗を調整しやすくする方法について覚え書きしたいと思います。

2016-02-09 at 16.54.png

comemoarrow

2016-02-09 at 16.55.png

続きを読む

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 では Sass を使った CSS の階層定義が使えるようだ

以下の記事を参考に WordPress.com に Sass を使った CSS の階層定義ができるかどうか試してみたところ、できたのでその覚え書きです。

続きを読む

WordPress.com に CSS を追加する場所

2016-01-11現在、WordPress.com のブログ等に CSS を追加する場所は、「カスタマイズ」、

2016-01-11 at 17.25.png

続きを読む

【WordPress.com】ロゴ画像がテーマ間で使い回しできるようになっている

これまでは、一部のプレミアムテーマの個別の機能であった「ロゴ画像」の設定がテーマ間で連携して使えるようになったそうなので、その覚書です。

実際に確認してみると「カスタマイズ → サイト名」のところに「サイトロゴ」という項目が追加されています。

Confit のカスタマイズ — WordPress

続きを読む

[WordPress.com] カスタムカラー機能の中にある背景パターンの色を薄くする方法についての検討

WordPress.com のカスタムカラー機能の中に背景パターンの設定がありますが、

asdfafads

続きを読む

#2013

テーマ「Twenty Thirteen」の色のカスタマイズ例のおすすめバージョン2つ

テーマ「Twenty Thirteen 」の色のカスタマイズにおすすめバージョンが2つ追加されていたので、その覚書です。

Safari

カスタマイズ(色)・CSS カスタマイズ

カスタマイズ(色)

sadgsfgfsd
asdgfgsdfgfsd

#2013