رفتن به مطلب

نمایش محتوا در lightbox در وردپرس؟


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

سلام خدمت همه دوستان.

امیدارم خوب باشید.

میخواستم ببینم که چطوری میشه ادامه مطلب یک مطلب را در lightbox نمایش داد؟

منظورم اینکه وقتی روی لینک مطلب کلیک میشه محتوای اون مطلب درون یک lightbox نمایش داده بشه.

برای این کار باید چیکار کنم؟

و همچنین اگه بخوام یک قالب واسه این کار در نظر بگیرم باید چیکار کنم؟

مثلا بگم فلان جا ()the_content را نشون بده و فلان جای قالب ()the_excerpt

یه چیزی مثل custom page ک ما میتونیم برای یک صفحه قالب خاص داشته باشیم.

میشه این کارا برای post هم انجام داد؟

ممنون.

لینک به ارسال

سلام

شما از یک کوئری برای نمایش مطالبت استفاده کن ... بعدش جایی که میخوایید کد پیوند به ادامه مطلب رو بذارید به تگ a کلاس بدید مثلا اینجوری :


<a class="light-box" href="<?php the_permalink() ?>" title="<?php the_title(); ?>">

حالا colorbox.css و jquery.colorbox.js رو هم به هدر پیوست کنید تا لود بشه ، و در پایان در هد قرار بدید :


<script>
$(document).ready(function(){
//Examples of how to assign the Colorbox event to elements
$(".light-box").colorbox();
});
</script>

+ این رو هم بگم اگر میخوایید مطالب دسته ای خاص اینجوری باشن باید قالب جدا برای single در نظر بگیرید

لینک به ارسال

سلام

شما از یک کوئری برای نمایش مطالبت استفاده کن ... بعدش جایی که میخوایید کد پیوند به ادامه مطلب رو بذارید به تگ a کلاس بدید مثلا اینجوری :


<a class="light-box" href="<?php the_permalink() ?>" title="<?php the_title(); ?>">

حالا colorbox.css و jquery.colorbox.js رو هم به هدر پیوست کنید تا لود بشه ، و در پایان در هد قرار بدید :


<script>
$(document).ready(function(){
//Examples of how to assign the Colorbox event to elements
$(".light-box").colorbox();
});
</script>

ممنون بابت پاسخ

ولی منظورتون را متوجه نشدم. !!!

کد زیر مربوط به کوئری custom post منه و که برای ساخت گالری نمونه کار ها میخوام ازش استفاده کنم

و خروجی به این صورت هست که عکس بند انگشتی هر پست نمایش داده میشه و قرار با کلیک بر روی هر عکس

به صورت lightbox محتوای (the_content) که شامل یک عکس هست نمایش داده بشه و زیرش

the_excerpt نمایش داده بشه.


<div id="works">
<?php
$mypost2 = array( 'post_type' => 'portfolio');
$loop2 = new WP_Query( $mypost2 );
?>
<?php while ( $loop2 -> have_posts() ) : $loop2->the_post();?>
<?php $portfolio_tumb = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
<!-- get categoris -->
<?php
$categories = get_the_category();
$separator = ' ';
$output = '';
if($categories){
foreach($categories as $category) {
$output .= $category->cat_name.$separator;
}
$group = trim($output, $separator);
}
?>
<a class="work work8" href="<?php the_permalink(); ?>" data-type="<?php echo $group; ?>" data-id="<?php echo $post->ID; ?>">
<div class="work-overlay"></div>
<img src="<?php echo $portfolio_tumb; ?>" width="640" height="480" />
</a>
<?php endwhile;?>

یه اسکرین شات هم از محیط کار گذاشتم.

ممنون.

post-4239-0-46480800-1394381777_thumb.pn

لینک به ارسال

عذر میخوام یادم رفت ذکر کنم از کدوم پلاگین استفاده کردم در کد ها

http://www.jacklmoore.com/colorbox/

پلاگین رو دانلود کنید ، کد های مورد نظر رو که ذکر کردم در هدر فراخوانی کنید و بعد تگ a کدتون هم اینجوری باید بشه :


<a class="light-box work work8" href="<?php the_permalink(); ?>" data-type="<?php echo $group; ?>" data-id="<?php echo $post->ID; ?>">
<div class="work-overlay"></div>
<img src="<?php echo $portfolio_tumb; ?>" width="640" height="480" />
</a>

لینک به ارسال

نمیدونم چرا با اینکه فایل های jquery پلاگین تو سایت لود هستند ولی error میده

که colorbox را نمیشناسم.!!!!!

و سوال دیگه اینکه من باید چطوری بگم کانتنت را توی lighbox نشون بده؟

باید توی single.php بگم؟

post-4239-0-43999800-1394387843_thumb.pn

لینک به ارسال

اگر ارور میده یا کار نمیکنه احتمال تداخل هست //

همون کلاسی که به تگ a دادید نشون میده که لینک مورد نظر ( یا همون ادامه مطلب ) باید در لایت باکس نشون داده باشه

لینک به ارسال

این پلاگین هم هست

http://fancybox.net/

//

خیلی راحت با کدهایی که گفتم مشکلتون حل میشه ! الان توی این سایت( قسمت خبر مهم ) رو من با همین روش ایجاد کردم

لینک به ارسال

اگر ارور میده یا کار نمیکنه احتمال تداخل هست //

همون کلاسی که به تگ a دادید نشون میده که لینک مورد نظر ( یا همون ادامه مطلب ) باید در لایت باکس نشون داده باشه

خیلی ممنون درست شد.

فقط یه مشکلی که هست اینکه محتوای تمام پست را در همه lightbox ها نشون میده.!!!!

مثلا من 2 تا پست دارم که توی هر کدوم 1 عکس هست

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

چیکار کنم که هر لایت باکس فقط محتوای پست خودشو نشون بده؟

لینک به ارسال

فکر کنم شما از حالت گالری عکس لایت باکس استفاده کردید ، وگرنه با یکتا بودن کلاس تگ a باید با کلیک ادامه ی هر مطلبی برای خودش نمایش داده بشه ... اگر مطالب عکس هست خب از کد های دیگه ی این پلاگین استفاده کنید

لینک به ارسال

فکر کنم شما از حالت گالری عکس لایت باکس استفاده کردید ، وگرنه با یکتا بودن کلاس تگ a باید با کلیک ادامه ی هر مطلبی برای خودش نمایش داده بشه ... اگر مطالب عکس هست خب از کد های دیگه ی این پلاگین استفاده کنید

من از همون پلاگین اولینه استفاده کردم یعنی colorbox و کدی که شما داده بودید را هم گذاشتم.!

مطلب هم عکس هست و هم متن.

ما توی فایل single.php باید loop داشته باشیم؟

به خاطر این نیست که من توی فایلsingle.php یک loop گذاشتم؟

لینک به ارسال

کد single.php و کدی که برای نمایش مطالب استفاده میکنید رو پیوست کنید

لینک به ارسال

کد های single :


<?php
$mypost2 = array( 'post_type' => 'portfolio');
$loop2 = new WP_Query( $mypost2 );
?>
<?php while ( $loop2 -> have_posts() ) : $loop2->the_post();?>
<div class="content">
<?php the_content(); ?>
<div class="txt">
<?php the_excerpt(); ?>
</div>
</div>
</div>
<?php endwhile;?>

کد لینک نمایش مطلب :


<a class="light-box work work8" href="<?php the_permalink(); ?>" data-type="<?php echo $group; ?>" data-id="<?php echo $post->ID; ?>">
<div class="work-overlay"></div>
<img src="<?php echo $portfolio_tumb; ?>" width="640" height="480" />
</a>

واقعا سپاسگذارم.

لینک به ارسال

کد single باید اینجوری باشه :


<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="content">
<?php the_content(); ?>
<div class="txt">
<?php the_excerpt(); ?>
</div>
</div>
</div>
<?php endwhile; else: ?><?php endif; ?>

کد قبلیتون اشتباه بود ... شما اگه میخوایید هر دسته ای ادامه ی مطلبش فرق کنه باید از این اموزش استفاده کنید

http://forum.wp-parsi.com/tutorials/article/174-%d8%a7%d8%b3%d8%aa%d8%a7%db%8c%d9%84-%d8%ac%d8%af%d8%a7-%d8%a8%d8%b1%d8%a7%db%8c-%d8%a7%d8%af%d8%a7%d9%85%d9%87-%db%8c-%d9%85%d8%b7%d9%84%d8%a8/

لینک به ارسال

کد single باید اینجوری باشه :


<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="content">
<?php the_content(); ?>
<div class="txt">
<?php the_excerpt(); ?>
</div>
</div>
</div>
<?php endwhile; else: ?><?php endif; ?>

کد قبلیتون اشتباه بود ... شما اگه میخوایید هر دسته ای ادامه ی مطلبش فرق کنه باید از این اموزش استفاده کنید

http://forum.wp-pars...ی-ادامه-ی-مطلب/

خیلی ممنون.درست شد. :)

ولی من فکر میکردم واسه custom post باید یک query جدا بنویسی.!!!!

چه مواقعی به query جدا نیازه ؟

ویرایش شده توسط sajadabedi
لینک به ارسال

( اگر اشتباه نکنم ! ) پست تایپ فکر کنم در یک کوئری خاص به کار میره ! ... این کد مربوط به Single هست ! یعنی ادامه ی مطلب هر پستی

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...