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

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

コピペしちゃいなよ

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

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

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

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

CSS HTML JavaScript

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

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

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

AFFINGER WordPress

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

2025/6/12    ホームぺージ関連

「続きを読む」を押すと下にサッと文字が出てくる処理の実装です。 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/5/24    ホームぺージ関連

振り向きねこちゃん 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 プラグイン

[SyntaxHighlighter Evolved]でコードを簡単に表示させる

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

[SyntaxHighlighter Evolved]プラグインを使って簡単にコードをホームぺージ上に表示することが可能です。 通常[pre]を使って表示させると思いますが、うまくいった試しがないし空 ...

WordPress プラグイン

[canvas]要素の上にHTML記載で文字や画像を載せる方法

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

[canvas]要素の上にHTML記載で画像や文字を入れたい場合の処理です。[position: absolute;]で可能です。 今回は「パーリンノイズ」というものを[canvas]に表示させ、その ...

CSS HTML JavaScript ライブラリ

サイトを見るときにツールバーの表示を消す(ワードプレス)

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

ダッシュボード、左にある「ユーザー」→「プロフィール」から「サイトを見るときにツールバーを表示する」のチェックを外す これなぜかいつも思い出せないので記載することにしました。 参考サイト：https: ...

WordPress

« Prev 1 … 4 5 6 7 Next »
  • Post
  • Share
  • Pocket
  • Hatena
  • LINE
  • URLコピー

管理人の声

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

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

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

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

サイト内検索

最近の投稿

  • 矢印付きスケジュールをタイムライン形式で作る方法
  • 【第8回】PHPで「関数」を作ってコードをスッキリさせよう！
  • 【第7回】入力はちゃんとチェックしよう！フォームのバリデーションと複数項目の処理
  • 【第6回】ユーザーの入力を受け取ろう！はじめての「フォーム連携」
  • 【第5回】たくさんのデータをまとめて扱う！PHPの「配列」入門

ランキング

  • 本日
  • 週間
  • 月間

  1. 【リボンコピペ】リボンの文字が入った可愛い文字列をご紹介

  1. レスポンシブデザインに挑戦！画面サイズに応じてカラム数を変化させる方法

  2. no image

    鍵ページ

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

  1. レスポンシブデザインに挑戦！画面サイズに応じてカラム数を変化させる方法

  2. no image

    鍵ページ

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

最近のコメント

    アーカイブ

    • 2025年6月
    • 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 コピペしちゃいなよ