پارس جوم :: انجمن های تخصصی جوملا

با سلام یک قالب را می خواهم تغییر بدهم و موقعیت هایی شبیه عکس زیر بسازم
با css و html هم اشنایی دارم
می تونم موقعیت ساده در هر جایی ایجاد کنم ولی اینکه موقعیت در کناره ها باشه یا به صورت چند ستونه را بلد نیستم
می خواستم ببینم چطور میشه این کار را انجام داد

[تصویر: oe2_قالب_سایت-model.png]

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

کد: 

<body>

    <div id="main">   

        <div id="heder">

            <?php if($this->countModules('search')): ?>

            <div id="search">

            </div><!--End search-->

            <?php endif; ?>

        </div><!--End heder-->

           <?php if($this->countModules('menu')): ?>        

        <div id="menu">

        </div><!--End menu-->

        <?php endif; ?>

           <?php if($this->countModules('user1 + user2 + user3 + user4')): ?>          

        <div id="top-users">

               <?php if($this->countModules('user1')): ?>     

            <div id="user1">                

            </div><!--End user1-->                

            <?php endif; ?>

               <?php if($this->countModules('user2')): ?>              

            <div id="user2">                

            </div><!--End user2-->   

            <?php endif; ?>

               <?php if($this->countModules('user3')): ?>              

            <div id="user3">                

            </div><!--End user3-->                       

            <?php endif; ?>

               <?php if($this->countModules('user4')): ?>              

            <div id="user4">                

            </div><!--End user4--> 

            <?php endif; ?>                        

        </div><!--End top-users-->

           <?php if($this->countModules('slider')): ?>          

        <div id="slider">                

        </div><!--End slider--> 

        <?php endif; ?>           

        <div id="center">

           <?php if($this->countModules('left')): ?>  

            <div id="left">                

            </div><!--End left--> 

            <?php endif; ?>       

            <div id="contents">                

            </div><!--End contents-->

            <?php endif; ?>            

           <?php if($this->countModules('right')): ?>              

            <div id="right">                

            </div><!--End right-->                                 

            <?php endif; ?>                       

        </div><!--End center-->             

           <?php if($this->countModules('b-user1 + b-user2 + b-user3 + b-user4')): ?>  

        <div id="b-users">

        <?php endif; ?>        

               <?php if($this->countModules('b-user1')): ?>          

            <div id="b-user1">                

            </div><!--End b-user1--> 

            <?php endif; ?>                           

               <?php if($this->countModules('b-user2')): ?>              

            <div id="b-user2">                

            </div><!--End b-user2--> 

            <?php endif; ?>              

               <?php if($this->countModules('b-user3')): ?>              

            <div id="b-user3">                

            </div><!--End b-user3--> 

            <?php endif; ?>                                  

               <?php if($this->countModules('b-user4')): ?>              

            <div id="b-user4">                

            </div><!--End b-user4--> 

            <?php endif; ?>        

        </div><!--End b-users--> 

        <div id="footer">

        </div>

    </div><!--End main-->

</body>

شاد باشید و شادی بخش دیگران

با تشکر از راهنمایی
اگر میشه بیشتر توضیح بدید چون خیلی متوجه نشدم
مثلا چطور میشه یک موقعیت را به دو موقعیت با اندازه دلخواه تقسیم کرد؟
یا یک موقعیت جدید در سمت راست یا چپ ایجاد کرد؟؟؟

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

اول یه خلاصه ای از طراحی قالب
قالب رو مثل یه جدول ورد تصور کن
بعد سعی کن با یه سری مربع تو در تو اون رو ایجاد کنی .
مثلا
اول از همه یه مربع بزرگ برای کل صفحه ی نمایش
دوم مربعی با عرض کمتر به عنوان کادری که مطالب و ماژولها و همه چییز درونش قرار میگری . این رو داخل مربع او.ل میکشی
مربع سوم چهارم پنج داخل مربع دوم به این صورت که عرض همه برابر اولی بالا دومی وسط سومی پایین- هدر فوتر و شیت
سه تا مربع دیگه داخل مربع وسطی میکشی به اسامی چپ وسط راست .
و..........
دقت کن که بعدا با استیل ترتیب، اندازه و نحوه ی نمایش تک تک مربع ها رو باید تنظیم کنی و همینطور ارث بری از کلاسهای بالاتر رو هم در نظر بگیری .
**************
حالا شما یه قالب آماده داری
اول از مدیریت قالب / انتخابها / پیش نمایش رو فعال کن و به صفحه ی پیش نمایش برو این صفحه محل قرار گیری موقعیتها، اسمشون و اسم کلاسشون رو نمایش میده
بعد نوبت اضافه کردن موقعیت بین موقعیتهای قبلیه .
توی فایل index.php موقعیت در محل مورد نظرت پیدا کنی و اون رو با تغییر نام و تنظیم اندازه ها کنار موقعیت های قبلی داخل مربع مادر کپی کنی احتمالا کارت راه بیفته .
البته این خیلی بستگی به دایوبندی و کلاسهای قالبت داره
این رو نگاه کن اگه قالبت با ارتیستر درست شده باشه میتونی این کار رو انجام بدی .

کد php: 

<div class="sa-sheet clearfix">
          <?php echo $view->positions(array('top1' => 21, 'top2' => 58, 'top3' => 21), 'sa-block'); ?>
      <?php echo $view->position('banner1', 'sa-nostyle'); ?>
  <?php echo $view->positions(array('top5' => 25, 'top6' => 25, 'top7' => 25, 'top8' => 25), 'sa-nostyle'); ?>
   <?php echo $view->positions(array('top9' => 20, 'top10' => 20, 'top11' => 20, 'top12' => 20, 'top13' => 20), 'sa-nostyle'); ?>

ردیف چهار و پنج رو با کپی و کمی تغییر ایجاد کردم sa-nostyle اسم کلاس css هست که بعد میتونی توی templat.css استیلش رو تغییر بدی . مثلا

کد php: 

.sa-nostyle
}
font:tohoma;
{ 

راحت ترین راه همون بررسی قالبهای دیگرونه و تغییر اونها و مشاهده ی نتیجه .
اگه راه ساده و بی فایده رو هم میخوای بری فایل index .php قالبت رو بگذار تا تنظیمش کنم .

ali_85

mahan

ali_85

Reza Ganji

sajjad salehi