WEBの仕事– category –

Figmaの設定画面の開き方や、アカウントに登録しているメールアドレスの変更方法をまとめました。 また、Googleと連携させてアカウントを作った場合、通常の方法では別のメールアドレスに変更できないので、そちらの変更方法もまとめています。 【Figmaの...

Webサイトに、そのページをLINEやTwitterなどで共有する機能を作ることがありますが、「LINEとか使ってないから他の手段も作って」と言われることもあると思います。 「メールでシェアする」「メールで共有する」のようなボタンを作って、 クリックしたら...

アンカーリンク（aタグ）を使って、メニューや目次からページ内の特定の場所にジャンプさせることってよくありますよね。 ところがそれにloading="lazy"などの遅延読み込みを組み合わせると、ジャンプ先がずれてしまいます。 ランディングページでどうして...

tag.phpなどのタグのアーカイブページで、該当タグがついたカスタム投稿記事を表示させたい！ でもなぜかうまくいかない…と行き詰ってしまった時に解決した方法です。 うまくいかない原因は様々ですが、同じように困っている方は下記の設定がきちんとでき...

カスタム投稿のカテゴリー（タクソノミー）を取得して、メニューやサイドバーに各タームをリスト表示する方法です。 トップや一覧ページ、記事詳細ページで取得・表示させたいWP管理画面でカテゴリーを追加したり削除したときにも対応させるリンクあり／な...

HTMLとCSSのみで描画する、動く矢印のアニメーションサンプルです。随時追加予定。 スクロールして要素が出現してからアニメーションを開始させたいときは、jQueryも追加します（後半に記載）。 【棒線のみのスタイリッシュな矢印（文字つき）】 See the P...

tableの横幅をパーセントで指定し、同じ横幅のdiv要素を下に並べたとき、微妙に横幅が揃わないことがあります。 ずれる原因は、ブラウザによってtableのサイズが小数点以下で切り捨てられてしまうため。 （例）スマホのとき、横幅92%指定…tableは380px、di...

WordPressでthe_excerpt()関数を使うと、文末に[...]をつけて投稿記事の抜粋文を表示してくれます。 その抜粋の文字数を自由に変更して、かつスマホとPCそれぞれ別の値を設定したい時の書き方をまとめました。 【まず「WP Multibyte Patch」の有効化】 the...

次世代フォーマットの画像の1つであるWebP（ウェッピー）をサイトで表示させ、SafariやIEなどの非対応ブラウザでは代替画像を表示させる方法をまとめました。現在主流の書き方は、大きく分けて2つあります。 【方法1 pictureタグで柔軟に切り替える】 <...

自宅で本格的にリモートワークを始めることになった！ パソコンを使って副業を始めたい！ そんな時、必ず必要になってくるパソコンデスク。 自宅に座卓しかなかったり、机はあるけど小さくて不便だから新しく購入しようと思っている人向けに、私の思う「在...