آموزش جوملا

5 1 1 1 1 1 1 1 1 1 1 امتیاز 5.00 (3 رای)

نحوه ایجاد طرح بندی اورراید در جوملا 3

joomla 3.0

جوملا امکان طراحی مجدد تقریبا هر جنبه ای از سایت شما را فراهم می کند یعنی شما می توانید هر قسمت را که میخواهید به دلخواه خود تغییر دهید. در پست قبلی، ما توضیح دادیم که چگونه اورراید قالب کار می کند. در این پست، ما در مورد طرح بندی اورراید صحبت خواهیم کرد. طرح بندی اورراید دقیق تر و مشخص تر از اورراید قالب است. در واقع طرح بندی اورراید به شما این امکان می دهد بخش کوچکی از طراحی را سفارشی کنید، مثلا: آیکون های اجتماعی، عناوین و برچسب های مقاله. طرح بندی اصلی در پوشه ای به نام / layouts / قرار دارد. این یک ویژگی جدید در جوملا 3 است. ما در اینجا به عنوان مثال از قالب Protostar از جوملا 3 استفاده خواهیم کرد.


چگونه می توان طرح بندی تگ (برچسب ها) را اورراید کرد

ما در اینجا خروجی HTML را برای برچسب هایی که به طور پیش فرض در نظر گرفته شده اند را سفارش سازی می کنیم. به تصویر زیر نگاه کنید:

layout overrides 1

در اینجا نحوه استفاده از طرح بندی اورراید برای تغییر رنگ برچسب ها زیر را توضیح می دهیم:

فایل tags.php از این مسیر : / layouts / joomla / content / کپی کنید.
فایل های کپی کرده  tags.php را در مسیر زیر قرار دهید:

 / templates / protostar / html / layouts / joomla / content / 

 
در خط 22 از فایل tags.php، کلاس مقابل را به تگ <a> اضافه کنید: btn btn-primary (پس از این کلاس ایجاد کرده یک فضای خالی را ایجاد کنید). خط کامل کد به صورت زیر خواهد بود:

<a href="/<?php echo JRoute::_(TagsHelperRoute::getTagRoute($tag->tag_id . '-' . $tag->alias)) ?>" class="btn btn-primary <?php echo $link_class; ?>">

اکنون طرح بندی تگ خود را مشاهده کنید (رنگ کادرها به آبی تغییر کرد):

layout overrides 2


 چگونگی اورراید کردن طرح آیکون جوملا

آیکون های پرینت و ایمیل در صفحات وبلاگ های دسته بندی (category) مانند تصویر زیر هستند:

layout overrides 3

برای تغییر طراحی این آیکون ها از نحوه استفاده از یک طرح بدی اورراید استفاده می شود:

فایل icons.php را از مسیر : / layouts / joomla / content / کپی کنید.
فایل کپی کرده icons.php را در مسیر زیر قرار دهید:

 / templates / protostar / html / layouts / joomla / content /


در فایل icons.php، کد را از خط 16 تا انتها حذف کنید و آن را با کد زیر عوض کنید:


<div class="icons pull-right">
<?php if (empty($displayData['print'])) : ?>
    <?php if ($canEdit || $displayData['params']->get('show_print_icon') || $displayData['params']->get('show_email_icon')) : ?>
            <?php // Note the actions class is deprecated. Use dropdown-menu instead. ?>
            <ul>
                <?php if ($displayData['params']->get('show_print_icon')) : ?>
                    <li class="print-icon"> <?php echo JHtml::_('icon.print_popup', $displayData['item'], $displayData['params']); ?> </li>
                <?php endif; ?>
                <?php if ($displayData['params']->get('show_email_icon')) : ?>
                    <li class="email-icon"> <?php echo JHtml::_('icon.email', $displayData['item'], $displayData['params']); ?> </li>
                <?php endif; ?>
                <?php if ($canEdit) : ?>
                    <li class="edit-icon"> <?php echo JHtml::_('icon.edit', $displayData['item'], $displayData['params']); ?> </li>
                <?php endif; ?>
            </ul>
    <?php endif; ?>
<?php else : ?>
    <div class="pull-right">
        <?php echo JHtml::_('icon.print_screen', $displayData['item'], $displayData['params']); ?>
    </div>

اکنون اگر شما به سایت خود مراجعه کنید، شما نتیجه زیر را مشاهده خواهید کرد:

layout overrides 4

مهم است که توجه داشته باشید که در قالب Protostar این کار فقط برای مطالب در طرح بندی دسته (Category) وبلاگ کار خواهد کرد. برای استفاده از طرح اورراید در نمایش کامل مطلب، شما به یک کامپوننت اورراید و کد جایگزینی که نمادها را با سینتگس (syntax: نحوه درست قرار گیری کلمات را در کنار هم و همچنین نگارش آن ها را نشان می دهد.) ارائه می دهد نیاز دارید. برای جایگزین کردن کد مورد نظر مراحل زیر را انجام دهید.

فایل default.php را از مسیر: / components / com_content / views / article / tmpl / کپی کنید.
فایل کپی شده ای default.php را در مسیر زیر وارد کنید:

templates / protostar / html / com_content / article / 


فایل default.php را به این صورت که با حذف کد از خط 68 تا 82 و جایگزین آن با موارد زیر ویرایش کنید:


<?php echo JLayoutHelper::render('joomla.content.icons', array('params' => $params, 'item' => $this->item, 'print' => false)); ?>

طرح بندی های اورراید زیادی برای اورراید کردن در دسترس است که در مسیر layouts / joomla / folder و همچنین توسط توسعه دهندگان افزونه 3rd party ارائه شده است. این آموزش فقط چندتا از این طرح بندی ها را برای شما خوانندگان عزیز بیان کرده است.

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

این مطلب را به اشتراک بگذارید در :

نظرات (0)

هیچ نظری ارسال نشده است .

نظر خود را اضافه کنید.

ارسال نظر به عنوان مهمان ثبت نام or ورود برای رفتن به حساب کاربری شما .
پیوست ها (0 / 3)
Share Your Location