親要素の幅を中身に合わせるなら fit-conetnt

レスポンシブでコーディングしていると「中身に合わせて幅はが可変するブロック要素」なんて都合のいいことを求める場合が以外と多い。当然面倒になるが子要素にもう１つ要素をかませてなんとかしていた。 こん...

ブロックエディタでコードの崩れを何とかする

どうもあんまり好きになれないブロックエディタだが、今後の事も考え単純な工程のものは使うようにしている。 ただうっかりクラッシックエディタの時の感覚で、まんま入力するとコードがメタメタになってしまい...

さくらサーバーが早くなったみたい

老舗のレンタルサーバー「さくらサーバー」が新サーバーを導入した。 自分も長い間レンタルしているけれど、ようやく移行出来るようなったので早速試してみた。 今までの懸念点は払拭出来たのか興味津々である。

ブロックエディタを解除する。クラシックエディタがいい

ver5.0からメインエディタとして使われ初めた「ブロックエディタ」。 バージョンごとに改良されているようなのだが、すべてのサイト編集にピッタリ！・・・と言う訳にはいかない。 なので旧エディタ「クラシッ...

PHPでユーザーエージェント判定

通常スマホかPCか判定するのはjavascritpでuseragentなんか取得して行うのが常。 とある案件でスマホとPCでデザインを変えるという条件があったので、安易にその方法を使ったら…プラグインのコードとバッティン...

今どきのスムーズスクロール「ページトップに戻る」

画面の下に固定されていて、クリックするとスルスルとページ上部に戻るヤツとかページ内リンクとか。 このスルスルとページの上下移動はJS頼りで・・・なんてやらなくともCSSだけで出来ちゃう。 とても簡単なん...

記事の有無でリンクを表示

サイト内のナビゲーションリンクを表示する時、自動的に有無を判断してリンク先を出したい。 こうすることでクライアントが新規記事を追加しても勝手に表示されるし、デッドリンクも防げる。 単純なことなんだ...

PageSpeed Insights で100点を目指す

当サイトも試行錯誤しながらホームページの高速化を図っていたが、ようやく納得レベルになった。 それまで「wordpress 高速化」なんて検索して、有効な情報を得ながら試してみた訳だが90点までが限界。 個人的...

CSSのfilterで影を付けたりぼかしたり

ちょっとした装飾で、いちいち画像加工ソフトを使うのは面倒！ 況してや元画像がアップしてあるのに追加しなければならないなんて無駄この上ない！ なんて時にとっても便利なCSS関数がある。（と言うのをすぐに...

CSSの比較関数で最小値、最大値を指定する

レスポンシブが当たり前の今、四苦八苦してたのがフォントサイズ。 他の部分は比率で管理出来ても、この部分だけは細かくメディアクエリで分けることをしていた。 レスポンシブにありがちの幅伸縮で「ガクッ」...