こんにちは！
6月14日、金曜日。快晴。
最高気温31℃！！？
もはや夏。。。ι(´Д｀υ)ｱﾂｨｰ
ちなみに、MicrosoftのAIアシスタント、Microsoft Copilotに今日の気温について聞いてみました。
今日は暑いですね。東京だと何度まで上がる？
今日の東京都心（大手町）の最高気温は24.6℃で、最低気温は21.4℃となっています12。暑さを感じるのも無理はありませんね。どうぞ、水分補給を忘れずにお過ごしください。😊
・・・
まじか。。。
2024年6月14日の東京の天気をYahoo!天気で調べると、
最高気温31℃、最低気温20℃とあるんだが。。
こんなもんなの？2024年のAIって。。
もう一回確認してみます。
え？ヤフージャパンの天気予報見たら31℃まで上がるみたいだけど？
申し訳ありません、私の情報は間違っていました。ヤフー天気予報によると、今日の東京の最高気温は31℃になる予定です1。正確な情報を提供できずに申し訳ありませんでした。これからはより正確な情報を提供できるよう努めます。何か他にお手伝いできることがありましたら、お知らせください。😊
・・・
何の情報を出してきたのかわかりませんが、まだまだAIに支配されるようなことにはなりそうにないので安心しました。。
ではでは気を改めて、
今日も勉強してまいります！
教材はもちろん！
今日からいよいよCHAPTER３に突入します。
CHAPTER３ プラグインを利用する
SECTION０１ プラグインで機能を拡張する
→WordPressの機能を拡張するためのツール
→プラグインには、公式のものと非公式のものがある
→公式プラグインはソースコードがチェックされているため、安心して使える
プラグインを選ぶときのポイント
・WP Multibyte Patchプラグインをインストールする
[流れ]
①「プラグイン」にてキーワード検索
②［今すぐインストール］押下
③［有効化］押下
公式に登録されていない理由は、
・自分のWebサイトで配布したい
・公式に登録する手間が面倒
などさまざま
非公式でも素晴らしいプラグインはたくさんあるが、悪意のあるプログラムが仕組まれたプラグインや、セキュリティーホールを含むプラグインが存在するのも事実。
・pluginsディレクトリにアップロードする
例えば「oreore-plugin」の場合、
・zipファイルをアップロードする
管理画面からアップロードすることも可能
・アップロードしたプラグインを確認する
アップロードでインストール完了。
管理画面にて「有効化」をして使用できるようになる。
SECTION０２ パンくずリストを作成する
・・・してありました。
・表示されるHTMLを調整する
①パンくずの区切り
②ホームページテンプレート／ホームページテンプレート（リンクなし）
・テンプレートファイルを作成する
/template-parts ディレクトリの中に「breadcrumb.php」を作成
＜PHP関数＞
・テンプレートファイルを修正する
「breadcrumb.php」は、footer.phpから読み込み、全ページに反映するのでfooter.phpを修正する。
＜修正前＞
＜修正後＞
実装！
OK！！
やったね！
SECTION０３ メールフォームを作成する
・Contact Form 7とは
→メールフォーム作成プラグイン
→日本人作成の世界的に人気の高いプラグイン
・ショートコードを手に入れる
インストール後、「お問い合わせ」に「コンタクトフォーム１」が登録されている
ショートコード列の赤枠のコードをコピー
・「お問い合わせ」ページにショートコードを貼り付ける
「固定ページ」に作成した「お問い合わせ」の本文に貼り付ける
実装！OK！
すでに動作しているとのことなので実際に送信してみると、
OK！
メールの送信先は、WordPressに設定してあるメールアドレス。
デザインがシンプルなままなので変更していく。
・入力欄を変更する
・お問い合わせフォームのHTMLを作成する
学習用素材から内容コピーし、フォームに貼り付け。
実装！
OK！
・HTMLを正しく出力する
変更したフォームのHTMLを確認すると、入力してないはずの<p>タグが出力されている。
これは、WordPressが文章に合わせて整形する機能が動いているため。
お問い合わせフォームの場合は、入力したHTMLのみを出力したいので、この機能をOFFにする必要がある。
⇒functions.phpにコードを追記
実装！OK！！
いつもなら終わる時間なんですが、中途半端で終わるのが嫌なので
一旦小休止します。☕
続きは夜。
…………..
さあさあさあ！！
続きをやっていきます！！
フォームから送信されるメールの内容も自由うに作成できる。
エラーが消えた！OK！！
Contact Form 7はAjaxを使ってメールを送信するので、確認と送信完了の画面が用意されていない。
→プラグインを利用して、完了画面を表示させるようにする。
Hey！Copilot！「Ajax」ってなんじゃ？
Ajax（エイジャックス）は、Asynchronous JavaScript and XMLの略で、Webブラウザ内で非同期通信を行い、部分的なページ更新を可能にする技術のことを指します。
Ajaxを使用すると、ユーザーがWebページ上で何かアクションを起こしたときに、ページ全体をリロードすることなく、サーバーとの間でデータをやり取りすることができます。これにより、ユーザー体験が向上し、Webアプリケーションがよりスムーズに動作します。
え～っとつまり、、、
「リロードしてない」→「画面遷移しない」ってことかな。。。
まあだいたい合ってるでしょう。。
・Contact Form 7 MultiｰStep Forms の動作イメージ
お問い合わせフォーム → 確認画面 → 完了画面
・確認画面用のコンタクトフォームを作成する
- multiform：データを受け取る
- previous：戻るボタンを作成する
- multistep：送信時の動作を設定する
「お問い合わせ」にて新規作成で「確認画面用フォーム」を作成する
→「フォーム」欄に学習用素材の内容を貼り付ける
→「メール」タブから「メッセージ本文」に入力（「コンタクトフォーム１」と同内容）
→設定を保存し、作成したフォームのショートコードをコピー
※設定エラーが検出されるが無視してよいとのこと
→確認画面の固定ページを作成する
※パーマリンク：confirm、親ページ：お問い合わせ
→コピーしたショートコードを貼り付ける
・入力画面の設定を変更する
→「コンタクトフォーム１」の「multistep」ボタンをクリック
→内容修正し、タグ発行
→フォームの内容修正
実装！
OK！！
確認画面の戻るボタンの動作も問題ありませんでした。
終わったーーーーー！！！
過去イチ長時間勉強してしまった。。
0時回っただよ。。
おつかれ～
ありがとうございました！！
今日は以上。
コメント