Tutoriels sur Joomla et la création de site

Mise en page Features Intro 2 sur Purity III

position/structure de la mise en page

Construire une page Features Intro 2

Important:

Toutes les étapes sur la manière de créer une page Features Intro 2 sont les mêmes que pour la page magazine. Vous pouvez suivre les instructions détaillées ci dessus : Comment construire la page du magazine.

• Étape 1: Créer style "Features Intro 2"

• Étape 2: Affecter la mise en page "Features Intro 2" au style «Features Intro 2»

• Étape 3: Créer un lien de menu «Features Intro 2»

• Étape 4: Assigner le style « Features Intro 2 » à l'élément de menu « Features Intro 2 »

réglage du menu Features Intro 2

Type de lien de menu : xLayout-Features Intro

Paramètres détaillés

Configuration de Module

Remarque:

La mise en page features-intro-2 n'a pas de contenu com_content, donc quel que soit le type de son menu, sa disposition ne changera pas. Sur le site de démonstration, le contenu principal de la page Features Intro 2 est issu des modules affectés à la position: features-intro-2.

Masthead

• Type de module: Custom HTML
• Position du module: masthead
• Suffixe de module: row-feature-primary

Code HTML

<div class="jumbotron jumbotron-primary masthead btn-action">  <h1>Hello, I'm Purity III</h1>  <p>Now back and way cooler.</p>  <p><a href="http://bit.ly/purity_iii" class="btn btn-primary btn-lg"> Check me out</a></p></div>

Feature 1

• Type de module: Custom HTML
• Position du module: features-intro-2
• Suffixe de module: NON UTILISÉ

Code HTML

<div class="text-center"><div class="item-image"><img class="img-responsive" pagespeed_url_hash="557298203" alt="T3 Framework" src="/images/joomlart/intro-page/fullresponsive.png"></div> <div class="col-md-4">  <h3>The Perfect Starting Point</h3>  <p>Purity III is a GREAT starter theme for any Joomla lovers. It allows YOU to get started in minutes, and highly versatile to fit in any type of projects</p> </div> <div class="col-md-4">  <h3>Joomla 3 Native</h3>  <p>Purity III supports Joomla 3 at core. The sleek look, clean code and flat design sets it stand out and guarantee to capture anyone's attention</p></div> <div class="col-md-4">  <h3>Easy to Customize</h3>  <p>Purity III is extremely flexible to customize. Thanks to the powerful T3 Framework, which makes all the impossibilities possible</p></div> </div>

Compatible Extensions

• Type de module: Custom HTML
• Position du module: features-intro-2
• Suffixe de module: NON UTILISÉ

Code HTML

<header class="jumbotron">  <h2>Highly Compatible</h2>  <p>Purity III is highly compatible with most of the 3rd party Joomla extensions</p></header>    <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/compatible/easyblog">      <img src="/images/joomlart/compatible-extension/easyblog.png" alt="Easy Blog" />    </a>  </div>   <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/compatible/easysocial">      <img src="/images/joomlart/compatible-extension/easysocial.png" alt="easysocial" />    </a>  </div>   <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/compatible/discussions">      <img src="/images/joomlart/compatible-extension/easydiscuss.png" border="0" alt="easydiscuss" />    </a>  </div>    <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/forum/index">      <img src="/images/joomlart/compatible-extension/kunena.png" border="0" alt="Kunena" />    </a>  </div>   <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/compatible/jomsocial">      <img src="/images/joomlart/compatible-extension/jomsocial.png" border="0" alt="JomSocial" />    </a>  </div>   <div class="col-xs-6 col-md-4">    <a class="thumbnail" href="/index.php/compatible/mijoshop">      <img src="/images/joomlart/compatible-extension/mijoshop-logo.png" border="0" alt="mijoshop" />    </a>  </div> <div class="wrap btn-actions text-center">    <a class="btn btn-primary btn-lg" role="button" href="http://bit.ly/purity_iii">More detail?</a>  </div>

Supports multiple layouts

• Type de module: Custom HTML
• Position du module: features-intro-2
• Suffixe de module: NON UTILISÉ

Code HTML

<header class="jumbotron"><h2>Supports Multiple Layouts</h2><p>8 layouts with dynamic and flexible grids</p></header> <div class="gallery">   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="magazine layout" href="/index.php/layout/new-layouts/magazine">        <img pagespeed_url_hash="2579736203" alt="" src="/images/joomlart/supported-layout/magazine.png" class="img-responsive">      </a>      <h4 class="text-center">Magazine Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="Coperate layout" href="/index.php/layout/new-layouts//corporate">          <img pagespeed_url_hash="2874236124" alt="" src="/images/joomlart/supported-layout/corporate.png" class="img-responsive">      </a>      <h4 class="text-center">Corporate Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="blog layout" href="/index.php/layout/new-layouts/blog">        <img pagespeed_url_hash="3168736045" target="_blank" alt="" src="/images/joomlart/supported-layout/blog.png" class="img-responsive">      </a>      <h4 class="text-center">Blog Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="features intro 1" href="/index.php/layout/new-layouts/features-intro">        <img pagespeed_url_hash="3757735887" alt="" src="/images/joomlart/supported-layout/features_1.png" class="img-responsive">      </a>      <h4 class="text-center">Features Intro 1 Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="features intro 2" href="http://joomla-templates.joomlart.com/purity_iii/">        <img pagespeed_url_hash="4052235808" alt="" src="/images/joomlart/supported-layout/features_2.png" class="img-responsive">      </a>      <h4 class="text-center">Features Intro 2 Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="portfolio layout" href="/index.php/layout/new-layouts/portfolio">        <img pagespeed_url_hash="3463235966" alt="" src="/images/joomlart/supported-layout/portfolio.png" class="img-responsive">      </a>      <h4 class="text-center">Portfolio Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="" href="/index.php/layout/new-layouts/glossary">        <img alt="" src="/images/joomlart/supported-layout/glossary.png" class="img-responsive">      </a>      <h4 class="text-center">Glossary Layout</h4>    </div>  </div>   <div class="col-xs-6 col-md-3">    <div class="thumbnail">      <a target="_blank" title="" href="/index.php/layout/new-layouts/home-classic/3-columns">        <img alt="" src="/images/joomlart/supported-layout/classic_layout.png" class="img-responsive">      </a>      <h4 class="text-center">Classic Layout</h4>    </div>  </div> </div>

Why Purity III?

• Type de module: Custom HTML
• Position du module: features-intro-2
• Suffixe de module: NON UTILISÉ

Code HTML

<header class="jumbotron"><h2>Why Purity III?</h2><p>A Free Responsive Joomla 3 Template that no one can resist</p></header> <div class="text-center"> <div class="col-md-3">  <p><img pagespeed_url_hash="932791188" alt="Responsive" src="/images/joomlart/banners/responsive-icon.png" /></p>  <h3>Responsive</h3>  <p>Purity III is a fully responsive Joomla template. It looks amazingly beautiful in all screen sizes: from a wide screen desktop to tablet & mobile devices</p></div> <div class="col-md-3">  <p><img pagespeed_url_hash="2048194936" alt="Compatibilities" src="/images/joomlart/banners/html5-icon.png"></p>  <h3>Compatibilities</h3>  <p>Purity III is compatible with most of the popular 3rd party Joomla extensions, such as: EasySocial, Kunena, JomSocial, Mijoshop, etc</p></div> <div class="col-md-3">  <p><img pagespeed_url_hash="1985577692" alt="Bootstrap...