本サイトについて
鍵ページ

お仕事で使うHTMLテクニック備忘録

本サイトについて
鍵ページ

HOME >
2024年 >
12月

月別アーカイブ：2024年12月

: Splideを使ってスライダーを実装しよう

2025/1/11 ホームぺージ関連

Splideという日本産のライブラリがあるようなのでこちらを使ってスライダーを実装したいと思います jQueryを使わないという点が私は気に入っております。参考サイト：https://ja.spli ...

CSS HTML JavaScript ライブラリ

: トップページだけにCSSを反映させたい場合の記述方法

2025/1/5 ホームぺージ関連

どうもうちのアフィンガーちゃんトップページのmainがおかしいもよう… ちゃんと直すべきだが原因がわからないので、トップのmainだけpaddingを0にして応急処置を施したいどうやら先頭に[.ho ...

CSS HTML WordPress

: 文字を一文字ずつフェードインさせながら要素のバックカラーを伸ばす処理(JavaScript)

2025/1/11 ホームぺージ関連

文字を一文字ずつフェードインさせる処理の改良版になります。一応自作ですので不具合等あるかも知れません。 JavaScriptを使って表現しております。またテキストが見え始めたら処理するようにもしてお ...

CSS HTML JavaScript

: 文字を一文字ずつフェードインさせる処理(JavaScript)

2025/1/5 ホームぺージ関連

文字を一文字ずつフェードインさせる処理です一応自作ですので不具合等あるかも知れません。参考サイトも見つけましたのでそちらの方がよいかも知れません。 JavaScriptを使って表現しております。また ...

CSS HTML JavaScript

: アフィンガー6でトップページ以外でサイドバーに表示されてしまう「新着記事一覧」を非表示にしたい

2025/1/5 ホームぺージ関連

アフィンガー6でトップページ以外でサイドバーに表示されてしまう「新着記事一覧」を非表示にしたいと思ったウェジェットで消してるのになぜか表示されるので調べたら別の所で表示設定があったので忘れないように ...

AFFINGER WordPress

: 「続きを読む」を押すと下にサッと文字が出てくる処理(JavaScript)

2025/1/5 ホームぺージ関連

「続きを読む」を押すと下にサッと文字が出てくる処理の実装です。 JavaScriptを使って実装させております。文章はChatGPTに頼んだ… JavaScriptの[offset_height]は ...

CSS HTML JavaScript

: 画像にリボンをつけよう

2025/1/11 ホームぺージ関連

画像の左端にリボンを付けておしゃかわにしましょう Cat 参考サイト：https://adatype.co.jp/info/archives/staff_blog/24

CSS HTML

: 画像サイズがバラバラだがすべて均一に綺麗に表示させたい場合

2025/1/11 ホームぺージ関連

例えば商品一覧など横並びに4つ並べて表示させたい場合しかし用意された画像が全部バラバラで統一してくれないそんな場合の処理になります。 imgタグのクラスに「img-fit」を追加して対応しておりま ...

CSS HTML

: Animate It!を使って動的なアニメーション再生をしよう

2025/1/11 ホームぺージ関連

ある程度コンテンツが見えたら、フェードインして表示させたい。しかしそれだとCSSだけで実装できないし、JavaScriptはわからない。そんな場合「Animate It!」と言うワードプレスプラグ ...

HTML WordPress プラグイン

: スマホ・タブレットにて横向きにしてサイトを見られたくない場合の処理

2025/1/5 ホームぺージ関連

サイト作成していると横向きで見られたくない(対応が面倒)な時があります。横向きになった場合に、ウィンドウを出して「横向き対応してません」と表示して見せないようにします。本ページでは実際に横向きにし ...

CSS HTML JavaScript

: 変数でフォントサイズ等の情報を一括管理するCSS変数（カスタムプロパティ）

2025/1/5 ホームぺージ関連

CSSにてフォントサイズを修正する時に一括で変えたい時があると思います。 CSS変数（カスタムプロパティ）というのがあるのでそれを使います参考サイト：https://qiita.com/taqumo ...

CSS HTML

: absoluteで上下左右中央表示する

2025/1/5 ホームぺージ関連

absoluteで上下中央表示する。いつも調べてコピペしてるのでこちらでも記録しておくことにする参考サイト：https://qiita.com/ushi_osushi/items/d9f0c899 ...

CSS HTML

: PCだけスマホだけ表示させたい場合

2025/1/5 ホームぺージ関連

PCだけスマホだけ表示させたい場合があります。 iPad min未満をスマホ表示として表示させたいという感じで処理を書いてます参考サイト：https://csshtml.work/sp-displa ...

CSS HTML

: アフィンガー6のヘッダーコンテンツに動画を入れたい場合

2025/1/11 ホームぺージ関連

アフィンガー6のヘッダーコンテンツに動画を入れたい場合の覚え書き。どうやらEX版では簡単に実装できるようですが、EX版は持ってないのでPHPとCSSをいじることで実装します。 PCとスマホ対応のみし ...

AFFINGER CSS HTML

: [LeaderLine]JavaScriptで要素間を線でつなげるライブラリ

2025/1/5 ホームぺージ関連

要素間を線でつなげるライブラリになります。お仕事で使うことがあったので忘れないように記載参考サイト：https://anseki.github.io/leader-line/

CSS HTML JavaScript ライブラリ

: 画像を横に無限ループさせる方法(JavaScript)

2025/1/11 ホームぺージ関連

画像を横に無限ループさせる処理をJavaScriptで実装します。自作なので色々と不具合等あると思います。 [animation]を使わないのはなぜかと言うと、画像が表示されない（存在はしてる）状態 ...

CSS HTML JavaScript

: 横幅と連動して文字のサイズを変更するようにしよう

2025/1/5 ホームぺージ関連

横幅と連動して文字のサイズを変更するように調整します。条件として各フォントサイズの指定は「REM」で指定することが必須になります。また、文字が大きくなりすぎないように、小さくなりすぎないように、「 ...

CSS HTML

: 自作でホップアップ処理を作る

2025/1/11 ホームぺージ関連

振り向きねこちゃん Creator Name: ふゆラインスタンプ寝そべりねこちゃん Creator Name: ふゆラインスタンプどすけべねこちゃん Creator Name: ふゆライン ...

CSS HTML JavaScript

: 【WordPress】自動で挿入される＜p＞タグや＜br＞タグを無効化する方法

2025/1/5 ホームぺージ関連

仕事をしていると謎の改行やpタグが入りデザインが崩れることがよくあります。今まではCSSで誤魔化してましたがいい加減邪魔になってきたので無効化することにしております。ただ[br]も無効化されるのが ...

PHP WordPress

: [FileBird Lite]を使ってメディアファイルをフォルダ分けしよう

2025/1/5 ホームぺージ関連

[FileBird Lite]プラグインを使ってメディアファイルをフォルダ分けします。メディアファイルの数が多くなると管理が大変になりますが、フォルダ分けをすることで管理が楽になります。参考サイト ...

WordPress プラグイン

1 2 Next »

管理人の声

PHPの記事を増やします(*'ω'*)
初級試験受けるつもりです。C言語基礎できるので余裕と思ってますがどうなんですかね(*'ω'*)
本も買いましたがまだ届いてない(4/20)

クラシックエディタ用のプラグインを作ってみた(ver1.4.1) 公開中

クラシックエディタでコード入力をするボタンを追加するプラグインを作ってみた(ver1.0) 公開中

Amazon納品代行 FBA商品ラベルにJANコード下4桁を入れるアプリ(簡易版)を作ってみた

サイト内検索

最近の投稿

【第8回】PHPで「関数」を作ってコードをスッキリさせよう！
【第7回】入力はちゃんとチェックしよう！フォームのバリデーションと複数項目の処理
【第6回】ユーザーの入力を受け取ろう！はじめての「フォーム連携」
【第5回】たくさんのデータをまとめて扱う！PHPの「配列」入門
【第4回】何度もくり返したい！PHPの「繰り返し（ループ）」入門

ランキング

本日
週間
月間

ワードプレスのクラシックエディタにて[Tab]キーを押したら空白が入る様にする方法

ワードプレスのクラシックエディタにて[Tab]キーを押したら空白が入る様にする方法
画像を横に無限ループさせる方法(JavaScript)
スクロールでぼけた画像が元に戻る！スムーズなぼかしアニメーションの実装方法

ワードプレスのクラシックエディタにて[Tab]キーを押したら空白が入る様にする方法
画像を横に無限ループさせる方法(JavaScript)
スクロールでぼけた画像が元に戻る！スムーズなぼかしアニメーションの実装方法

最近のコメント

アーカイブ

2025年4月
2025年3月
2025年2月
2025年1月
2024年12月

カテゴリー

AFFINGER
CSS
HTML
JavaScript
PHP
Windows
WordPress
アプリ
カメラ
プラグイン
ライブラリ
作業効率
写真
雑談

タグ

HTML中級者講座 HTML初心者講座 JavaScript入門 PHP初心者講座その他カメラ・写真関連ホームぺージ関連失敗と経験

おすすめ記事

1: クラシックエディタ用のプラグインを作ってみた

制作理由ワードプレスのクラシックエディタを直接使っているといつも思うことがありました [Tab]キー押して空白入れて見やすくインデントしたい！この記事を書くまでは入れないか、スペースキーを押して誤 ...

2: クラシックエディタでコード入力をするボタンを追加するプラグインを作ってみた

制作理由ワードプレスのクラシックエディタを直接使っているといつも思うことがありましたコード追加ボタンを自由に追加出来たら便利じゃない？この記事を書くまでは、クリップボード貼り付けアプリ[Clib ...

3: Amazon納品代行 FBA商品ラベルにJANコード下4桁を入れるアプリ(簡易版)を作ってみた

アプリ制作するに至った理由納品代行の仕事をしていて思ったことがあります納品代行をしていると本当に様々なお客様から様々な商品が届きますその中でも特に注意しているのが、「見た目ほぼ同じだけど違う商品 ...

アフィリエイト

お仕事で使うHTMLテクニック備忘録

© 2025 コピペしちゃいなよ