macでスクリーンショット

知ってる様で意外と知らない、macでのスクリーンショットの撮り方です。

コマンド + shift + 3 = 画面全体を撮ります。winのプリントスクリーンと同じ。

コマンド + shift + 4 = 切り抜き

ちなみに…

コマンド + shift + 4 + スペース = カメラのアイコンが出てきます。

これは、ウィンドウ、メニューバー、DOCK、アイコン…など、その他の領域を選んで撮影することが出来ます。切り抜きたい画像などをデスクトップ上に開いておくとGood。何気に便利です。

以上、macでショートカットキーを使って画面を撮影する方法でした。

スタイルシートに子テーマを設定する

皆さまこんにちは!
wordpressはデフォルトのTwenty Elevenのままでもとっtも素敵ですが、他にもたくさんあるテーマの中から気に入ったデザインを選んで着せ替えることが出来るのが魅力ですよね!また、気に入ったレイアウトのテーマを選んで、自分好みにカスタマイズ出来るところも魅力です。本日はwordpressのカスタマイズに必須な子テーマについてのお話です。

1. ワードプレスのテーマを変更してみる

ダッシュボード→外観→テーマ→新規追加

お好きなキーワードで検索、お気に入りが見つかったらインストールするだけです。後は、

外観→テーマ→インストールされているテーマ から選んで「有効化」するだけ。簡単ですね!

気に入ったデザインに着せ替えてはみたものの、「タイトルのフォントの色をもう少し明るくしたい」とか、「メニューバーの位置を変えたい」とか、使っているうちに何かしら不満が出てきますよね。
せっかく自分のサイトを作ったのだから、やはり見た目も機能も自分好みにカスタマイズしたくなるというもの。
そこで登場するのが「子テーマ」です。コーディングに自信が無くても、既存のテーマを基に自分好みに見た目を変えられるんです!素晴らしいですね(^^)

2. なぜ子テーマが必要なのか?

テーマの編集から、右上の▼で編集したいスタイルシートを選んで、その中に変更したい内容を記述したり書き換えても問題ありませんが、例えばこのTwenty Elevenというテーマも時々アップグレードされたりします。そうなるとテーマを新しいバージョンに更新する訳ですが、この時、元のテーマのスタイルシートに直接記述をしていると、テーマを更新することでスタイルシートも新しいものに置き換わってしまい、せっかく書いた構文も消えてしまう、という訳なんです。
でも、元になるスタイルシートに子テーマを設定してあれば、元になっているテーマが新しいバージョンに更新されても自分の設定が維持出来るんです。

3. 子テーマを設定してみる

それではデフォルトのテーマ、Twenty Elevenを例に説明していきます。
ご自分のサーバーへ行き、WPのフォルダの中の「wp-content」を開きます。
その中にある「themes」フォルダを開きます。「Twenty Eleven」のフォルダがありますね。この同じ階層に新しいフォルダ「twentyeleven-child」を作ります。(※ここではtwentyelevenの子テーマということでわかりやすくtwentyeleven-childとしました。)
フォルダを作りましたら、その中に新規にファイルを作成してファイル名を「style.css」とし
下記の様に記述します。

/*
Theme Name: twentyeleven-child   
Author: wpress   
Template: twentyeleven
*/
@import url(../twentyeleven/style.css);



〈説明〉

  • ※Theme Name: お好きな名前をつけて下さい。ここではtwentyelevenの子テーマということでわかりやすくtwentyeleven-childとしました。
  • ※Author: この子テーマの作者名です。あなたのお名前など。
  • ※@import url: 「この子テーマは、親テーマ(ここではTwenty Eleven) のテンプレートを引き継ぎます」と宣言します。くれぐれもcssの記述はこの宣言の後に書いて下さいね。でないと記述したcssが反映されません。

wordpressへ戻り、子テーマを適用したいサイトの
外観→テーマ→インストールされているテーマ
から、先ほど作ったtwentyeleven-childを選んで「有効化」します。

テーマの編集画面へ行きます。
右上の▼から先ほど作成したtwentyeleven-child のスタイルシート(style.css)を選択します。

※すぐ下を見ると、
「この子テーマは親テーマ Twenty Eleven のテンプレートを引き継ぎます。」
と書いてあります。

では試しに下記の記述をして、ファイルの更新ボタンを押します。

/*
Theme Name: twentyeleven-child
Author: wpress
Template: twentyeleven
*/
@import url(../twentyeleven/style.css);

body {
	background: #bdb76b;
}

※変更したところ…backgroundの色をデフォルトの #fff から #bdb76b に変更。

ファイルの更新をしてサイトへ戻ると…
背景色が白からカーキ色に変わりましたね!

これからは変更したい記述はここに書くようにします。

インストールした他のテーマについても、子テーマを作って試してみて下さい♪

wordpressのテーマを変更する

wordpressはデフォルトのTwenty Elevenのままでも機能的で見た目も素敵ですが、他にもたくさんのステキなテーマを選んで着せ替えが出来るんです。

テーマを変更してみる

ダッシュボード→外観→テーマ→新規追加

マルチサイト化している方は、左上のメニューバーから

参加サイト→サイトネットワーク管理者→ダッシュボード→外観→テーマ→新規追加

お好きなキーワードで検索、お気に入りが見つかったらインストールするだけです。
後は、

外観→テーマ→インストールされているテーマ

から選んで有効化するだけ。簡単ですね!
一瞬にしてガラッと雰囲気を変えられますし、いきなりプロっぽいサイトの出来上がり!
私もオリジナルのテーマが出来上がるまでの間は、コレで着せ替えを楽しむつもりです。

google web fontsを設定してみる

既存のテーマを使っていても、フォントを変えるだけでガラッと雰囲気を変えることが出来るんです!そこで大変便利なのが”google web fonts”です。(アルファベットのみになります。)

ワードプレスにgoogle web fontsを設定してみる

まず、WordPressのWeb Fontプラグイン、WP Google Fontsをダウンロードします。
ダウンロードしましたら、wordpressの自分のサイトへ行き、
ダッシュボード→プラグイン→インストール済みプラグイン から、WP Google Fontsを”ネットワークで有効化”にします。それではGoogle Web FontsへGO!
“google web fontsを設定してみる” の続きを読む

wordpress生活を始めよう

wordpressを始めよう!

自分のHPを持ちたい。でも一からコーディングするのは大変だし、カッコイイデザインにしたいけど、どうすればいいのかわからない、それにSEO対策とか…やっぱり色々難しいよね…そんな悩みを一挙に解決してくれるのがwordpress!
ものは試し、早速始めてみましょう。

1. レンタルサーバーに登録する

HPを作るぞと言っても、場所が無ければ公開することは出来ません。
レンタルサーバーとは、HPを公開するために必要な場所を借りるところです。
私はマニュアルが親切で初心者にもわかりやすいロリポップにしました。初めは260円/月のロリポプランで充分だと思います。

“wordpress生活を始めよう” の続きを読む