CODEWITHSUNDEEP
phpjavascriptwordpress
Corlax
Corlax

Reputation: 764

Read More Post wordpress with js

hi i want to add read more with js which will show limited content when some click read more it will show full post on same page

below is the code i am using 

     <?php if ( have_posts() ) : ?>

            <?php /* Start the Loop */ ?>
                <?php 
                    if ( get_query_var('paged') ) {
                        $paged = get_query_var('paged');
                    } elseif ( get_query_var('page') ) {
                        $paged = get_query_var('page');
                    } else {
                        $paged = 1;
                    }
                    query_posts( array( 'post_type' => 'post' , 'posts_per_page' => '3' ) );
                ?> <?php while ( have_posts() ) : the_post(); ?>
<div class="post-box img-polaroid row">
<h3 class="title-post text-left span3"><?php the_title(); ?></h3>

<div class="post-par span6 text-left"><?php the_content();?></div>

 <span class="span3 offset3 text-center" style="width:100%; margin:0px;">
 <button class="hear-more"></button>

</span>
</div>
<?php endwhile; ?>
     <?php endif; ?>`

when some click read more it will show full post ...

Upvotes: 2

Views: 1603

Answers (1)

Emad Rahnama
Emad Rahnama

Reputation: 1238

with php limit post by:

$length_limit = 1000; //character
echo '<div class="summaryarticle">';
echo mb_substr(the_content(), 0, $length_limit);
echo '</div>';

echo '<input type="button" value="show more..." onclick="$(this).prev().hide(); $(this).next().show();" />';

echo '<div class="fullarticle" style="display:none">';
echo the_content();
echo '</div>';

notice: use must include jquery in page. maybe that be.

Upvotes: 1

Related Questions