flexboxで幅固定と幅可変の横並びを実装する
メインコンテンツを可変、サイドバーを幅固定のレイアウトをflexboxで実装しようとした際に少し迷ったのでメモ。...
Movable TypeでブログIDを変数で管理する
Movable Typeのテンプレート内でブログIDなどを指定することがありますが、同じコードでテスト環境を用意しようと...
スタイルガイドジェネレーターの「Fractal」でpugを使用する
fractalのコンポーネントでpugを使う方法をメモ。 環境は以前投稿したgulpを使った環境をベースにします。...
tableの幅を変更できるプラグイン「jQuery Resizable Columns」を使ってみる
tableの列の幅をドラッグで変更させたいことがあったので、jQueryプラグインの「jQuery Resizable ...
Adobe XDでアセットを書き出す
Adobe XDで作成したデザインで画像を書き出すことがあったので、書き出す方法をメモ。...
Movable Typeの記事一覧で全記事表示する
Movable Typeで記事一覧を表示する際、全記事を表示する方法をメモ。...
「WordPress Colorbox Lightbox」を使ってみる
WordPressの投稿でライトボックスを簡単に設定できるようになるプラグイン「WordPress Colorbox L...
背景画像を中央からずらして配置する
CSSで背景画像を右や下の位置から指定する方法は以前記事にしましたが、中央位置から指定しようとしてうまくいかないようだっ...
Google Maps APIで特定の範囲をマップ内に収める
Google Maps APIで指定した複数のマーカーをマップ内に収める方法を調べたのでメモしておきます。...
svgをimgタグで埋め込んだ際にchromeで表示されない
Photoshopでsvgを書き出してimgタグで埋め込んだ時に、chromeでだけうまく表示されない不具合に遭遇したの...
Pugでmixinを使用する
Pugでmixinを使用する方法をメモ。...
スタイルガイドジェネレーターの「Fractal」をgulpで使ってみる
スタイルガイドジェネレータの「Fractal」をgulpで使用する方法をメモ。 Fractalの使い方については以前投稿...
jQueryで実装したキーワード検索にページ送りを追加する
以前jQueryを使ってキーワード検索の機能とページ送りの機能を実装しましたが、今回はその2つを組み合わせてみます。...
SearchWP Live Ajax Searchを使ってみる
WordPressの検索フォームで検索結果を動的に表示できるプラグイン「SearchWP Live Ajax Searc...
Movable Typeで複数のサイトの記事をまとめて一覧表示する
Movable Typeで複数のサイトのブログやコンテンツデータをまとめて表示する方法を調べてみました。 Movable...
flexboxで要素数に関わらず均等幅で横並びにする
flexboxで要素を改行なしで横並びにした際に、要素数に関わらず均等幅にしたいということがあったので、実装方法をメモ。...
スタイルガイドジェネレータの「Fractal」を使ってみる
スタイルガイドジェネレータの「Fractal」を使う機会があったので、使用までの流れと使い方をメモ。...
jQueryでページ送りを実装する
jsonなどの情報を使って一覧表示をした際に、ページを分割してページャーで切り替えられるようにする処理をjQueryで実...
flexboxで横並びにした要素内でheight 100%がiOSで効かない
flexboxで横並びにした要素内でheight 100%を指定した際、iOS10で効かないということがあったので対応方...
pタグの中にdivタグは入れられない
pタグの中にdivタグを入れられないのは把握していたのですが、きちんと確認したことがなかったので試してみました。...