Features boxes

: mod_articles_category

Live demo

Features

Nunc luctus in metus eget fringilla. Aliquam sed justo ligula.

User Friendly

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Always available

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Best Free CMS

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Responsive Design

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Secure and Powerful

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Works everywhere

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, eaque amet deleniti hic quas qui...

Lire la suite...

Markup

<?php
	/**
		* @package     Joomla.Site
		* @subpackage  mod_articles_category
		* @Author	   web-eau.net
		* @copyright   Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
		* @license     GNU General Public License version 2 or later; see LICENSE.txt
	*/
	
	defined('_JEXEC') or die;
	
?>
<div class="features-boxed">
	<div class="container">
		
		<div class="intro text-center">
			<h2 class="display-4">Features</h2>
			<p>Nunc luctus in metus eget fringilla. Aliquam sed justo ligula. </p>
		</div>
		
		<div class="row justify-content-center features">
			
			<?php foreach ($list as $item) : ?>
			<?php $item->urls = new JRegistry($item->urls); ?>
			<div class="col-sm-6 col-md-5 col-lg-4 pb-4 item">
				<div class="box"><i class="<?php echo $item->urls->get('urlatext'); ?> icon"></i>
					<h3 class="name">
						<?php if ($params->get('link_titles') == 1) : ?>
						<a class="mod-articles-category-title <?php echo $item->active; ?>" href="/<?php echo $item->link; ?>"><?php echo $item->title; ?></a>
						<?php else : ?>
						<?php echo $item->title; ?>
						<?php endif; ?>
					</h3>
					<?php if ($params->get('show_introtext')) : ?>
					<p class="mod-articles-category-introtext description">
						<?php echo $item->displayIntrotext; ?>
					</p>
                    <?php endif; ?>      
					<?php if ($params->get('show_readmore')) : ?>
					<a class="learn-more mod-articles-category-title <?php echo $item->active; ?>" href="/<?php echo $item->link; ?>">
						<?php if ($item->params->get('access-view') == false) : ?>
						<?php echo JText::_('MOD_ARTICLES_CATEGORY_REGISTER_TO_READ_MORE'); ?>
						<?php elseif ($readmore = $item->alternative_readmore) : ?>
						<?php echo $readmore; ?>
						<?php echo JHtml::_('string.truncate', $item->title, $params->get('readmore_limit')); ?>
						<?php elseif ($params->get('show_readmore_title', 0) == 0) : ?>
						<?php echo JText::sprintf('MOD_ARTICLES_CATEGORY_READ_MORE_TITLE'); ?>
						<?php else : ?>
						<?php echo JText::_('MOD_ARTICLES_CATEGORY_READ_MORE'); ?>
						<?php echo JHtml::_('string.truncate', $item->title, $params->get('readmore_limit')); ?>
						<?php endif; ?>
					</a>
					<?php endif; ?>
				</div>
			</div>
			<?php endforeach; ?>
		</div>
	</div>
</div>

CSS

.features-boxed {
  color:#313437;
  background-color:#eef4f7;
}
.features-boxed p {
  color:#7d8285;
}
.features-boxed h2 {
  font-weight:bold;
  margin-bottom:40px;
  padding-top:40px;
  color:inherit;
}
@media (max-width:767px) {
  .features-boxed h2 {
    margin-bottom:25px;
    padding-top:25px;
    font-size:24px;
  }
}
.features-boxed .intro {
  font-size:16px;
  max-width:500px;
  margin:0 auto;
}
.features-boxed .intro p {
  margin-bottom:0;
}
.features-boxed .features {
  padding:50px 0;
}
.features-boxed .item {
  text-align:center;
}
.features-boxed .item .box {
  text-align:center;
  padding:30px;
  background-color:#fff;
  margin-bottom:30px;
}
.features-boxed .item .icon {
  font-size:60px;
  color:#1485ee;
  margin-top:20px;
  margin-bottom:35px;
}
.features-boxed .item .name {
  font-weight:bold;
  font-size:18px;
  margin-bottom:8px;
  margin-top:0;
  color:inherit;
}
.features-boxed .item .description {
  font-size:15px;
  margin-top:15px;
  margin-bottom:20px;
}
Daniel Dubois

Daniel Dubois

Passionné par le Web depuis 2007, Daniel défend la veuve et l'orphelin du web en créant des sites respectueux du W3C. Fort d'une expérience de plusieurs années, il partage ses connaissances dans un état d'esprit open source.
Très impliqué dans la communauté Joomla depuis 2014, il est actif au sein de plusieurs projets, conférencier et fondateur du JUG Breizh.