arrow-left arrow-right envelope facebook feedly folder home html-tag person tag twitter wordpress rss user get-pocket envira google-plus

[Bootstrap]Justified navのハンバーガーボタンを非・・・

ささっとサイトを作りたい時に、自分で作ったスニペットかBootstrapなどのフレームワークが現時点での私の選択肢になります。先日Bootstrap4のJustified navテンプレートを使ってデモ画面を作成した時にCSSを少しいじくりました。簡単なことなのですが、備忘録として残しておきます。

続きを読む

[Bootstrap]クリックした画像を浮かび上がらせる ー モーダルウ・・・

Bootstrapの機能の一つモーダルウィンドウを紹介します。“モーダルウィンドウ”で検索をかけると実に様々な方法やスクリプトがあり、Webサイトに動きをつける機能の中で最も古い部類に入るものです。「レイアウトの都合上小さく埋め込んだ画像を詳しく見せたい、目に一緒に入ってくるテキストを一旦隠して画像だけ見せたい」時などに適しています。

続きを読む

BootstrapでWordPressテーマを作ろう!vol.3

前回はindex.phpのカスタマイズまで行いました。今回は投稿ページ、固定ページ、サイドバーの作成について説明します。ここまでで大体のWordpressの機能が揃います。投稿ページと固定ページはindex.phpから作成するので、意外とあっという間です。早く仕上げて細かなレイアウトに取り掛かりたいところです。

続きを読む

BootstrapでWordPressテーマを作ろう!vol.2

テーマ開発に関連した説明を挟みましたが、再開します。前回Initializerで見た目のひな形を作り、ヘッダーとフッターをindex.phpから分割までを行いました。今回は投稿一覧となるindex.phpのカスタマイズについて説明します。 レスポンシブデザインに対応したBootstrapのグリッドシステムの仕組みと、Wordpressのループという概念について触れていきます。

続きを読む

BootstrapでWordpressテーマを作ろう!vol.1

Bootstrapを使ったWordpressのテーマについて説明していきます。HTMLとCSSのテンプレートを使って文書構造や見栄えについて手間をかけずにオリジナルテーマ最初の一歩を踏み出すのが今回の概要です。Wordpressの動き方や、どのようにWordPressの機能を設定していくのかを一緒に見ていきましょう。

続きを読む

PAGE TOP