折橋 廉

主にコードを載せるのに使います。 興味のある話題 ▶ デザイン／ウェブデザイン／音楽

折橋 廉

主にコードを載せるのに使います。 興味のある話題 ▶ デザイン／ウェブデザイン／音楽

  • コーディング

    コーディングに関する自分の記事をまとめています。

固定された記事

【WordPress】画像投稿で記事を自動生成

00. はじめにサイトの運営で一番面倒なことは、更新作業ではないでしょうか？　 更新履歴記事作成、アイキャッチの作成、フロントページでお知らせ、作品ページの詳細………

折橋 廉
折橋 廉
1年前
9

【ChatGPT】プログラミングに活用するためのメモ

00. はじめに個人的なメモとして、常時アップデートしていきたいです。 もしどなたかのお役に立つようでしたら、ご活用ください。 01. AIが質問を返すように設定01-01. 提…

折橋 廉
折橋 廉
1年前
10

画像が表示されないときの原因と対策《mask, aspect-ratio》

先日、「画像が表示されない理由」についてマシュマロを頂きました。 その際にフォルダのパスについてご案内したのですが、後から思えば他にも原因が思い当たったので補足…

折橋 廉
折橋 廉
2年前

【2022年】近年のモダンブラウザ CSSハック

自分用に忘備録です。 近年実装されたものを中心にまとめました。 ※ベンダープレフィックスは省略 01. 疑似クラス：「:is()」「:where()」「:not()」記述をすっきりさせ…

折橋 廉
折橋 廉
2年前
4

【2022年版】Web制作に役立つチートシートまとめ【主に日本語】

Web 制作で困った時の強力な助っ人「チートシート」。 チートシートに関するまとめ記事は数多くありますが、内容が英語のものが多かったり、リンクが切れていたりと、なか…

折橋 廉
折橋 廉
2年前
24

IEを判定してアラートを表示

当サイトで配布するテンプレートは IE非対応 です。ですが、対策をしたいとお考えの方もいらっしゃるかもしれないのでその方法をご紹介します。 01. オーバーレイ表示上記…

折橋 廉
折橋 廉
2年前

アニメーション・エフェクトの個人的な探し方

先日、マシュマロを頂き、webテンプレートで使うアニメーションやエフェクトをどうやって見つけているのか、ご質問を受けました。 そこで、個人的にどうやってアニメーシ…

折橋 廉
折橋 廉
2年前
4

【Brackets】から【VS Code】に乗り換える

プログラミングのためのテキストエディタ「Brackets」は開発元である Adobe のサポート終了が、'21年 9月に決定しています。今後使うエディタに困っている人も多いのではな…

折橋 廉
折橋 廉
2年前
10
折橋 廉

折橋 廉

【WordPress】画像投稿で記事を自動生成

【WordPress】画像投稿で記事を自動生成

00. はじめにサイトの運営で一番面倒なことは、更新作業ではないでしょうか？　
更新履歴記事作成、アイキャッチの作成、フロントページでお知らせ、作品ページの詳細……。すべて手動で更新しなくても、ひな形さえ作ってしまえばほとんどは自動化が可能な作業です。

WordPress で個人サイトを構築するにあたって、サイトの記事を半自動で生成するオートプログラムを自作しましたので、それらについて共有できれ

もっとみる
折橋 廉

折橋 廉

【ChatGPT】プログラミングに活用するためのメモ

【ChatGPT】プログラミングに活用するためのメモ

00. はじめに個人的なメモとして、常時アップデートしていきたいです。
もしどなたかのお役に立つようでしたら、ご活用ください。

01. AIが質問を返すように設定01-01. 提示するプロンプト

上記のツイートを参照させていただきました。

02. AIをプログラマーに設定02-01. 提示するプロンプト

あとは、トリガーコマンド [###プログラミング開始###] を打てば、AIがプログラ

もっとみる
折橋 廉

折橋 廉

画像が表示されないときの原因と対策《mask, aspect-ratio》

画像が表示されないときの原因と対策《mask, aspect-ratio》

先日、「画像が表示されない理由」についてマシュマロを頂きました。

その際にフォルダのパスについてご案内したのですが、後から思えば他にも原因が思い当たったので補足です。
サンプルコードを載せるために記事を書きます。

01. 考えられる原因と対策① 原因１：ブラウザにHTMLをドロップしたローカル環境で見ている

CSS の maskを使用して画像表示している場合、通常のローカル環境ではクロスドメ

もっとみる
折橋 廉

折橋 廉

【2022年】近年のモダンブラウザ CSSハック

【2022年】近年のモダンブラウザ CSSハック

自分用に忘備録です。
近年実装されたものを中心にまとめました。

※ベンダープレフィックスは省略

01. 疑似クラス：「:is()」「:where()」「:not()」記述をすっきりさせる。

「:is()」

input[type="text"]:invalid,input[type="email"]:invalid,select:invalid,textarea:invalid { box

もっとみる
折橋 廉

折橋 廉

【2022年版】Web制作に役立つチートシートまとめ【主に日本語】

【2022年版】Web制作に役立つチートシートまとめ【主に日本語】

Web 制作で困った時の強力な助っ人「チートシート」。
チートシートに関するまとめ記事は数多くありますが、内容が英語のものが多かったり、リンクが切れていたりと、なかなか探すのが大変です。

そんな悩みに対応すべく、2021年版の最新のチートシート情報をまとめます。
普段筆者が使っているものから、今回記事を書くにあたって新たに追加したものまで、広くのジャンルのものを扱います。

※ 記事は 21.1

もっとみる
折橋 廉

折橋 廉

IEを判定してアラートを表示

IEを判定してアラートを表示

当サイトで配布するテンプレートは IE非対応 です。ですが、対策をしたいとお考えの方もいらっしゃるかもしれないのでその方法をご紹介します。

01. オーバーレイ表示上記のサイト様の記事でIEを判断してモダンブラウザへの移行を促すアラートを表示させる方法を紹介してくださっているので、ご参考下さい。

このままではエラーが出てしまったので、js の変更点を挙げます。

02. 変更点
`<span>

もっとみる
折橋 廉

折橋 廉

アニメーション・エフェクトの個人的な探し方

アニメーション・エフェクトの個人的な探し方

先日、マシュマロを頂き、webテンプレートで使うアニメーションやエフェクトをどうやって見つけているのか、ご質問を受けました。

そこで、個人的にどうやってアニメーションやエフェクトを見つけているのか、まとめていきたいと思います。

01. とりあえずブクマしておく
Twitter で「Webクリエイターボックス」様、「コリス」様、「Web Design Trend」様など、ウェブ関連のツイートをさ

もっとみる
折橋 廉

折橋 廉

【Brackets】から【VS Code】に乗り換える

【Brackets】から【VS Code】に乗り換える

プログラミングのためのテキストエディタ「Brackets」は開発元である Adobe のサポート終了が、'21年 9月に決定しています。今後使うエディタに困っている人も多いのではないでしょうか。

この記事は、そんな Brackets 難民の方向けに、「VS Code」に乗り換える方法をまとめます。
※ '21年 8月現在／windows 10 環境

※21.08.19　手違いで書いていた一万字

もっとみる