لودینگ ادامه مطالب سایت با استفاده از جی کوئری یا آجاکس

ahmad · مرداد 92

با سلام به همه

میخواستم درخواست کنم که اگر کسی میدونه چگونه باید لودینگ ادامه مطالب سایت را ایجاد کرد آموزشش را قرار دهد

منظورم از لودینگ ادامه مطالبی مانند سایت فیس بوک که با اسکرول کردن به پایین مطالب به طور خودکار مطالب قدیمی تر لود می شود یا مانند سایت گوگل پلاس با کلیک بر روی نوشته more مطالب قدیمی تر بدون رفرش صفحه لود میشود،است

Farid · مرداد 92

سلام

این مطلب رو بخونید ... آموزش داده چطور این کار رو انجام بدید .

ahmad · مرداد 92

سلام
این مطلب رو بخونید ... آموزش داده چطور این کار رو انجام بدید .

لطفا اگه میشه فارسیش رو بگید چون زیاد ازش سر در نیاوردم

Mohammad · مرداد 92

برای اینکار از پلاگین جی‌کوئری jscroll استفاده کنید و با سایت خودتون هماهنگ کنید.

اشکان · مرداد 92

دوست عزیز یه نگاه به سایت بنده کنین.این شکلی میخواین؟


http://jootix.ir

ahmad · مرداد 92

دوست عزیز یه نگاه به سایت بنده کنین.این شکلی میخواین؟
http://jootix.ir

آره دقیقا می خوام همین طور باشه اگر آموزشش را قرار بدید ممنون می شم

اشکان · مرداد 92

1 - شما افزونه infinate scroll رو نصب کنید.

2 - شما تو سایتتون از شماره ها استفاده میکنید یا اینکه نوشته های کهنه تر؟

3 - محتویات فایل index.php قالبتون رو اینجا قرار بدین تا بهتون بگم که چطور باید افزونه رو تنطیم کنید.

ahmad · مرداد 92

1-افزونه نصب شد

2-بله از شماره استفاده میکنم

3-محتویات فایل index.php:


<?php get_header();
?>
<?php
global $authordata;
$aOptions = SofaQandA::initOptions( false );
$trimexcerpt = ( strlen( $aOptions[ 'trimexcerpt' ] ) > 0 ) ? stripslashes( $aOptions[ 'trimexcerpt' ] ) : 25;
$hppf	 = ( strlen( $aOptions[ 'hppf' ] ) > 0 ) ? stripslashes( $aOptions[ 'hppf' ] ) : ''; // home page filter posts
$layout_nor = $aOptions[ 'layout_nor' ]; // number of records at home page
?>

<div class="contenttwothird">
<div class="widget widetwothird">
	 <p class="info">

	 <span class="lfloated rembut blue qvotestxt"><a href="<?php bloginfo( 'url' ); ?>" rel="nofollow"><?php _e( "Newest", "sofa_qanda" ); ?></a></span>
	 <span class="lfloated rembut blue qvotestxt"><a href="<?php bloginfo( 'url' ); ?>/index.php?sqanda=sqanda_votes" rel="nofollow"><?php _e( "The most Voted", "sofa_qanda" ); ?></a></span>
	 </p>
</div>
<?php if( have_posts() ) : while( have_posts() ) : the_post(); ?>
<div class="widget widetwothird bord">
<div class="headerc">
	 <div class="qmeta">

<?php if(file_exists("upload/" . "pic".$authordata->ID.".png")){ ?>
<img style="width:59px;height:59px;" src="upload/pic<?php echo $authordata->ID; ?>.png" />
<?php }else{ echo get_avatar( $authordata->user_email, $size = '59' ); } ?>

		 <p class="info">
<span>
<?php
			 $post_raw_date = $post->post_date_gmt;
echo sprintf( __( 'By <a href="%s">%s</a> in ', 'sofa_qanda' ), get_author_posts_url( $authordata->ID, $authordata->user_nicename ), get_the_author() );
the_category( ', ' ); ?>
			 تاریخ ارسال: <?php the_time('d M Y'); ?>
			 </span>
		 </p>

		 <p class="info">
			 <span>

			 <?php
$all_comments = count_all_comments_by_user( $post->post_author ); // how many answers this author has provided?
$all_auth_posts = get_the_author_posts(); // all questions by this author
$all_accepted = count_all_accepted_comments_by_user( $post->post_author ); // accepted answers by this author

$acceptance_rate = '0%';
if( intval( $all_accepted ) > 0 && intval( $all_auth_posts ) > 0 ) {
	 $acceptance_rate = round( ( intval( $all_accepted ) / intval( $all_auth_posts ) ) * 100 ) . '%';
}

echo __( "Questions", "sofa_qanda" ) . ': <strong class="strongcolor">' . $all_auth_posts . '</strong> ' . __( "Reputation", "sofa_qanda" ) . ': <strong class="strongcolor">' . user_reputation( $post->post_author ) . '</strong> ';
?>
			 </span>
		 </p>


	 </div>
</div>
<div class="qinfo">
	 <div id="qvoteup">

		 <span class="qv qvoteupimg">
			 <?php
if( '' != $user_ID && $a_reputation >= $rep_minimum ) {
	 if( $post->post_author == $user_ID && $user_ID > 1 ) { // if user is an owner, don't allow to vote
?>
	 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/up_60x30.png' ); ?>" class="tT" alt="" title="<?php _e( "You are not allowed to vote Pro your own Question!", "sofa_qanda" ); ?>" />
<?php
				 } else {
?>
			 <a href="#" class="tT" title="<?php _e( "This question is helpful!", "sofa_qanda" ); ?>" rel="pro_<?php the_ID(); ?>">
				 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/up_60x30.png' ); ?>" alt="<?php _e( "Vote Pro!", "sofa_qanda" ); ?>" />
			 </a>
			 <?php
	 }
} else {
	 if( '' != $user_ID ) $msg_proQ = __( "You are not allowed to Vote Pro, Reputation score too low!", "sofa_qanda" );
	 else $msg_proQ = __( "Login if you like to vote!", "sofa_qanda" );
?>
				 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/up_60x30.png' ); ?>" class="tT" title="<?php echo $msg_proQ; ?>" alt="" />
			 <?php } ?>
		 </span>

	 </div>

	 <div class="qvotes">

		 <?php
$sing_or_plur = __( "", "sofa_qanda" );
$no_votes = $post->no_votes;
if( $no_votes == 1 ) $sing_or_plur = __( "", "sofa_qanda" );
?>
		 <span id="pro_<?php the_ID(); ?>" class="qvotesnum"><?php echo $no_votes; ?></span>
		 <span class="qvotestxt"><?php echo $sing_or_plur; ?></span>

	 </div>
			 <div id="qfavorite">

		 <span class="qfavoriteimg">

			 <?php
// who is browsing?
if( $user_ID != '' && $user_ID > 0 ) {

	 // get current user favorites
	 $user_faves = $wpdb->get_var( "SELECT user_faves FROM $wpdb->users WHERE ID = $user_ID" );
	 if( $user_faves != '' ) {
	 $user_faves_arr = explode( ',', $user_faves );
	 if( !in_array( $post->ID, $user_faves_arr ) ) {
?>

					 <a href="#" class="tT" title="<?php _e( "Add to favorites!", "sofa_qanda" ); ?>" rel="<?php echo $user_ID; ?>_add_<?php the_ID(); ?>">
						 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/fav_empty_60x30.png' ); ?>" alt="" />
					 </a>

			 <?php
	 } else {
?>

					 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/fav_full_60x30.png' ); ?>" class="tT" title="<?php _e( "Question added to favorites!", "sofa_qanda" ); ?>" />

			 <?php
	 }
	 } else {
?>

				 <a href="#" class="tT" title="<?php _e( "Add to favorites!", "sofa_qanda" ); ?>" rel="<?php echo $user_ID; ?>_add_<?php the_ID(); ?>">
					 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/fav_empty_60x30.png' ); ?>" alt="" />
				 </a>

<?php
	 }
} else {
?>

				 <img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/fav_empty_60x30.png' ); ?>" class="tT" title="<?php _e( "Login to add this Question to favorites!", "sofa_qanda" ); ?>" />

<?php
}
?>

		 </span>

	 </div>

	 <?php if( $post->accepted_by > 0 ) { ?>

	 <div class="qvotes blue">
		 <span class="qvotestxt"><?php _e( "Solved!", "sofa_qanda" ); ?></span>
	 </div>


	 <?php } ?>

</div>

<div class="qcont">

	 <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>


	 <?php
	 if( $trimexcerpt > 0 ) {
		 $perma_link = get_permalink( $post->ID );
		 $content = get_the_content();
		 $content = apply_filters( 'the_content', $content );
		 $content = str_replace( ']]>', ']]>', $content );
		 echo trim_the_content( $content, __( "READ MORE", "sofa_qanda" ), $perma_link, (int)$trimexcerpt );

}
	 ?>



</div>
<div class="report">
<?php wprp(true);?>
</div>
</div>


<?php endwhile; ?>
<?php
// handle pagination
if( $wp_query->max_num_pages > 1 ) {
include( 'wp-pagenavi.php' );
if( function_exists( 'wp_pagenavi' ) ) { wp_pagenavi(); }
}
?>
<?php else : ?>
<div class="widget widetwothird">
<h2><?php _e( "Oops!", "sofa_qanda" ); ?></h2>
<p><?php _e( "Unfortunately, no posts found.", "sofa_qanda" ); ?></p>
</div>
<?php endif; ?>
</div>
<script type="text/javascript">
jQuery( function() {
jQuery( '.tT' ).tipTip( { maxWidth: "auto", edgeOffset: 10, defaultPosition: "right", delay: 10 } );
} );
</script>
<script type="text/javascript">
jQuery( document ).ready( function() {

// voting post
jQuery( '.qv a' ).click( function() {

var full_info = jQuery( this ).attr( 'rel' );

var arr_param = full_info.split( '_' );

jQuery.post( "<?php echo get_bloginfo( 'template_directory' ) ?>/vote_pro_or_con.php", { act: arr_param[ 0 ], pid: arr_param[ 1 ] },
function( data ) {
if(data){
	 document.getElementById(full_info).textContent=data;
}

} );

return false;

} );

// favorites | 0 - user_ID, 1 - action, 2 - post_ID
jQuery( '.qfavoriteimg a' ).click( function() {

var full_info = jQuery( this ).attr( 'rel' );
var arr_param = full_info.split( '_' );
var myself = jQuery( this );

jQuery.post( "<?php echo get_bloginfo( 'template_directory' ) ?>/faves_add_or_rem.php", { uid: arr_param[ 0 ], act: arr_param[ 1 ], pid: arr_param[ 2 ] },
function( data ) {
if( data == '1' ) {
	 var my_parent = jQuery( myself ).parent();
	 jQuery( myself ).remove(); // prevent multiple clicks
	 jQuery( my_parent ).append( '<img src="<?php echo bloginfo( 'template_directory' ) . ( '/images/fav_full_60x30.png' ); ?>" />' );
}
} );

return false;

} );

// accepting comment as a final solution | 0 - user_ID, 1 - action, 2 - comment_ID, 3 - post ID
jQuery( '.aa a' ).click( function() {

var full_info = jQuery( this ).attr( 'rel' );
var arr_param = full_info.split( '_' );

jQuery.post( "<?php echo get_bloginfo( 'template_directory' ) ?>/answer_pro_or_con.php", { uid: arr_param[ 0 ], act: arr_param[ 1 ], cid: arr_param[ 2 ], pid: arr_param[ 3 ] },
function( data ) {
var serial_data = data.split( '_' ); // serial_data[ 0 ] - success indicator (1 or 0), serial_data[ 1 ] - $new_acceptance ( 0-decapted, 0> - accepted)
if( serial_data[ 0 ] == '1' ) {
	 window.location.reload();
}
} );

return false;

} );

// activate editor
jQuery( '.comment-reply-link' ).click( function() {
jQuery( '#comment' ).markItUpRemove();
return false;
} );

jQuery( '#cancel-comment-reply-link' ).click( function() {
jQuery( '#comment' ).markItUp( myHtmlSettings );
jQuery( '#comment' ).focus( function() {
jQuery( 'li.preview a' ).trigger( 'mousedown' );
} );
return false;
} );

jQuery( '#comment' ).markItUp( myHtmlSettings );
jQuery( '#comment' ).focus( function() {
jQuery( 'li.preview a' ).trigger( 'mousedown' );
} );

} );

</script>

<?php include( TEMPLATEPATH . '/sidebar_index.php' ); ?>

<?php get_footer(); ?>

ویرایش شده مرداد 92 توسط ahmad

اشکان · مرداد 92

لطفا این کد ها رو پاک کنید و آدرس سایتتون رو بزارین

در ضمن آموزش هم قرار داده شده.

http://forum.wp-parsi.com/tutorials/article/339-%d8%b5%d9%81%d8%ad%d9%87-%d8%a8%d9%86%d8%af%db%8c-%d8%a8%d8%a7-%d8%a7%d8%b3%d8%aa%d9%81%d8%a7%d8%af%d9%87-%d8%a7%d8%b2-ajax-%d8%a8%d8%a7-%d8%a7%d9%81%d8%b2%d9%88%d9%86%d9%87-infinite-scroll/

ahmad · مرداد 92

من قالب را هنوز نصب نکردم و روی لوکال در حال کار با اون هستم

اشکان · مرداد 92

شما آموزشی که گذاشتم مطالعه کنید مشکلتون رفع میشه.

شما index , header توی رو zip کنید و اینجا بزارین.

بعد اون کد هایی که گفتم رو توی قالبون بزارین و کد زیر رو با صفحه بندی شماره ای جایگزین کنید


<div id="nav-below">
<?php jootix_content_nav( 'nav-below' ); ?>
</div>

ahmad · مرداد 92

اون کدهای که گفتید در function.php قرار بدیم ،وقتی قرار میدم صفحه سفید میشود

من header ,index و function را در فایل زیر قرار دادم


http://uploadtak.com/images/d4661_t.zip

ویرایش شده مرداد 92 توسط ahmad

اشکان · مرداد 92

دوست عزیز این کلاس رو توی کادر اول درون افزونه بزارید:


.contenttwothird

و این رو درون کادر چهارم بزارید:


.widget widetwothird bord

حتما این نقطه های پشتشون باید باشه.

در ضمن مشکل شما با کدها:

کد فانکشن:

باید درون php قرار بگیره به شکل زیر:


<?php
if ( ! function_exists( 'jootix_content_nav' ) ) :
/**
* Displays navigation to next/previous pages when applicable.
*
* @since Twenty Twelve 1.0
*/
function jootix_content_nav( $html_id ) {
global $wp_query;
$html_id = esc_attr( $html_id );
if ( $wp_query->max_num_pages > 1 ) : ?>
<nav id="<?php echo $html_id; ?>" class="navigation" role="navigation">
<h3 class="assistive-text"><?php _e( 'صفحه بندی مطالب', 'jootix' ); ?></h3>
<div class="nav-previous alignleft"><?php next_posts_link( __( '<span class="meta-nav">←</span> پست های قدیمی', 'jootix' ) ); ?></div>
<div class="nav-next alignright"><?php previous_posts_link( __( 'پست های جدید <span class="meta-nav">→</span>', 'jootix' ) ); ?></div>
</nav>
<?php endif;
}
endif;
?>

و فایل index هم شما باید کدی که دادم رو با کد زیر جایگزین کنید:


  <?php
// handle pagination
if( $wp_query->max_num_pages > 1 ) {
include( 'wp-pagenavi.php' );
if( function_exists( 'wp_pagenavi' ) ) { wp_pagenavi(); }
}
?>
  <?php else : ?>
  <div class="widget widetwothird">
    <h2>
	  <?php _e( "Oops!", "sofa_qanda" ); ?>
    </h2>
    <p>
	  <?php _e( "Unfortunately, no posts found.", "sofa_qanda" ); ?>
    </p>
  </div>
  <?php endif; ?>

ahmad · مرداد 92

کار نکرد همه کارهای را که گفتید اجام دادم ولی کار نکرد فقط یک مشکلی وجود داره وقتی کد


  <?php endif; ?>

را از ایندکس حذف می کنم صفحه سفید میشد من هم بدون حذف این کد ،کدی که داده بودید را قرار دادم ولی کار نکرد

اشکان · مرداد 92

ببخشید عجله ای شد.

این کد رو بزارین درست باید بشه.


<?php
// handle pagination
if( $wp_query->max_num_pages > 1 ) {
include( 'wp-pagenavi.php' );}?>
<div id="nav-below">
<?php jootix_content_nav( 'nav-below' ); ?>
</div>
  <?php else : ?>
  <div class="widget widetwothird">
	    <h2>
		  <?php _e( "Oops!", "sofa_qanda" ); ?>
	    </h2>
	    <p>
		  <?php _e( "Unfortunately, no posts found.", "sofa_qanda" ); ?>
	    </p>
  </div>
  <?php endif; ?>

ahmad · مرداد 92

خواهش می کنم .

ولی بازم کار نکرد

اشکان · مرداد 92

اینو امتحان کنید:


<?php
// handle pagination
if( $wp_query->max_num_pages > 1 ) ;?>
<div id="nav-below">
<?php jootix_content_nav( 'nav-below' ); ?>
</div>
  <?php else : ?>
  <div class="widget widetwothird">
			    <h2>
				  <?php _e( "Oops!", "sofa_qanda" ); ?>
			    </h2>
			    <p>
				  <?php _e( "Unfortunately, no posts found.", "sofa_qanda" ); ?>
			    </p>
</div>
<?php endif; ?>

ahmad · مرداد 92

نه اینم کار نکرد :unsure:

اشکان · مرداد 92

دوست عزیز من نمیدونم اصلا مشکل الان دقیقا چیه اگه آنلاین بود شاید میشد کاری کرد.

الان اروری میده؟

یا نه فقط افزونه کار نمیکنه؟تنظیمات افزونه رو انجام دادین؟

استایل هایی که توی آموزش گذاشته بودم اضافه کردین به استایلتون؟

ahmad · مرداد 92

بله همه تنظیمات را انجام دادم و همه کارهای که گفته بودید را هم انجام دادم ولی افزونه کار نمی کنه

اشکان · مرداد 92

شاید با لوکال مشکل داره یا اینکه با قالبتون مشکل داره.

روی چند سایت امتحان کردم و مشکلی نداشت.

ahmad · مرداد 92

من هم روی چند قالب دیگه امتحان کردم ولی کار نکرد

اشکان · مرداد 92

دوست عزیز روی هر قالب باید تنظیمات دوباره انجام بشه.

شما پوسته 2012 رو فعال کنید و فقط مقدار کادر اول و چهارم تغییر بدین:

کادر اول:


#content

کادر چهارم:


.post

دیگه اون کد ها رو نمیخواد چون پوسته پیشفرض خودش این کد ها رو داره.

ahmad · مرداد 92

بله روی 2012 کار کرد

افزونه دیگه نمیشناسید

ویرایش شده مرداد 92 توسط ahmad

اشکان · مرداد 92

شما قالبتون خیلی شلوغه.میتونید از اونایی که دوستان اول کار معرفی کردن هم امتحان کنید.

پیشنهاد میکنم یا قالبتون رو درست کنید یا اینکه عوض کنید.

لودینگ ادامه مطالب سایت با استفاده از جی کوئری یا آجاکس

پست های پیشنهاد شده

ahmad 6

لینک به ارسال

Farid 2281

لینک به ارسال

ahmad 6

لینک به ارسال

Mohammad 1620

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

ahmad 6

لینک به ارسال

اشکان 1989

لینک به ارسال

لطفا برای ارسال دیدگاه وارد شوید