【WordPress】OGP設定のメモ。
WordPress化するときにいつも忘れるからメモしておく。もっと細く設定が必要かもだけど、必要最低限で。 headタグのとこに「OGP使いますよ」宣言。 OGP設定のコード トップページのときとそれ以外でタイトルやタイ...
HTML・CSSWebTips
HTML・CSSHTML・CSS「object-fit」で画像の表示を調整する
object-fitはimgにwidthやheightを指定して、画像を指定したサイズに合わせて表示の調整できる超便利プロパティ！なんとなく使っていたけどよく忘れるのでメモ。 どの画像も枠内に収まる「object-fit...
HTML・CSSGoogle Material Icons(マテリアルアイコン)の設定メモ
headに記述するコード（スタイルシートのリンク）や書き方をいつも忘れるのでメモしておく。 Google Material Icons Google Material Iconsのリンク Material Icons (...
WebTips【wordpress】記事投稿時に自動でpタグがつかないように(自動整形を無効化)する方法
はい、いつも忘れるからメモするシリーズです。投稿ページでちょっとhtmlいじりたいなー、classつけたいなー、っていうときに、投稿の親切に自動でつけてくれちゃう<p>タグが「今要らないー！」っていうことがあ...
WebTips【.htaccess】404ページ設定の記述メモ
いつものよく忘れるからメモシリーズ。.htaccessの404ページの記述を忘れるのでここにメモしておく。 以上！ ちなみにmacで.htaccessが表示されてない時の表示ショートカットキーは、 Macで.htacce...
HTML・CSS【JavaScript・jQuery】アコーディオンメニュー。アコーディオン内に下層のアコーディオンも実装できるよ
こんにちは、yukipanです。メニューやコンテンツがたくさんあるときにアコーディオンでギュッと凝縮できるの、便利ですよね。見たいところだけ開いてみてくださーい、みたいな。 CSSのみで実装できるけど、CSSはinput...
HTML・CSSふわっと浮き出てくるグローバルナビのハンバーガーメニュー
ちょこっと解説とサンプルページ 横とか上からスライドで出てくるメニューじゃなくて、ふわっと浮き出てくるハンバーガーメニューを作ってみた。 非表示のときは「opacity: 0;」だけじゃなくて、「right: -100v...
HTML・CSS【jQuery】文章が長いときのみグラデーションで隠して続きを読む・閉じるを表示
文章が長いときによくある「続きを読む」っていうやつ。一定の長さのときのみ「続きを読む」を表示させて、短いときは表示しないようにできます。jsの高さを調整すれば、ある程度表示させたい文章の長さを調整できる。 デモはこちら ...
HTML・CSSコピペで使えるcssアニメーション
コピペで使えるCSSアニメーションをメモしておきます。よかったらご自由にコピペして使ってください。 一文字ずつふわっと表示テキストアニメーション ※jQueryのCDNを先に読み込まないと動きません。 背景が幕のように上...
WebTipsWordPressの投稿したアイキャッチ画像をOGP画像に設定する方法
メモメモ。 参考サイト：https://rilaks.jp/wordpress/eyecatch-ogp/ 上記サイトが参考になりました。ありがとうございます。