ブログコンテンツ

【CSS】widthが大きくなってしまう!paddingやborderに左右させずに要素のサイズを指定する方法

要素に余白、枠線を指定した要素にwidth、heightを指定すると、 デフォルトではpaddingやborderの幅を加算したサイズで表示されます。 例えるなら100pxのwidthを指定した要素にpaddingが全方位20pxがある場合、 左右分の40pxを加えた140pxが実際のサイズとなります。 この縦横幅に指定した値に余白や枠線のサイズを加算させないようにする方法を紹介します。 box-sizing に border-box を指定します。 余白も線も関係なく幅がセットされました。
続きを読む...

WordPressでメインクエリの一部を保持しながら取得条件を変えたい

WordPressでメインクエリを変更したい時、query_posts を使うことは公式からも非推奨とされています。 実際に query_posts はページ送りがうまくいかない、条件をリセットし忘れて他所で検索条件が変わってしまう…など、カスタマイズ時の使い方を誤ると問題が起こりやすい関数です。 なので、代わりに pre_get_posts を使いましょう。 今回はメインクエリを変更する際利用するアクションフック pre_get_posts について紹介します。 その前に…メインクエリとは?サブクエリとは? 今回変更したい...
続きを読む...

目指せ軽量化!WordPressのTransient APIでDBキャッシュを生成、クリアする方法

以前、WordPressを高速化させる方法の一つとしてキャッシュ生成ができる wp_cache関数 を紹介しました。 >> 重いクエリをなんとかしたい!WordPressでキャッシュを生成して高速化させる方法 wp_cache関数は1アクセス中にのみ保持されるキャッシュを生成します。ページをまたいでキャッシュを保持するには特別なプラグインが必要です。このプラグインを使用しない状態でキャッシュを保持したい場合は、代わりに Transients API を利用することでDBキャッシュが利用できます。 今回は Transients API を...
続きを読む...

【JQuery】リンクやボタンクリックでDIVなどの要素をふわっと消す

JQueryを使って要素を非表示にする方法を紹介します。 HTML JQuery CSS ※ 上のサンプルは画像です OK!をクリックするとふわっと消えます。 警告やお知らせを表示した後、閉じさせるときなどに使えますね。
続きを読む...

重いクエリをなんとかしたい!WordPressでキャッシュを生成して高速化させる方法

WordPressではテーマテンプレートを自由に作成することができますが、表現したいものによっては 負荷の高いクエリを何度も呼び出す必要があるケースも生まれます。 もし負荷の高いクエリが同じ内容であるならば、キャッシュを使って高速化させることをおすすめします。 今回はWordPressでキャッシュを使用する方法を紹介します。 wp_cache関数とは WordPressには「WP_Object_Cache」というキャッシュを管理するためのクラスがすでに備わっています。このクラスを利用する場合は基本的に wp_cache...
続きを読む...

【CSS】CSSを使ってテーブルの偶数行目だけ背景色を変える

テーブルは行が増えるにつれ見にくくなるので、 偶数行目だけ背景色を変えてCSSで見やすくしてみます。 見やすいですね。 マウスオーバーしたらセルの背景色を変える カーソルを合わせたセルの色を変えることもできます。 (カーソルが見えませんが一番上の☆☆☆☆を指差しています)
続きを読む...

【CSS】テーブルの線が二重になってしまう!1pxにしたい!

borderだけ指定してもテーブルの枠線は二重になってしまいますので もう一押しが必要です。 border-collapse に collapse を指定することで枠線内の余白をなくし、 1pxに見せることができます。
続きを読む...

WordPressで特定のカスタムタクソノミーを持つカスタム投稿タイプの記事を取得する

タクソノミーとはざっくり言うとWordPressの投稿に紐付いている「カテゴリー」みたいなものです。このタクソノミーは自由に何種類でも作ることができるものです。 WordPressで特定のカテゴリー、特定のタグを持つ記事を取得する方法は以前紹介しましたが、カスタムタクソノミーの場合はこの2つとは少し違った方法になります。 カスタム投稿タイプの記事を取得する方法 まずはカスタム投稿タイプ別に記事を取得する方法を簡単におさらいします。 登録されているカスタム投稿タイプをパラメーターの ...
続きを読む...

WordPressで特定のタグを持つ記事のみ表示したい

以前、特定のカテゴリを持つ記事一覧を取得する方法を紹介しました。 >> WordPressで特定カテゴリの新着記事を表示する方法 カテゴリ同様、Wordpressで特定のタグをもつ記事のみ取得したい場合は記事を取得する関数にタグパラメーターを渡します。 今回も get_posts/WP_Query/query_posts 3種類それぞれの取得方法を紹介します。 その前に…WordPressの記事取得方法3種類まとめ 記事の取得方法を軽くおさらいします。WordPressでは記事の取得方法が3つありますので、ケースにあった関数を使い...
続きを読む...

WordPressで特定カテゴリの新着記事を表示する方法

WordPressの記事一覧を特定のカテゴリーに絞って表示したいケースはよくあるものです。 ・「ニュース」の新着記事だけサムネイル付きでサイドバーに表示したい ・「用語一覧」カテゴリのタイトルをタイトル順で表示したい ・特定のカテゴリのみ除外して新着記事を表示したい などなど。 今回はカテゴリを限定した記事の表示方法を紹介します。 WordPressの記事取得方法は3種類ある カテゴリを絞った検索方法をまとめるまえに、記事の取得方法を軽くおさらいします。 WordPressでは記事の取...
続きを読む...