Git 利用するエディターを指定・ファイル編集(コマンドライン)

VS codeコマンドラインから呼び出せるように設定

  1. VS code立ち上げる
  2. Shift + Command + P を押す
  3. 『shell』と入力
  4. 『シェルコマンド:PATH内に'code'コマンドをインストールします』をクリック

Gitで使用するエディターをVS Codeに指定する

$ git config --global core.editor "code --wait"

設定を確認

$ git config core.editor
code --wait

もしくは

$ git config --list
credential.helper=osxkeychain
filter.lfs.smudge=git-lfs smudge -- %f
filter.lfs.process=git-lfs filter-process
filter.lfs.required=true
filter.lfs.clean=git-lfs clean -- %f
user.name=xxxx
user.email=xxxxx
core.editor=code --wait
設定を削除したい時
$ git config --global --unset core.editor

ここまでを設定するとgitでコミットする際にVS codeが立ち上がるようになるはずが、 エラーが出た。

$ git commit
hint: Waiting for your editor to close the file... code --wait: code: command not found
error: There was a problem with the editor 'code --wait'.
Please supply the message using either -m or -F option.

エラー原因

VS Code内にてcodeコマンドを使用する設定ができていない為。

解決方法

VS codeで shift + command + p でコマンドパレットを開く 下記コマンドを実行

Shell Command: Install 'Code' command in path

パスワードを聞かれたら入力

もう一度、git commitしたら無事にVS codeが立ち上がりました。

###プロジェクトでファイル編集をするためにエディターを立ち上げる

$ code /Users/xxxx/Desktop/ichiyasaGitSample

プロジェクトのフォルダーごとエディターが立ち上がります。

Git ローカルリポジトリでの操作(コマンドライン)

ディレクトリにローカルリポジトリ作成

$ cd ichiyasa  //ディレクトリに移動
$git init //ローカルリポジトリ作成

Macの場合、コマンドの実行結果にhintが表示されることがありますが、特に操作は必要ありません。 標準のブランチ名をgit configコマンドを使って変更できると記載されています。

ディレクトリ内を確認

$ ls -a
.       ..      .git        Git_MEMO.md

ローカルリポジトリの状態を確認

$ git status
On branch master

No commits yet

Untracked files:
  (use "git add <file>..." to include in what will be committed)
    Git_MEMO.md

nothing added to commit but untracked files present (use "git add" to track)

『Untracked files』に表示されているファイルはGitの管理下に入っていないことを指します。

ステージングエリアに登録

git add Git_MEMO.md 

ファイル指定の書き方ですが下記のように指定できます。

$ git add . //カレントディレクトリ配下全て
$ git add subDirectory  //subDirectoryのディレクトリ全て
$ git add subDirectory/file.md  //subDirectoryのfile.mdのみ

ステージングエリアに登録されたことを確認

$ git status
On branch master

No commits yet

Changes to be committed:
  (use "git rm --cached <file>..." to unstage)
    new file:   Git_MEMO.md

実行結果が『Untracked files』から『Changes to be committed:』に変更されました。

ファイルの差分を確認

git diff
diff --git a/Git_MEMO.md b/Git_MEMO.md
index 54f4fe1..0fdf6f4 100644
--- a/Git_MEMO.md
+++ b/Git_MEMO.md
@@ -1,2 +1,5 @@
-#Git 学習メモ
-## Gitコマンド
\ No newline at end of file
+# Git 学習メモ
+
+
+- ローカルリポジトリを作成する
+    - git init
\ No newline at end of file

実行結果の先頭に『+』がついていれば追加、『-』がついていれば削除

ステージングエリアとGitディレクトリ(前回のコミット)の差分を表示するオプション --cached
$ git diff --cached

ファイルをコミットする

$ git commit
hint: Waiting for your editor to close the file... 

1.自動的にVS codeが立ち上がる 行頭に#がついているのはコメントでコミットメッセージには含まれない。

2.コミットメッセージを書く

  • 1行目にコミットタイトルを書く(Gitの学習メモを作成)
  • 2行目は空白
  • 3行目から詳細を書く

この書き方がGitの公式サイトに書かれているおすすめの書き方です。

Git - git-commit Documentation

3.保存してVS codeを閉じる

[master (root-commit) 175f135]  Gitの学習メモ
 1 file changed, 2 insertions(+)
 create mode 100644 Git_MEMO.md

ターミナルに上記の実行結果が出る

ローカルリポジトリの状態を確認

$ git status
On branch master
nothing to commit, working tree clean

コミットメッセージ1行の時は素早くコミット -m

$ git commit -m "ローカルリポジトリの作成"
[master 4f15281] ローカルリポジトリの作成
 1 file changed, 5 insertions(+), 2 deletions(-)

Mac gitを最新バージョンにする

MacデフォルトのGitを確認する

Gitは、Macにデフォルトでインストールされています。 バージョンの末尾に、(Apple Git-xxx)と付くのがMacにデフォルトで入っているGitとなります。

$ git --version
git version 2.30.1 (Apple Git-130)

gitのサイトで最新バージョンを確認すると2.36.1なので最新にアップデートします。 今回はHomebrew経由でインストールしたgitを使用します。

Homebrewとは

Homebrew(ホームブリュー)とは、Gitなどのパッケージのインストールやバージョンアップなどを行う、macOS用のパッケージ管理ツールです。

MacデフォルトのGitでもその機能に変わりはありませんが、バージョンを簡単に変更できないと言ったデメリットがあります。

そこで、「Gitのバージョン管理を楽にする」ことを目的として、Homebrewを使ったインストールを行います。

Homebrewで最新のgitをインストール

Homebrew自体はインストールしていましたが、Homebrewのgitはインストールしていないのでインストールします。

$ brew install git

PATHの設定が必要

インストールが終わった状態でgitのバージョンを確認するとまだMacのデフォルトのgitが表示されます。これをHomebrewのgitを使用するようにシェルにPATH設定をしないといけません。

シェルとは

シェルとは、ターミナルに打ち込んだコマンドを実行してくるプログラムです。このシェルに「HomebrewでインストールしたGitを使ってね」と教えてあげる必要があります。

シェルにHomebrew経由のGitパスを通す

使用しているシェルの確認

$ echo $SHELL
/bin/zsh

/bin/zshが出てきた場合はzsh(ゼットシェル)を利用しています。

.zshrc(ゼットシェル ラン コマンド)ファイルにGitのパスを記入

viコマンドで、.zshrcを開きます。

$ vi ~/.zshrc

開いたファイルをインサートモードにする『iキーを押す』下記のように画面が変わります

-- INSERT --

パスを記入する

# HomebrewのGitを使うパス
export PATH=/usr/local/bin/git:$PATH

インサートモードを終了する『esc(エスケープ)キーを押す』

変更を保存する『:wq』

変更を確認する(もう一度開く)

$ vi ~/.zshrc

何もせず終了する『:q』

シェルを再起動する

シェルは起動時にファイルのパスを見ますので、変更を反映する場合はターミナルを再起動する必要があります。

そのコマンドが下記になります。

$ exec $SHELL -l

参照しているGitを確認する

$ git --version
git version 2.36.1

成功していれば(Apple Git)が付かないバージョン情報が表示されます。

今回、めちゃくちゃ参考にさせていただきましたサイトです。

【MacOS】Homebrew経由でGitをインストールする方法 - 独学プログラマ

WP よく使うコードを関数にする

よく使うコードを関数にしておくと保守性が高まりますし、コードもスッキリします。

<?php if ( has_post_thumbnail() ): ?>
    <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
<?php else: ?>
    <a href="<?php the_permalink(); ?>"><img src="<?php echo get_template_directory_uri(); ?>/assets/img/common/noimage_600x400.png" alt=""></a>
<?php endif; ?>

これをfunctions.phpに関数にします。

/**
 * No Image画像を表示する関数
 */
function display_thumbnail() {
    if ( has_post_thumbnail() ) {
        echo '<a href="'.get_permalink().'">'.get_the_post_thumbnail( 'thumbnail' ).'</a>';
    }else {
        echo '<a href="'.get_permalink().'"><img src="'.get_template_directory_uri().'/images/common/noimage.png" height="180" width="180" alt=""></a>';
    }
}

使う時は関数名を記述

<?php display_thumbnail() ?>

ここで注意するのは、テンプレートでは『<?php the_post_thumbnail('thumbnail'); ?>』となっていたのを関数では『get_the_post_thumbnail( 'thumbnail' )』にしないといけません。

the_permalink(); → get_permalink() the_post_thumbnail('thumbnail') → get_the_post_thumbnail( 'thumbnail' )

Codexだと大抵、the*()は「~を表示する」、get_the*()は「~を取得する」と書いてあります。ループの中の現在地が「the」に対し『get』は引数でIDなどを指定することができます。

WP カテゴリーに画像を追加して、そのカテゴリー画像を表示させる

カスタムフィールドでカテゴリーに画像を追加

1.カテゴリーに追加するようにする

2.フィールドの詳細を入力

カテゴリー画像を取得・表示

<?php $categories = get_categories(); ?>

<?php foreach ($categories as $category) : ?>

<?php 
$cat_id = $category->cat_ID; // カテゴリのIDを取得
$post_id = 'category_'. $cat_id; // カテゴリIDを付けて、category_1 の様な形にする 
$cat_imgid = get_field('cat_img', $post_id); // cat_imgはフィールド名を入力 
$cat_img = wp_get_attachment_image_src($cat_imgid, 'full')[0];
$cat_slug = $category->slug; //カテゴリスラッグ
$cat_name = $category->name; //カテゴリ名前
$cat_description = $category->description; //カテゴリの説明文 
?> 

<a class="cat" href="<?= home_url(); ?>/?post_type=<?= $cat_slug ?>">
  <div class="cat_img">
    <img src="<?= $cat_img ?>" alt="">
  </div>
  <div class="cat_title">
    <?= $cat_name ?>
    <i class="fas fa-arrow-right"></i>
  </div>
  <p class="cat_description"><?= $cat_description ?></p>
</a><!--cat--> 

<?php endforeach; ?>  

スクロールすると途中で表示される「トップへ戻るボタン」