Добавление собственных пропорций модулей

С возможностью пропорций модулей шаблоны YOOtheme предлагают новый способ управления позициями модулей. Этот подход упощает создание настраиваемых пропорций модулей, необходимых для создания уникального шаблона сайта. Это руководство покажет вам, как создать собственные пропорции модулей для определенной позиции модулей. В этом примере, вам нужно будет добавить новую пропорцию модулей под названием main-top-custom для позиции модулей top. По умолчанию существуют пропорции модулей под названием main-top-equal и main-top-goldenratio.
Во-первых вам нужно добавить определение новой пропорции модулей в настройках макета шаблона. Чтобы сделать это, откройте файл шаблона /lib/php/yoolayout.php с помощью вашего любимого редактора. В указанном файле вы сможете найти все пропорции модулей, определенные для макета шаблона. Следующий код определяет существование пропорции модулей "main-top-equal":

// set maintop module variations 
$yootools->setModulePosition('main-top-equal', array(
 1 => array('width100'), 
2 => array('width50', 'width50'), 
3 => array('width33', 'width33', 'width33') 
));

Как вы можете увидеть, метод setModulePosition (<MODULE_POSITION>,<MODULE_PROPORTION_DEFINITION>) принимает два параметра: первый - это имя позиции модулей, следующей за массивом, определяющим все возможные пропорции модулей, которые зависят от того, сколько модулей будут опубликованы в указанной позиции модулей. Поэтому, если один модуль будет опубликован в позиции "main-top-equal", модуль займет 100% ширины позиции. В дальнейшем, если вы опубликуете 2 модуля в позиции "main-top-equal", каждый модуль займет 50% ширины от этой позиции. Отсюда следует, что пропорция "main-top-equal" разделяет пространство позиции модуля равно для всех, опубликованных в этой позиции модулей.
После понимания устройства системы пропорций в шаблонах YOOtheme, вы сможете создать определение собственных пропорций модулей, которые, для примера, будут содержать в себе следующие значения: Для этого вам необходимо добавить собственное определение в файл yoolayout.php, которое должно выглядить так:

// set maintop custom proportion 
$yootools->setModulePosition('main-top-custom', array(
1 => array('width100'), 
2 => array('width80', 'width20'), 
3 => array('width40', 'width40', 'width20') 
));

С этого момента, к HTML тегу class каждого модуля будут добавлены CSS стили, устанавливающие их ширину. Вы должны убедиться в том, что все эти стили существуют в файле шаблона /css/layout.css. Для этого откройте файл layout.css и прокрутите его почти до самого низа, где вы найдете все CSS стили, контролирующие ширину. Теперь вставьте тот код, который необходим для пропорции "main-top-custom":

.width15 { width: 14.999%; } 
.width18 { width: 18.333%; } 
.width20 { width: 19.999%; } 
.width25 { width: 24.999%; } 
.width33 { width: 33.333%; } 
.width38 { width: 37.999%; } 
.width40 { width: 39.999%; } <- add this style 
.width45 { width: 44.999%; } 
.width50 { width: 49.999%; } 
.width62 { width: 61.999%; } 
.width75 { width: 74.999%; } 
.width80 { width: 79.999%; } <- add this style 
.width100 { width: 100%; }

После небольших CSS преобразований можно продолжить и открыть файл index.php для добавления новой пропорции модулей main-top-custom. Сперва найдите позицию модулей, которую вы хотели бы расширить для использования main-top-custom. Это будет выглядеть так:

<?php if ($pos = $yootools->getModulePosition(array('main-top-equal', 'main-top-goldenratio'))) : ?>
 <?php while ($param = $yootools->renderModulePosition($pos)) : ?>
  <div class="maintopbox <?php echo $param['width'].' '.$param['separator']; ?> float-left">
   <jdoc:include type="modules" name="<?php echo $param['name']; ?>" style="yoo" order="<?php echo
   $param['order']; ?>" />
  </div>
 <?php endwhile; ?>
<?php endif; ?>

Как вы можете видеть, метод getModulePosition(<MODULE_POSITION>) принимает один параметр, который устанавливает имена позиций модулей, которые будут отображены с шаблоном. По умолчанию, установлены позиции main-top-equal и main-top-goldenratio. Это означает, что модули, опубликованные в указанных позициях, будут отображены в них при загрузке шаблона. Так как не возможно отображать их вместе одновременно, метод обеспечивает порядок позиций модулей. В данном примере main-top-equal становится первым, сопровождаемым позицией main-top-goldenratio.Поэтому если модуль будет опубликован в позиции main-top-equal, он будет показан в шаблоне независимо от того, если другой модуль будет опубликован в позиции main-top-goldenratio.
Затем вы можете добавить новую пропорцию модулей main-top-custom в параметр метода getModulePosition():

<?php if ($pos = $yootools->getModulePosition(array('main-top-equal', 'main-top-goldenratio', 'main-top-
custom'))) : ?>
 <?php while ($param = $yootools->renderModulePosition($pos)) : ?>
  <div class="maintopbox <?php echo $param['width'].' '.$param['separator']; ?> float-left">
   <jdoc:include type="modules" name="<?php echo $param['name']; ?>" style="yoo" order="<?php echo
   $param['order']; ?>" />
  </div>
 <?php endwhile; ?>
<?php endif; ?>

В заключении, чтобы создать собственную пропорцию модулей, доступную в административной панели Joomla, вы должны добавить имя новой позиции модулей в файл templateDetails.xml:

<positions>
 ... 
<position>main-top-equal</position> 
<position>main-top-goldenratio</position> 
<position>main-top-custom</position> 
....
 </positions>