note

web制作

Contact Form 7 送信完了画面とサンクスページ

送信完了メッセージ 初期状態では送信完了後、フォームの下に送信完了のメッセージが表示されます。こちらの表示をフォームより上部に表示させるには、フォームの設定画面でというコードを表示させたい場所に入れることで可能です。 送信完了後はフォームを...
web制作

faviconの設定

faviconにはicoファイルが推奨されていますが、実はpngやsvgでも設定できます。しかもsvgファイルであれば、ダークモードの設定も可能です。IE未対応ですが、pngファイルを代替えで設定すれば大丈夫のようです。 <link rel...
CSS

バラバラなサイズの画像を同じサイズにして表示する方法

サイズがバラバラな画像をスライダーなどにして同じサイズで表示させたいことがあったので、いろいろと検索してみました。 実際は思った表示にはならないのですが、イメージに近い表示になりました。 できるだけ同じようなサイズの画像でやることがベストで...
CSS

ページ内のリンク位置の調整方法

headerをfixedにしてしまうと、ページ内リンクのTOPがheaderの下に隠れてずれてしまうため、リンク先ボタンを押したときに表示がおかしくなってしまう現象を経験したことはないでしょうか? 検索してみるとこのページに回答がありました...
PHP

WordPressの数値をカンマ付きにする

カスタムフィールドで数値入力したものを、カンマ付きにする場合、こちらの number_format() という関数を使うと簡単でした。 詳細はこちらのサイトに記載があったのでご参照ください。 結論から言うと、下記コードで表示できます。 <?...
web制作

formまわりのカスタマイズ

お問い合わせ等で利用するformですが、ブラウザのcssが適応されるのでデザインに合わせてCSSでカスタマイズするサイトをいろいろ集めてみました。 下記サイトで大体のデザイン変更が可能かと思います。 まとめて記載 フォーム周りで覚えておくと...
web制作

z-indexが効かない時

先日、z-indexが効かずに調べていると、こちらのサイトにて試してみてくださいとあったpositonの指定をしてみたところ、表示されるようになりました。 psitonの属性はstatic以外ということです。 とても単純ですが、なかなかと躓...
web制作

アコーディオンのCSSをいろいろ集めてみた

制作を早くするために、独自でHTMLやCSSをパーツごとに保存している方も多いと思いますが、以下のようなサイトでデザインに合わせて修正する手もあります。新しい手法も見ることができますし、自分と違う作り方の勉強にもなります。また、いろんなデザ...
web制作

ブラウザサイズ変更時の挙動

サイト制作中にレスポンシブの確認でブラウザのサイズを変えることがありますが、jsの関係か画像サイズがレスポンシブについてこれいないという現象に直面。通常、あまりブラウザのサイズを変えたりすることはないと思われますがちょっと気持ち悪いので、何...
mail

メーラーにGmail設定する

Thunderbirdでつまずく 新しいパソコンを買ってメーラーにGmailを設定しようとして設定できずにつまずいたので、いろいろ調べたところ簡単な設定で解決できました。おそらく、他のメーラーでも設定できない方は以下の方法で設定可能かと思い...