Purity2.fr

Example just above this article

This tutorial is not specific to JA Purity II. It is a question of creating 2 new positions. But these two additional positions above the "Content" can be interesting.

1- Edit the file main.php

Folder : templates > ja_purity_ii > layouts > blocks > main.php

We will add the follow lines of code :

<?php if( $this->countModules('topgauche') ): ?>
<div id="topgauche">
<jdoc:include type="modules" name="topgauche" style="JArounded" />
</div>
<?php endif; ?>
<?php if( $this->countModules('topdroite') ): ?>
<div id="topdroite">
<jdoc:include type="modules" name="topdroite" style="JArounded" />
</div>
<?php endif; ?>

We will add this line as follow in the file main.php :

<!-- CONTENT -->
<div id="ja-main" style="width:<?php echo $this->getColumnWidth('m') ?>%">
<div class="inner clearfix">
 
	<jdoc:include type="message" />
 
 
<?php if( $this->countModules('topgauche') ): ?>
<div id="topgauche">
<jdoc:include type="modules" name="topgauche" style="JArounded" />
</div>
<?php endif; ?>
<?php if( $this->countModules('topdroite') ): ?>
<div id="topdroite">
<jdoc:include type="modules" name="topdroite" style="JArounded" />
</div>
<?php endif; ?>
 
	<?php 
	$mass_top = $this->getPositionName ('content-mass-top');
	if($this->countModules($mass_top)) : ?>
	<div class="ja-mass ja-mass-top clearfix">
		<jdoc:include type="modules" name="<?php echo $mass_top;?>" style="JAxhtml" />
	</div>
	<?php endif; ?>

Here we chose the JArounded style to have the rounded corners. But we can also choose the JAxhtml style.

2- Edit the file template.css

Folder : templates > ja_purity_ii > css > template.css

You must add the lines  :

#topgauche  {
	float: left;
	width: 49%;
	}
 
#topdroite {
	float: right;
	width: 49%;
	}

3- Edit the file templateDetails.xml

Folder : templates > ja_purity_ii > templateDetails.xml

Add the code :

<position>topgauche</position>
<position>topdroite</position>

4- Publication of the modules

It does not more remain than to publish modules wished in position topgauche and topdroite.

gauche means left in French, and droite means right.

5- Do this for a "rounded" layout

Here we have created the 2 top positions for the default layout. For a "rounded" layout, you have to edit the file main-rounded.php.

However, you would obtain 2 modules above the Content and the left column  (content-mass-top).