jQueryライブラリmodal-videoのコピペでできるYouTubeやvimeoの動画モーダル
モーダルは、そのウィンドウに集中することができるメリットとデメリットを併せ持つUIで、限られた強制力が強くユーザーにストレスを与える可能性がありつつも、便利なUIです。 いざ実装しようと思う場合、HTMLとCSSのみで実 …
HTMLとCSSのコピペでできる横に長い表のデザインスニペット
HTMLのtableタグを使うことで、簡単に表を作成することができ、検索内容によっては強調スニペットにtableで記述された表が表示されるなど、未だに使えるHTMLタグの一種です。 今回は、HTMLとCSSのコピペででき …
HTMLとCSSのコピペでできるパソコンやブラウザデザインのスニペット
世の中には驚愕の技術で、HTML・CSSの手書きコードだけで美しい絵を作り出す職人がいたりします。 CSSで作成したとは信じがたい絵で、ここまで表現するにはかなりの技術を知識が要求されると思いますが、事実HTMLとCSS …
jQueryライブラリDrawerのコピペでできるドロワーメニュー
jQueryライブラリのDrawerは、スマホでよく見かける「ドロワーメニューを簡単に実装できるプラグインで、WordPressのテーマにも導入することが容易でできます。 今回は、jQueryライブラリDrawerのコピ …
jQueryライブラリの定番、slickのコピペでできるスライダー・カルーセル
jQueryライブラリの定番とも言えるslickは、スライダー・カルーセルを簡単に設置できるライブラリです。 HTMLとオプションの値を指定して細かい動きも指定して制御することができ、本当に便利なライブラリです。 今回は …
コピペでできるHTMLとCSSの背景と基本のデザインテンプレ
要素にCSSの background を使って要素の背景を色々いじることができますが、使いこなして出来た背景のパターンを見るだけでも圧倒されます。 上記のようなゴリゴリの背景の作り方ではなく、基本的な部分とコピペでできる …
コピペでできる左右に固定表示されるバナーとソーシャルブロック
WEBサイトを見ていると、記事投稿者のソーシャルアカウントへのリンクや、広告が固定で表示されるサイトを見かけます。 固定表示される為、ユーザーの可読性を阻害するリスクがありますが必ずと言っていいほど目に入るので、見せたい …
条件分岐タグ
WordPressには、条件によって処理を変えたり、値によって処理したりしなかったりするための「条件分岐」のタグがたくさん用意されています。 目次単一の条件に合う場合出力単一の条件に合った場合と合わない場合にそれぞれ出力 …
jQueryライブラリFotoramaのコピペでできるYouTubeや画像のギャラリースライダー
Fotoramaは、比較的昔からあるjQueryの画像ギャラリーのライブラリです。 WEBサイトのスライダーは、同じjQueryライブラリのslickが汎用性が高く、よく使われているのをよく見ますが、Fotoramaも簡 …
コピペでできるテーブルにソート機能を実装するjQueryライブラリtablesorter
XHTML・CSSが普及するまではテーブルレイアウトが一般的でした。 テーブルレイアウトは、tableタグを使って格子状にレイアウトしていく手法で、自分もWEBデザインを始めたての2000年頃はこのレイアウトで組む事が一 …