【図解あり】marginとpaddingの違いを福岡一解りやすく説明します。
CSSを学ぶにあたって、理解不可欠なプロバティであるmarginとpaddingの違いを説明します。 大きな違いは要素(コンテンツ)の外側か内側の余白ということ 簡単に図で説明すると、borderの外側に余白を取るのがm […]
コーディング 【JS】要素をランダムに並び替えるのを福岡一わかりやすく解説します
ページを読み込んだ時に要素をランダムに並び替えるJavascriptの記述を紹介します。 HTML javascript その1 sort関数を使ってランダムに並び替えます。 その2 まとめ javascriptに関して […]
コーディング
【Modx】どの階層に属していてもトップ階層のIDを取得するスニペット
Modxで階層が深くなり、どの階層からでもトップ階層のIDを取得したいときに使用できるスニペットです。 スニペット名 get_the_top_parent_id 記述方法
コーディング
【JS】Animate.cssとwow.jsでサイトにアニメーションをつけるのが脳死レベルで簡単だったので福岡一わかりやすく解説します
初めて表示された時やスクロールしてコンテンツが表示された時に、回転したり左右から現れるなどのアニメーションをサイトに付与してユーザの興味を引きたい場合があるかと思います。 そんなときに、Animate.cssとwow.j […]
コーディング
【WP】Contact Form 7 add confirm – Contact Form7に確認画面を追加するプラグインを福岡一わかりやすく説明します
WPにおいて、お問い合わせフォームとして最も使われているプラグイン「Contact Form7」に確認ステップを追加するプラグイン「Contact Form 7 add confirm」が便利過ぎたのでご紹介します。 特 […]
コーディング
【WP】WContact Form DB – Contaform7の送信データが保存できるプラグインを福岡一わかりやすく説明します
Contact Form DBは、お問い合せフォームプラグインContaform7からの送信データをデータベースに保存し管理できるプラグインです。フォームから送られてたデータをデータベース上にも保存しておき、管理画面から […]
コーディング
WordPressで固定ページやカスタム投稿に投稿と同じカテゴリーを設定できる方法を福岡一わかりやすく解説します。
固定ページやカスタム投稿にカテゴリーを付与する場合、基本はタクソノミーを使用すると思います。ですが、それだと記述が増えたりプラグインを使ったりしなければならず手間がかかります。そんなあなたのためにコピペで楽に実装できるコ […]
コーディング
「コピペOK」答えが隠れているシンプルなFAQをCSSとjqueryで作ったので福岡一わかりやすく解説します
企業や大学の研究室のホームページでは、たまにFAQを設置したいという要望があると思が、FAQの数が多すぎるとページが冗長してしまうことがあります。そんな時にコピペで簡単実装できる、最初は非表示だけど質問をクリックすると回 […]
コーディング
WP Queryクラスを使って投稿/固定ページ/カスタム投稿のループを福岡一わかりやすく解説します。
ひと昔前は、query_post,get_postやget_page関数などを使ってサイドバー等に一覧を表示していました。ですが、WP Queryクラスを使うことによってパラメータを変更するだけで、投稿/固定ページ/カス […]
コーディング 怠けたい人必見！短い手間で実装できるWordPress小技テクを福岡一詳しく解説します。
WPはプラグインを導入してしまえばほとんどの機能が実現できますが、プラグインを導入することで不具合を起こしたり、英語のインターフェイスでわかりにくかったりします。なのでそんなときに実際の現場でよく使われ、短い手間で実装で […]
コーディング
[2016年版]本当に制作現場で使われているjquery/jsで作られた画像スライドショー・スライダー 4選
2016年でも多くのサイトでトップページには、複数の画像をスライドショー形式で表示する表現が取り入れられていると思いますが。ですが、Webの進化ともにレスポンシブ対応であったり、様々な表示方法が求められるようになりました […]
コーディング Jqueryを使ったカレンダープログラム（3色色付け）を福岡一わかりやすく解説します。(自分なりに)
ECサイトや実店舗のWebサイトにおいて、カレンダーを表示して店休やそのほか、日付を色付けしてなにかしら伝えたい時があるかと思います。 そんなとき、Jqueryを使ったカレンダープログラムを使って簡単に実装できる方法をご […]
コーディング