سوال: پیاده سازی گرید بندی بوت استرپ در وردپرس

این تاپیک 5 پاسخ و 2 مشارکت کننده دارد . آخرین آپدیت توسط :  وحید صالحی ،‏ 1 سال و 8 ماه پیش .

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

نویسنده پست
پنجشنبه ، 9 آوریل 2015     10:59 ق.ظ #


بهرام

Subscriber
263 پست84 تاپیک

دوستان سلام

یک عکس پیوست کردم که طرح کلی قالب صفحه رو نشون میده. دوتا سوال و مشکل در مورد گرید بندی صفحه دارم. کد رو هم قرار میدم.

1. دوستان لطف کنید و بگید کد گرید بندی صفحه درست هست یا نه؟ و آیا راه دیگه ای داره؟

2. کادر های قرمز رنگ هرکدوم یک پست رو نمایش میدن. برای پیاده سازی اون قسمت، طبق سیستم بوت استرپ هر سطر باید یک row و هر کدوم از اون کادر ها یک column باشه.

آیا راهی وجود داره که هر 12 تا باکس داخل یک row قرار بگیرند ولی به صورت 3تا 3تا زیر هم نمایش داده بشند و نه در یک سطر؟

اگر باید هر 3تا داخل یک سطر باشند این رو داخل حلقه while وردپرس چه طور پیاده کنیم که به ازای هر 3 پست یک row باز و بسته بشه؟

<div class="container">
<div class="row clearfix">
<div class="col-md-9 column">
<div class="row clearfix">
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
</div>
<div class="row clearfix">
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
</div>
<div class="row clearfix">
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
<div class="col-md-3 column">
</div>
</div>
</div>
<div class="col-md-3 column">
</div>
</div>
</div>

پیوست ها:
You must be logged in to view attached files.
0  تشکر
:: این تاپیک، پاسخ تائیدشده دارد : مشاهده پاسخ تائید شده توسط سوال کننده
شنبه ، 11 آوریل 2015     10:11 ق.ظ #


وحید صالحی

Authorplus
VIP
548 پست4 تاپیک

سلام آقا بهرام شما توی فایل html که ارسال کردی اصلا خود بوت استرپ رو به صفحه اضافه نکردی ابتدااین کار  رو انجام بده و متا تگ مورد نیازش رو هم در head بزار.

1  تشکر
شنبه ، 11 آوریل 2015     10:52 ق.ظ #


بهرام

Subscriber
263 پست84 تاپیک

سلام

ممنون وحید جان، نه اوناش که مشکلی نیست، یعنی الان بوت استرپ کار میکنه. الان سوال من واسه گرید بندی این صفحه هست، واسه همین فقط همون قسمت کد رو ارسال کردم. اینجوری که من خوندم اینور اون ور.استاندارد بوت استرپ میگه یک row داخلش 12تا column داره که واسه یک سطر هم هست و نباید از 12 column هم بیشتر تعریف کرد. که البته باز میشه داخل هر کدوم از این column ها یک row تعریف کرد و... .

حالا با توجه به این تعریفی که عرض کردم نحوه گرید بندی میشه همون کدی که گذاشتم که خوب پیاده سازیش تو حلقه while وردپرس یکم مشکل میشه. چون ما میخوایم مثلا 12 تا پست رو نمایش بدیم و بعد طبق این کد که گفتم باید هر 3تاش داخل یک row باشه. واسه اینکار باید تو حلقه تعریف کرد که به ازای هر 3تا پست یک تگ row باز کن باز آخرش ببند. یکم سخته.

اما من سورس هارو که نگاه میکردم دیدم تو بعضی از سایت ها فقط اومدن یک row تعریف کردن و داخل اون هم برای هر پست یک column که از 12  بیشتر هم شده ولی مشکلی هم در نمایش سایت دیده نمیشه. که خوب این روش دوم خیلی هم ساده تر هست واسه پیاده کردنش. حالا من موندم که کدوم یکی بالاخره درسته!؟

0  تشکر
شنبه ، 11 آوریل 2015     11:42 ق.ظ #


وحید صالحی

Authorplus
VIP
548 پست4 تاپیک

اکی من فکر کردم در پیاده سازی html مشکل داری درسته شما زمانی که یک ردیف یا row و col رو در هر میزاری خوده حلقه به تعداد پست ها اون ها رو تکرار میکنه یعنی هر چی در حلقه باشه با هر پست یکبار تکرار میشه پس شما یه row تعریف کن و درون تعداد col درش مشخص کن و محدوده ای رو که مربوط به نمایش پست ها هست بزار تو حلقه.

1  تشکر
شنبه ، 11 آوریل 2015     11:47 ق.ظ #


بهرام

Subscriber
263 پست84 تاپیک

یعنی اینجوری؟:

اگه sample کدی که میگی رو بذاری ممنون میشم وحید جان.

0  تشکر
شنبه ، 11 آوریل 2015     2:01 ب.ظ # پاسخ تائید شده توسط سوال کننده


وحید صالحی

Authorplus
VIP
548 پست4 تاپیک

کلاس row که مربوط به سطر هست و باید بیرون باشه چون سطر نمی خواهیم تکرار بشه بلکه col ها باید تکرار  بشن پس اون ها رو در حلقه بزار.

1  تشکر
پست 1 تا 6 (از مجموع 6 پست)

این تاپیک پاسخ تائید شده دارد و بسته شده است .