画像やテキストといったコンテンツをスライドではなく無限スクロールで表示したい時は、jQueryプラグインの「」が便利です。 ここでは、「infiniteslide」をダウンロードするところから、実際にサイトに適用するまでの一連の流れを紹介していきます。 「infiniteslide」について 「infinitesl...

WordPressでは、特定のページでのみ処理を振り分ける関数が用意されています。 ここでは、それらの関数を用いて、について見ていきましょう。 特定のページ限定で処理を行う記述方法 トップページ限定で処理を行う記述 トップページ限定で処理を行う時は、 「」「」を使います。 「is_home」「is_front_p...

WordPressでは、アイキャッチ画像を追加する機能がサポートとしてついています。 投稿スラッグを指定して「」を付与することで、指定した記事タイプでのアイキャッチ画像の登録ができるようになります。 function.php アイキャッチを追加するプログラム ...

WordPressでは、WEB初心者でも簡単にナビゲーションメニューをカスタマイズできるように、標準でが付与されています。 ただし、これは機能が最初から付いているだけなので、有効化を行わない限りはメニューカスタマイザーを利用することができません。 ここでは、メニューカスタマイザーを有効化して使えるようにする方法を紹...

WEB制作の際によく実装する、使い勝手の良いキャプションエフェクトを紹介します。 これらのエフェクトはすべてCSSで実現可能です。 キャプションエフェクトサンプル マスクをかけるエフェクト キャプションをここに表示キャプションをここに表示キャプションをここに表示 HTML CSS マスクをかけた後にテキストを左か...

PHPで動的に取得した値をCSSに反映させたい時、そんな時は、PHPファイルにCSSを記述することで、CSSにPHP変数の値を埋め込んで動的に組み込ませることができます。 【STEP1】CSSをPHPファイルに記述する まずは適当にPHPファイルを作りましょう。 PHPで変数を定義し、echoでスタイルシートを出力し...

WordPressでは、標準で「」というカラーピッカーが用意されています。 これを使うことにより、従来よりも簡単にカラーピッカーを使った値の設定ができるようになります。 実際にカラーピッカー「wp-color-picker」を使う手順は以下のとおりです。 【手順１】カラーピッカー定義用jsファイルを用意する カラー...

WordPressでWEBサイトを作る上で、パスの取得メソッドを参照する機会がたくさんあります。 ここでは、よく使うサイトのURLやファイルパスを取得するパス取得メソッドについて見ていきましょう。 ページのアドレスを取得するパス取得メソッド トップページのURLを取得する 現在のページのURLを取得する 投稿者...

ページ内リンクを使う時に一瞬でリンク先に飛んでしまうと、サイトのデザインコンセプトに合わない場合があります。 そんな時は、スクロール移動させると良いでしょう。 これができると、ふんわり優しいサイトデザインなら、ゆっくり優しくスクロール移動したり、ポップなデザインなら少しアップテンポにスクロール移動させたりと、デザイ...

例えば、WEB運営者がHTMLやPHPに明るくなく、管理画面から値の設定を行いたい時があります。 そんな時に便利なのがカスタムメニューです。 カスタムメニューページを用意することで、よりWEB初心者でも更新しやすいCMSサイトが実現できます。 カスタムメニューを作る方法 カスタムメニューページのテンプレートを作る ...