技術メモ

HTML/CSS・JavaScript・プログラムなど、コードや仕組みを自身で試したメモとして残すカテゴリ。
再利用を想定した備忘録としても。

技術メモ

「サイトを登録して、発見して、つながる。」 リンクプラットフォーム SiteHub(サイトハブ) 始動しました

登録するだけであなたのサイトが見つかる。「SiteHub(サイトハブ)」は、誰でも無料で使えるリンクプラットフォーム。ブログやホームページの被リンク・発見・つながりを促す、ウェブ時代の新しいハブサービスです。
技術メモ

GASとTwitter APIでX(旧Twitter)へブログ記事を自動ツイートする仕組みを構築した話

GASとTwitter API(X API)を使って、ブログ記事を自動ツイートする仕組みを構築。スプレッドシートとトリガー設定だけで、毎日2回投稿。無料で動く手軽な自動化を紹介します。
技術メモ

【コピペOK】Webサービスの稼働を毎日自動チェック!GAS+スプレッドシートで作る監視ツール

GAS+スプレッドシートでWebサービスを毎日自動監視。URLの稼働状況をチェックし、異常をメール通知する仕組みを無料で構築。インフラ不要で実用的な簡易監視ツールを紹介します。
技術メモ

CSSのanimationがiOSのChromeで動かない…transitionで対応

ページスクロールに合わせた要素のフェードインにCSSのanimationを使ったらiOS版Chromeでtranslateが動かず、animationをtransitionに書き換え、delay設定を併用して解消した方法を具体的に解説します。 
技術メモ

注意!LINE Messaging API プッシュメッセージ通数のカウント方法にお気をつけを

LINE Messaging APIでプッシュメッセージをグループ送信すると参加ユーザー数×送信回数で通数が消費される仕様により、無料1,000通制限を意外に超過した事例をもとに注意点と検証方法を具体的にまとめています。 
技術メモ

inputのtype=file選択時にjsでバリデーションする【vue.js】

Vue.jsでinputのtype=file選択時にファイルサイズ(3MB上限)と拡張子(.jpg/.gif/.png/.pdf)のバリデーションを行い、違反時はアラート表示とinput値リセットでUXを守る手順を具体例付きで解説しています。 
技術メモ

refを複数に設定したい…$refsで取得した要素のスタイル操作|Vue.js

Vue.jsで同じref名を複数設置すると最後の要素しか取得できない問題を、ループID付きのユニークrefに変更し、$refsで個別要素を操作する具体手順をまとめました。 
技術メモ

MySQLの外部キー追加時にエラー…ERROR 1215 (HY000): Cannot add foreign key constraint

ERROR 1215発生時にSHOW ENGINE INNODB STATUSで最新Foreign Keyエラーを確認し、参照先カラムのPRIMARY KEY化とFOREIGN_KEY_CHECKS無効化で解消する手順を具体的にまとめました。 
技術メモ

Vue.jsでtoggle機能実装!多箇所で使いたい時の実装方法

Vue.jsでshow_contents配列とtoggleメソッドを使い、複数箇所の開閉を個別管理。キーを引数に渡すだけで簡単に多用可能なtoggle機能を解説します。 
技術メモ

ローカル環境でのメールテストはMailtrapが簡単&便利

MailtrapのSMTP情報をローカル開発環境に設定し、テストメールを実際のユーザへ送信せずMailtrap上で安全に確認できる手順をPHPMailer例と共に紹介。煩雑な後処理から解放される便利サービスです。 
技術メモ

AMP-タグ「style amp-custom」のCSS構文エラーの修正方法

Search ConsoleのAMPエラー通知からstyle amp-customの構文ミス箇所をバリデーターで特定→Search RegexでインラインCSSを修正する方法をまとめています。 
技術メモ

chrome拡張機能を自作してウェブストアで公開する手順

公式ドキュメントのサンプルからmanifest.jsonとpopup.htmlを作成し、ローカルで動作確認→Chromeウェブストアへ公開する手順を具体的にまとめています。 
技術メモ

LineのMessaging APIでグループトークの内容をデータベースに保存してみた

LineのMessaging APIを使い、ボットをグループに招待してWebhookで受け取ったメッセージや画像をPHP+MySQLでDBに保存する手順とサンプルコードを紹介しました。 
技術メモ

共有レンタルサーバーのデメリット…スパム扱いでメールが送信できない!

共有レンタルサーバー利用中にGmail宛メールが認証エラーでスパム扱いされ送信不能に。ブラックリスト解除申請と外部SMTPの暫定対処を具体的にまとめました。 
技術メモ

file_get_contentsが動かない?cURLを使いallow_url_fopenがOffのサーバに対応

allow_url_fopenがOffのサーバでfile_get_contents()が動作しない問題を、cURLへの置き換え手順をサンプルコード付きで詳細に解説しています。 
技術メモ

エックスサーバーでブログの表示が遅い時はPHPのバージョンが原因かも

エックスサーバーでサイトの表示速度低下をPageSpeed Insightsで検証し、サーバ応答遅延の原因がPHPバージョン設定にあると判明。管理画面からのバージョン変更手順を具体的に解説しています。 
技術メモ

印刷用CSSを確認しながら設定する簡単な方法|Chrome利用

ChromeのDeveloper Tools『Rendering』でEmulate CSS Mediaをprintに切り替えるだけで、command+Pなしで印刷用CSSを画面リロードのみでリアルタイム確認できます。 
技術メモ

Basic認証環境でfile_get_contentsが動かない!?エラー確認と対処方法

Basic認証環境でfile_get_contentsが動かない際に401エラーが出る原因を、allow_url_fopenの設定確認とAuthorizationヘッダーを追加した認証対応で解消する具体手順を解説します。
技術メモ

Javascriptでformの入力欄の文字数をカウントする方法

Javascriptでformの入力欄の文字数をカウントする方法:textareaやinputにonkeyup属性を追加し、getElementByIdで文字数をリアルタイム表示するコードを一行で実装する手順を解説します。 
技術メモ

ブログ画像の不正コピー防止に!無断使用を阻止する方法

ブログ画像の不正コピー防止に!無断使用を阻止する方法:透明画像を重ねるHTML/CSS/JavaScriptコードで、ドラッグや右クリックからのダウンロードを抑制し大切なコンテンツを守ります。