مهدی

نحوه نمایش پست

5 پست در این موضوع قرار دارد

سلام

چه طور میشه کاری کرد که به جای نمایش پست‌های زیر هم

مثلا هر ۵ تا پست کنار هم نمایش داده بشن

بعد ردیف بعدی ۵ پست دیگه کنار هم؟

0

به اشتراک گذاری این پست


لینک به پست

نیاز نیست که کد نویسی خاصی بشه !

خب ساده ترین کار این هست که برای نمایش پستها در حلقه از یک کلاس مناسب استفاده کنید

که داری عرض و ارتفاع ثابت و کمی باشن و اینکه در استایل این کلاس مقدار float رو برابر با right یا left قرار بدین تا پستها بعد از هم در کنار هم قرار بگیرن

2

به اشتراک گذاری این پست


لینک به پست

این کار و انجام دادم نشد.


#container{
float:rihgt;
margin:0 42px 30px 0;
width:290px;
background:url(images/box_botttom_shadow.png) 50% 100% no-repeat;
padding-bottom:5px;
position:relative;
text-shadow:none;

}
.post{
padding: 10px 0 10px 0;
text-align:center;
}
.post h2{
font-family: BK, Tahoma, Arial, sans-serif;
font-size: 18px;
}
.entry{
border:8px solid #F7F9F9;
background:#F7F9F9;
padding:10px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
height:40px;
font-size:18px;
}

0

به اشتراک گذاری این پست


لینک به پست

این کد ایندکس


<body>
<div id="wrapper">

<?php get_header(); ?>

<div id="container" >
<?php if(have_posts()): ?>
<?php while(have_posts()) : the_post(); ?>
<div class="post" id="post_<?php the_ID(); ?>">
<h2>
<a href="<?php the_permalink(); ?>" title="<?php the_title();?>"> <?php the_title(); ?></a>
</h2>
<div class="entry"><?php the_content(); ?>

</div>
</div>
<?php endwhile; ?>
<div class="navigation">
<?php posts_nav_link(); ?>
</div>
<?php else :?>
<div class="post"><h2 _e("Not Found!");></h2></div>
<?php endif; ?>
</div>

<?php get_footer(); ?>
</div>
</body>

این هم استایل


@font-face {
font-family: 'BK';
src: url('font/BKoodakBold.eot?#') format('eot'), /* IE6–8 */
url('font/BKoodakBold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
url('font/BKoodakBold.ttf') format('truetype'); /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
font-family: 'BM';
src: url('font/BMitra.eot?#') format('eot'), /* IE6–8 */
url('font/BMitra.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
url('font/BMitra.ttf') format('truetype'); /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
body, h1, h2, h3, h4, h5, h6, blockquote, p{
margin: 0;
padding: 0;
}
body{
font-family: BM, Tahoma, Arial, sans-serif;
font-size: 18px;
margin: 0px;
direction: rtl;
}
h1{
font-family: BK, Tahoma, Arial, sans-serif;
font-size: 20px;
padding: 0 0 10px 0;
}
a:link {
color: #777777;
-moz-transition: all 0.3s linear 0s;
text-decoration: none;
}
a{
text-decoration: none;
color: #777777;
-moz-transition: all 0.3s linear 0s;
}
a:hover{
color: #13B0CC
}
p{
padding: 10px 0 0 0;
}
p.postmetadata{
border-top: 1px solid #ccc;
margin: 10px 0 0 0;
}
.navigation{
padding: 10px 0 0 0;
font-size: 14px;
font-weight: bold;
line-height: 18px;
}
table#wp-calendar{
width: 100%;
}
#wrapper{
margin:0 auto;
width:960px;
}
#header{
padding-top:7px;
padding-right: 15%;
float: rihgt;
background: url(img/d-1.png) repeat-x;
height: 124px;
color: #FFFFFF
}

header a{
color: #EEEEEE
}
#container{
float:rihgt;
margin:0 42px 30px 0;
width:290px;
background:url(images/box_botttom_shadow.png) 50% 100% no-repeat;
padding-bottom:5px;
position:relative;
text-shadow:none;

}
.post{
padding: 10px 0 10px 0;
text-align:center;
}
.post h2{
font-family: BK, Tahoma, Arial, sans-serif;
font-size: 18px;
}
.entry{
border:8px solid #F7F9F9;
background:#F7F9F9;
padding:10px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
height:40px;
font-size:18px;
}
#container .entryHover {
border:8px solid #EEF2F2;
background:#FFF;
}
#footer{
clear: both;
float: left;
width: 750px;
margin-top: 10px;
}
#footer p{
line-height:18px;
}
.comments-template{
margin: 10px 0 0;
border-top: 1px solid #ccc;
padding: 10px 0 0;
}
.comments-template ol{
margin: 0;
padding: 0 0 15px;
list-style: none;
}
.comments-template ol li{
margin: 10px 0 0;
line-height: 18px;
padding: 0 0 10px;
border-bottom: 1px solid #ccc;
}
.comments-template h2, .comments-template h3{
font-family: BM, tahoma, Georgia, Sans-serif;
font-size: 16px;
}
.commentmetadata{
font-size: 12px;
}
.comments-template p.nocomments{
padding: 0;
}
.comments-template textarea{
font-family: BM, tahoma, Arial, Helvetica, Georgia, Sans-serif;
font-size: 12px;
}

0

به اشتراک گذاری این پست


لینک به پست

خب من یکمی استایل رو دستکاری کردم و برای اینکه مطالب تستم توی کادرها جا بشه the_content رو به the_excerpt تغییر دادم شما خودت درستش کن

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

post-52-0-05963500-1336662428_thumb.jpg

post-52-0-32337800-1336662558_thumb.jpg

index.php

style.css

2

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

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

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری