رفتن به مطلب

کمک برای ساخت ساید شو + advancedcustomfeild


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

سلام ، امیدورام تاپیک رو اشتباه ایجاد نکرده باشم ،

من یه سایت خبری با وردپرس ایجاد کردم و برای مدیریت فیلد های اختیاری از افزونه ی advancedcustomfeild استفاده کردم ، افزونه ی قوی و راحتی هست .

برای ایجاد یه ساید شو ، که بتونه فیلدهای اختیاری رو نشون بده ، از افزونه های زیادی استفاده کردم ، جواب نگرفتم ، سعی کردم یه افزونه براش درست کنم ، دوستان آموزشی ، کدی چیزی ندارند ، بتونم کدهای فیلدها رو توش قرار بدم تا بتونم یه ساید شو راه اندازی کنم ؟ ساید شو مثل سایت خبر آنلاین می خوام درست کنم :(

خبر آنلاین : khabaronline.ir

advancedcustomfields.com

لینک به ارسال

منظورتون اسلاید های اول سایته؟

از افزونه

http://wordpress.org/extend/plugins/slidedeck-lite-for-wordpress/

استفاده کنید در دو حالت اولیه تنظیم می شه و در هر حالت چندین قالب داره

به عنوان نمونه در عکس زیر قالب اول از سمت راست دقیقا همون اسلایدر سایت خبر آنلاینه

screenshot-5.jpg?r=575854

لینک به ارسال

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

post-417-0-71440200-1343034619_thumb.png

یه جور باید ورودی ساید شو رو جوری تنظیم کنم که چیزایی که می خوام رو نشون بده !

پایین محتویان index.php هست که تیتر ، رو تیتر ، خلاصه و تصویر محتوا رو برام نشون می ده ،


<div id="post-entry">[/right]
<?php $postcounter = 1; if (have_posts()) : ?>
<?php while (have_posts()) : $postcounter = $postcounter + 1; the_post(); $do_not_duplicate = $post->ID; $the_post_ids = get_the_ID(); ?>
<div class="post-meta" id="post-<?php the_ID(); ?>">
<?php $rotitr_main = get_field('ro_titr'); if(isset($rotitr_main[1])) { ?>
<div class="ro-titr-main">
<?php echo the_field('ro_titr'); ?></div>
<?php } ?>
<?php if(get_field('important')){ ?>
<h2><a href="<?php the_permalink(); ?>" style="color:#FF4F4F;" rel="bookmark" target="_blank" title="<?php the_time(get_option('date_format'));echo(' - ');the_time($d); ?>"><span><?php the_title(); ?></span> </a></h2>
<?php } else { ?>
<h2><a href="<?php the_permalink(); ?>" rel="bookmark" target="_blank" title="<?php the_time(get_option('date_format'));echo(' | ');the_time($d); ?>"><span><?php the_title(); ?></span> </a></h2>
<?php } ?>
<?php $images_main = wp_get_attachment_image_src(get_field('article_images'), 'thumbnail'); if(isset($images_main[1])) { ?>
<a class="post-img" target="_blank" href="<?php the_permalink(); ?>" rel="bookmark">
<?php $image = wp_get_attachment_image_src(get_field('article_images'), 'thumbnail'); ?>
<img src="<?php echo $image[0]; ?>" width="88" height="107" alt="<?php the_title(); ?>" />
</a>
<?php } ?>

<?php $sum_main = get_field('summary'); if(isset($sum_main[1])) { ?>
<div class="kholase">
<?php the_field('summary');?>
</div>
<?php } else { ?>
<div class="kholase">
<?php the_content_rss('', TRUE, '', 50); ?>
</div>
<?php } ?>

برای نمایش خلاصه از

get_field

(

'important'

)

تصویر هم از :

get_field

(

'article_images'

)

استفاده میکنم ، با این اوصاف میشه یه ساید شو درست کرد ؟

لینک به ارسال

می یاد اولین تصویر از مطلب رو جدا میکنه و خودش از محتوی تعداد کلمه ای رو که ما بهش می دیم بیرون میکشه

از طریق منوی image display که در عکس هم معلومه بجای اولین عکس نام زمینه را بگذارید اگر زمینه به درستی معرفی شده باشه به لیست کشویی اضافه می شه

وردپ

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

لینک به ارسال

الان دیگه نمی تونم تغییری توی بخش هایی که قرار دادم بدم ، با همین کد ها نمی شه دستی اسلاید شو نوشت ؟

لینک به ارسال

سلام ، امیدورام تاپیک رو اشتباه ایجاد نکرده باشم ،

درود ، اتفاقا كاملا تاپيك رو در جاي اشتباهي ايجاد كرده‌ايد .. دوست عزيز شما در بخش آموزش مشكل خودتون رو مطرح كرديد ..

تاپيك به بخش مربوطه انتقال داده شد :)

لینک به ارسال

خب ، بالاخره تونستم بعد از چند ساعتی ، یه سایدشو ، مثل همون چیزی که می خواستم ، درست کنم ، کد هاش رو اینجا می زارم ، برای دوستانی که مشکل دارن ، بتونن استفاده کنند :


<script type="text/javascript" src="/style/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/style/js/loopedslider.js?ver=0.5.6"></script>

<script type="text/javascript">
jQuery.noConflict();
jQuery(function ($) {
$('#loopedSlider').loopedSlider();
});
</script>

<div id="loopedSlider">
<div class="container">

<div class="slides">
<?php

query_posts("showposts=3&cat=5");
while(have_posts()) : the_post();
global $wp_query; $maxnum = $wp_query->found_posts;
?>

<div id="featured">


<?php $images_main = wp_get_attachment_image_src(get_field('article_images'), 'medium'); if(isset($images_main[1])) { ?>
<a class="featured-thumb" target="_blank" href="<?php the_permalink(); ?>" rel="bookmark">
<?php $image = wp_get_attachment_image_src(get_field('article_images'), 'medium'); ?>
<img src="<?php echo $image[0]; ?>" height="160" width="130" alt="<?php the_title(); ?>" />
</a>
<?php } ?>

<?php if(get_field('important')){ ?>
<h2 style="
padding-right: 10px;
"><a class="entry-title" href="<?php the_permalink(); ?>" style="color:#FF4F4F;" rel="bookmark" target="_blank" title="<?php the_time(get_option('date_format'));echo(' - ');the_time($d); ?>"><span><?php the_title(); ?></span> </a></h2>
<?php } else { ?>
<h2 style="
padding-right: 10px;
"><a class="entry-title" href="<?php the_permalink(); ?>" rel="bookmark" target="_blank" title="<?php the_time(get_option('date_format'));echo(' | ');the_time($d); ?>"><span><?php the_title(); ?></span> </a></h2>
<?php } ?>

<p class="kholase-slider">
<?php the_field('summary');?>
</p>
</div> <!--end .slides-->

<?php endwhile; wp_reset_query(); ?>

</div> <!--end #post-->
</div> <!--end .container-->

<ul class="pagination">
<?php $i = 1;3; while($i <= 3) : echo '<li><a href="#">'; echo $i; echo '</a></li>'; $i++;?>
<?php endwhile; ?>
</ul>
</div> <!--end #loopslider-->

کد های بالایی رو با هر نامی که سیو می کنید ، آدرسش رو توی قالبتو بدید ، برا مثال توی قالب خودم :


<?php include (TEMPLATEPATH . '/home-featured.php'); ?>

یه سری کد های سی اس اس هم هست ، که توی استایل اصلی قالبوتون بریزید که مشکلی پیش نیاد :


/*---------------------------------------------------------------------------------*/
/* FEATURED CONTENT SLIDER */
/*---------------------------------------------------------------------------------*/
#loopedSlider {background: white;
padding: 8px 0px 15px 0px;
position: relative;
clear: both;
border: 1px solid #ECEDE8;
}
#loopedSlider .featured-thumb {
margin: 0 10px 4px 0;
float: left;
}
#loopedSlider .container {width: 374px;
height: 199px;
overflow: hidden;
position: relative;
}
#loopedSlider .slides {
position: absolute;
top: 0;
left: 0;
}
#loopedSlider .slides div {
position: absolute;
top: 0;
width: 376px;
display: none;
height: 198px;
}
ul.pagination {
list-style-type: none;
margin: 10px auto 0px auto;
padding: 0;
}
ul.pagination li {
float: left;
margin: 0 7px;
display: inline;
}
ul.pagination a {
display: block;
width: 12px;
padding-top: 12px;
height: 0;
overflow: hidden;
background-image: url(images/slidernav.png);
background-position: 0 0;
background-repeat: no-repeat;
}
ul.pagination a:hover {
background-position: 0 -12px;
}
ul.pagination li.active a {
background-position: 0 -23px
}
.entry-title{font-size: 15px;
font-family: b koodak,arial,tahoma;
color: #0B70A5;
text-decoration: none;
width: 238px;
}
.kholase-slider{font: 11px tahoma, arial, 'Times New Roman';
color: black;
font-weight: normal;
text-decoration: none;
text-align: justify;
line-height: 140%;
padding-left: 7px;
padding-right: 7px;
}

توی این ساید شو که درست کردم از jquery 1.3 استفاده شده است ، اگه توی قالتون jqury1.7 رو لود کرد ، با استفاده از کد زیر که توی funtion.php قرارش میدید ، دیگه کتابخونه ی جدید لود نمیشه ، و مشکلی برای ساید شو هم پیش نمی آد :



function my_deregister_scripts() {
wp_deregister_script( 'jquery' );
}

تقریبا تموم شد ، فایل های جاوا اسکریپت رو هم اتچ میکنم ، بریزید توی هاستتون ، و توی فایل اصلی آدرسش رو بر اساس نیازتون ، تغییر بدید :

js.zip

توی فایل زیپ بالایی تو تا فایل جاوا اسکریپت هست ، دوستانی که نیاز دارن ، سرعت و خواص ساید شو رو تغییر بدند ، توی فایل loopedslider.js ، سطر آخرش با دستکاری کد های زیر ، می تونن سرعت و چیزای دیگه ی ساید شو رو به دلخواه تغییر بدند ،


$.fn.loopedSlider.defaults = {
container: ".container", //Class/id of main container. You can use "#container" for an id.
slides: ".slides", //Class/id of slide container. You can use "#slides" for an id.
pagination: "pagination", //Class name of parent ul for numbered links. Don't add a "." here.
containerClick: false, //Click slider to goto next slide? true/false
autoStart: 5000000, //Set to positive number for true. This number will be the time between transitions.
restart: 1, //Set to positive number for true. Sets time until autoStart is restarted.
slidespeed: 80, //Speed of slide animation, 1000 = 1second.
fadespeed: 200, //Speed of fade animation, 1000 = 1second.
autoHeight: 0, //Set to positive number for true. This number will be the speed of the animation.
addPagination: false //Add pagination links based on content? true/false

شرمنده تند تند نوشتم ، دوستان اگه سوالی داره ، در صورت توان ، جواب بدم ، موفق باشید

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

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

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

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

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

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

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

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

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

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