<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

<div class="wp-pagenavi">
<?php previous_posts_link('<img src="/common/img/btn/btn_pre.png" width="83" height="15" alt="前の5件" class="opa"/>');?>
<a href="<?php echo home_url();?>/works/"><img src="/common/img/btn/btn_back.png" width="122" height="15" alt="最新の5件を見る" class="opa btnBack"/></a>
<?php next_posts_link('<img src="/common/img/btn/btn_next.png" width="86" height="15" alt="次の5件" class="opa"/>');?>
</div>

 <?php if(function_exists('wp_pagenavi')) { wp_pagenavi(array( 'query' => $wp_query , 'type' => 'news' )); }  ?>

Single Page:

$prev_post = get_previous_post();
$next_post = get_next_post();
if(mb_strlen($prev_post->post_title)>14) {
$title01= mb_substr($prev_post->post_title,0,14).'...' ;
} else {$title01=$prev_post->post_title;}

if(mb_strlen($next_post->post_title)>14) {
$title02= mb_substr($next_post->post_title,0,14).'...' ;
} else {$title02=$next_post->post_title;}

<ul>

<li class="prevItem">
<?php if (!empty( $prev_post )): ?>
<a href="<?php echo esc_url( home_url( '/' ) )?>news/<?php echo $prev_post->post_name; ?>" class="pre"><?php echo $title01; ?></a>
<?php endif; ?>
</li>

<li class="listItem"><a href="<?php echo APP_URL ;?>news">一覧</a></li>
<li class="nextItem"><a href="<?php echo esc_url( home_url( '/' ) )?>news/<?php echo $next_post->post_name; ?>" class="nxt"><?php echo $title02; ?></a></li>
</ul>