久しぶりにCSS Niteのセミナーに参加しました。 シバタヒロノリさん著作の本、「武器になるHTML」（買いました）を元にしたセミナーです。 セミナー前々日くらいにTwi.....X‼️‼️で流れてきて知ったので、急いで予約をしました。 フォローアップメールでスライドを配信してくださることは知っていたので、 シバタさんが口頭で仰っている中で「これは大事だ！！」と思った部分を、Notionに殴り書きしていきました。 <a href="https://www.notion.so/scatcat/20230208-HTML-f0b105d910f2491abc3be9f3974f3450?pvs=4" target="_blank" rel="noopener noreferrer">Notion</a> （誤った解釈をしている部分がありましたらご指摘いただけますと幸いです） これまで何年かHTMLを書いてきて、その中で正しいマークアップの仕方はなんとな〜く覚えていった感じでしたが、 実際「なぜそのルールでマークアップをしなきゃいけないのか」といった事は詳しく理解できていなかったなぁと 今回改めて思いました。 ちらちら調べて断片的には理解していましたが（altの書き方とか）、やはり全体的にきちんと把握すべきだなと思いました。 きちんとマークアップをすることで、どのような方にも幅広く情報を伝えることができる事がWebの特性。 まさにその通りだと思います。Webの魅力⚡️ 来月はこちらに参加します！AstroでJamstack！！めちゃくちゃ楽しみです、、、 <a href="https://cssnite.doorkeeper.jp/events/168735?_gl=1*14z3xfc*_ga*MTcyMjIyOTA1MC4xNzA4MDAwNzI0*_ga_HSFZ58MBT4*MTcwODAwMDcyNC4xLjAuMTcwODAwMDcyNC42MC4wLjA." target="_blank" rel="noopener noreferrer">これから始めるJamstack</a>

【セミナー】CSS Nite：武器になるHTML（シバタヒロノリさん）に参加しました

親の会社が勤怠表を都度作成して紙に印刷していて大変そうだったので、 Googleカレンダーでの管理を勧めてみた その際に一応紙でも印刷できるようにしたいって言われたので、自動的に表が作れるようにしました 自分用備忘録です 完成形 <img src="https://images.microcms-assets.io/assets/6f857f0e5be74e32951fad09f0a6e73f/0c9a3d1e9e934f9eb008ce4f2aadf1a5/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202023-12-09%2013.46.19.png" alt=""> A列2セル目から日付、B列からそれぞれの職員の勤怠記録 ⚪︎がついているセルがお休みの日です 例えば休む日に「田中休み」と登録しておくと、勝手にスプシのスケジュールの田中さんの列に「⚪︎」が付きます。 1.Apps Scriptを開く スプレッドシートの「拡張機能 &gt; Apps Script」から開く <img src="https://images.microcms-assets.io/assets/6f857f0e5be74e32951fad09f0a6e73f/e79d51179c454a4784c25a9b3a7b1c0e/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202023-12-09%2013.50.07.png" alt=""> 2.コードを書く 開いたらすぐにコードが書ける環境になってるので、下記コードを書く 試しに自分のカレンダーに適当に「休み」とか「⚪︎⚪︎休み」とかを登録してみて、 保存して実行して反映されるかどうか試す<pre><code>function importCalendarEventsToSpreadsheet() {
 var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
 var sheet = spreadsheet.getActiveSheet();


 // カレンダーIDのリストを作成
 var calendarIds = ["名前1の人のgoogleID（googleアカウントのメアド）", "名前2の人のgoogleID"];


 // ユーザーのリストを作成
 var users = ["名前1", "名前2"]; // ユーザーの名前を追加


 // 現在の月の日付を取得
 var today = new Date();
 var currentYear = today.getFullYear();
 var currentMonth = today.getMonth();
 var firstDay = new Date(currentYear, currentMonth, 1);
 var lastDay = new Date(currentYear, currentMonth + 1, 0);


 // 既存の予定を取得し、スプレッドシートに反映
 for (var i = 0; i &lt; users.length; i++) {
 var userName = users[i];
 var calendarId = calendarIds[i];
 var events = CalendarApp.getCalendarById(calendarId).getEvents(
 firstDay,
 lastDay
 );


 // ユーザー名を各列の1セル目に挿入
 sheet.getRange(1, i + 2).setValue(userName); // 1行目にユーザー名を挿入


 // スプレッドシートの既存の予定をクリア
 var clearRange = sheet.getRange(2, i + 2, sheet.getLastRow() - 1, 1);
 clearRange.clearContent();


 // イベント情報の中からタイトルに '休み' が含まれているものだけを反映
 for (var j = 0; j &lt; events.length; j++) {
 var event = events[j];
 if (event.getTitle().includes("休み")) {
 var eventDate = event.getStartTime();
 for (var row = 2; row &lt;= sheet.getLastRow(); row++) {
 var dateInSheet = sheet.getRange(row, 1).getValue();
 if (dateInSheet instanceof Date &amp;&amp; dateInSheet.toDateString() === eventDate.toDateString()) {
 sheet.getRange(row, i + 2).setValue("⚪︎");
 }
 }
 }
 }
 }
}

</code></pre> 3.トリガーを設定 カレンダーにスケジュール登録・変更がされる度に実行するようにしています <img src="https://images.microcms-assets.io/assets/6f857f0e5be74e32951fad09f0a6e73f/7f730c9b69154024979752d1ee767f2f/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202023-12-09%2013.55.07.png" alt=""> 今回ももちろんchatGPTに協力してもらいました...

【勤怠表】googleカレンダーに登録したスケジュールをスプレッドシートに反映

会社で、「ラジオボタンの選択肢によって署名を変えてほしい」という案件が発生しました。 参考記事を探したのですが、「署名を書き換える」という記事がヒットしなかったので、あくまで自分のメモ用として書いておきます。 こちら参考にさせていただきました。 <a href="https://plugins.2inc.org/mw-wp-form/filter-hook/mwform_auto_mail/" target="_blank" rel="noopener noreferrer">MW WP Form マニュアル</a> <pre><code>function my_mail($Mail, $values, $Data){
 if ($Data-&gt;get('animal') == 'ねこ') {
 $Mail-&gt;body .= "＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝\nねこは可愛いです。\nかわいすぎて最高です\nハワイ行きたい\n＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝";
 } else if ($Data-&gt;get('animal') == 'いぬ') {
 $Mail-&gt;body .= "＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝\nいぬも可愛いです。\nかわいすぎて涙出る\nカナダ行きたい\n＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝";
 }
 return $Mail;
}
add_filter( 'mwform_auto_mail_mw-wp-form-xxx', 'my_mail', 10, 3 );</code></pre>・xxxはMW WP FormのショートコードのID ・get('animal')はinputのname属性の値 $Mail-&gt;bodyで本文を取得し、署名はメール本文の文末に挿入したいので、文末に挿入するように連結代入演算子で$Mail-&gt;bodyと署名を結合させてます。 最初は改行コードが使えなくて焦ったのですが、値を""で囲むと改行コードが使えるみたいです。 ですので、上記コードを反映すると （猫の場合）<pre><code>＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
ねこは可愛いです。
かわいすぎて最高です
ハワイ行きたい
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝</code></pre> このような形でメールの文末に挿入されます。

pwpw-cat

MIYAWeb Engineer / Designer

SKILL

Work

Work

Blog

Contact