CSSでヘッダー（ナビゲーション）を上部に固定させる方法

今回はCSSを使ってスクロールしても常に上部にヘッダー（ナビゲーション）を表示させる方法をご紹介します。まずはデモページを確認します。デモサイト重要な動線を常に画面上部に固定で表示させておくことで、サイト内回遊率を…

jQueryで切り替えタブの作り方

今回はページを遷移せず、jQueryでタブの切り替えを行う実装を紹介します！まずはデモページでこれから作るものを確認します。デモサイト【切り替えタブの作り方】HTML編解説です。（わかる人は読み飛ばしOK）まず…

ワードプレスでは投稿すると自動で投稿日と指定したカテゴリーを表示してくれます。日時別やカテゴリー別で表示させたい時に便利です。投稿の日付を表示する方法ワードプレスで投稿日を表示するには、get_the_date()…

前回は独自のテーマを作成するための準備を行いました。今回は投稿した記事をループ処理で表示させていきます。投稿記事一覧を表示させる投稿記事を作成まずはワードプレスの管理画面から投稿＞新規追加で表示させたい記事を作成…

今回は既存のワードプレスのテーマは使用せず、独自のデザインでサイトを構築していきます。まずはテーマをを作るための準備をしていきます。 WordPressでオリジナルテーマを作成するワードプレスは通常サーバーにあげなけ…

WordPressは通常サーバーにあげないと動きませんが、MAMPを使うことで、自分のパソコン上でWordPressを動かすことができます。サイトの改修やWordPressのテーマ作成の際に大変便利です。レンタルサー…

パララックス（parallax）は直訳すると視差という意味です。スクロールすると同時に次のコンテンツが覆いかぶさるような、不思議な動きをし、奥行きやストーリー性を出してくれる効果があります。今回はそんなパララックスサ…

サイトを開いた時に、いきなりトップページが表示されるのではなく、まずはロゴがふわっとフェードインしてからトップページが表示されるサイトがありますよね。美容サロンや旅館のサイトでよく使われていて、優しく柔らかい印象を与え…

ワードプレスでcssファイルとjsファイルを読み込みたいのに上手く読み込めない。。なんで？？こんな疑問に答えます。推奨されているやり方まずはじめに、ワードプレスからcssファイル、jsファイルを読み込むには<…

今回はECサイトなどでよく見かける、複数商品を一気にスライドさせる方法を紹介します。世の中には様々なスライダーのプラグインがありますが、今回はその中でも最も汎用性が高く、オプション設定も豊富な「slick（スリック）」…