カテゴリー: WordPress

WordPress カレント表示

WordPress

2021.5.31

<?php
  $current_page_id = $wp_query->get_queried_object_id();
  $args = array(
      'posts_per_page' => -1,
      'post_type' => 'カスタム投稿'
  );
  $my_posts = get_posts($args);
?>
<?php foreach ($my_posts as $post): setup_postdata($post); ?>
  <li class="<?php if ($current_page_id == $post->ID ) {echo 'is_active';} ?>">
      <a href="<?php the_permalink(); ?>">
          <?php the_title(); ?>
      </a>
  </li>
<?php endforeach; ?>
<?php wp_reset_postdata(); ?>

WordPressの個別ページに投稿一覧を表示してページャーがうまく動かない場合

WordPress

2020.11.11

$paged = get_query_var('page') ? get_query_var('page') : 1;
$args = array(
'post_type' => 'post',
'posts_per_page' => 12,
'paged' => $paged,
);
$my_query = new WP_Query($args);
$max_num_pages = $my_query->max_num_pages;
if( $my_query -> have_posts() ) :
while($my_query -> have_posts()) : $my_query -> the_post();
endwhile;
endif;

if (function_exists('responsive_pagination')) {
responsive_pagination($additional_loop->max_num_pages);
}

wp_reset_postdata();

$paged = get_query_var(‘page’) ? get_query_var(‘page’) : 1;がポイント。
$paged = get_query_var(‘paged’) ? get_query_var(‘paged’) : 1;ではない。

WordPressの検索結果にカスタムフィールドの値を追加する

WordPress

2020.11.3

function cf_search_join( $join ) {
	global $wpdb;
	if ( is_search() ) {
		$join .= ' LEFT JOIN ' . $wpdb->postmeta . ' ON ' . $wpdb->posts . '.ID = ' . $wpdb->postmeta . '.post_id ';
	}
	return $join;
}
add_filter( 'posts_join', 'cf_search_join' );

function cf_search_where( $where ) {
	global $wpdb;
	if ( is_search() ) {
		$where = preg_replace(
			"/\(\s*" . $wpdb->posts . ".post_title\s+LIKE\s*(\'[^\']+\')\s*\)/",
			"(" . $wpdb->posts . ".post_title LIKE $1) OR (" . $wpdb->postmeta . ".meta_value LIKE $1)", $where );

		// 特定のカスタムフィールドを検索対象から外す（※１）
//		$where .= " AND (" . $wpdb->postmeta . ".meta_key NOT LIKE 'number')";
//		$where .= " AND (" . $wpdb->postmeta . ".meta_key NOT LIKE 'zip')";
//		$where .= " AND (" . $wpdb->postmeta . ".meta_key NOT LIKE 'access')";
	}
	return $where;
}
add_filter( 'posts_where', 'cf_search_where' );

function cf_search_distinct( $where ) {
	global $wpdb;
	if ( is_search() ) {
		return "DISTINCT";
	}
	return $where;
}
add_filter( 'posts_distinct', 'cf_search_distinct' );

// 検索対象を『タイトルのみ』にする
function __search_by_title_only( $search, & $wp_query ) {
	global $wpdb;
	if ( empty( $search ) )
		return $search; // skip processing - no search term in query
	$q = $wp_query->query_vars;
	$n = !empty( $q[ 'exact' ] ) ? '' : '%';
	$search =
		$searchand = '';
	foreach ( ( array )$q[ 'search_terms' ] as $term ) {
		$term = esc_sql( like_escape( $term ) );
		$search .= "{$searchand}($wpdb->posts.post_title LIKE '{$n}{$term}{$n}')";
		$searchand = ' AND ';
	}
	if ( !empty( $search ) ) {
		$search = " AND ({$search}) ";
		if ( !is_user_logged_in() )
			$search .= " AND ($wpdb->posts.post_password = '') ";
	}
	return $search;
}
//add_filter( 'posts_search', '__search_by_title_only', 500, 2 );// （※２）

下記サイトを参考にしました。
WordPress内の検索対象にカスタムフィールドも適用する

現在のページにクラスを付与する

WordPress

2020.10.27

<nav>
    <ul>
        <li><a <?php if( is_page('concept') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>concept/">コンセプト</a></li>
        <li><a <?php if( is_page('news') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>news/">新着情報</a></li>
        <li><a <?php if( is_page('menu') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>menu/">メニュー_</a></li>
        <li><a <?php if( is_page('staff') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>staff/">スタッフ</a></li>
        <li><a <?php if( is_page('salon') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>salon/">サロン案内</a></li>
        <li><a <?php if( is_page('contact') ) { echo 'class="current"'; } ?> href="<?php echo esc_url( home_url( "/" ) ); ?>contact/">お問い合わせ</a></li>
    </ul>
</nav>

画面幅によって読み込みファイルを変える〜レスポンシブウェブデザイン

HTML jQuery WordPress

2020.4.24

<script>
  jQuery(document).ready(function($) {
    //PC環境の場合
    if (window.matchMedia('(min-width: 768px)').matches) { //切り替える画面サイズ
      $.ajax({
        url: '<?php echo esc_url( get_template_directory_uri() ); ?>/js/pc.js',
        dataType: 'script',
        cache: false
      });
      //スマホ環境の場合
    } else {
      $.ajax({
        url: '<?php echo esc_url( get_template_directory_uri() ); ?>/js/sp.js',
        dataType: 'script',
        cache: false
      });
    };
  });
</script>

【WordPress】ポストナビゲーション（次の記事・前の記事）をつけたい

WordPress

2017.1.28

  1. Font Awesome呼び出しタグを貼り付けます
  2. 表示箇所にコードを貼り付けます

1. Font Awesomeのリンクを内に貼り付けます

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

2. 表示箇所にコードを貼り付けます

前の記事

<?php previous_post_link('%link','<i class="fa fa-chevron-circle-left"></i> %title'); ?>

次の記事

<?php next_post_link('%link','%title <i class="fa fa-chevron-circle-right"></i>'); ?>

私はBootstrapを愛用しているので、こんな感じになります。

<div class="row">
	<div class="col-sm-6">
		<p><?php previous_post_link('%link','<i class="fa fa-chevron-circle-left"></i> %title'); ?></p>
	</div>
	<div class="col-sm-6">
		<p class="text-right"><?php next_post_link('%link','%title <i class="fa fa-chevron-circle-right"></i>'); ?></p>
	</div>
</div>

Category

Recent posts

Category

LINEモバイル