Live Demo
-
John Doe
CEO and co-founder
Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser. -
Jane Doe
CEO and co-founder
Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser. -
Phil Doe
Marketing Team Leader
Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser. -
Dana Doe
Financial Director
Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser.
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;
?>
<ul class="staff">
<?php foreach ($list as $item) : ?>
<?php $item->urls = new JRegistry($item->urls); ?>
<li>
<!-- Image intro -->
<?php
$article_images = json_decode($item->images);
$article_image = '';
$article_image_alt = '';
if(isset($article_images->image_intro) && !empty($article_images->image_intro)) {
$article_image = $article_images->image_intro;
$article_image_alt = $article_images->image_intro_alt;
}?>
<figure><img class="img-responsive" src="/<?php echo $article_image; ?>" title="<?php echo $item->title; ?>" alt="<?php echo $article_image_alt; ?>"></figure>
<!-- Position and @mail -->
<h5><?php echo $item->title; ?></h5>
<p><?php echo $item->urls->get('urlatext'); ?><br />
<small><a href="mailto:<?php echo $item->urls->get('urlbtext'); ?>" title="Email"><?php echo $item->urls->get('urlbtext'); ?></a></small></p>
</li>
<?php endforeach; ?>
</ul>CSS
ul.staff {
list-style: none;
margin: 0!important;
padding: 0;
}
ul.staff li {
border-bottom: 1px dotted #e0e0e0;
display: block;
padding-top: 12px;
padding-bottom: 12px;
overflow: hidden;
}
ul.staff li img {
border: 1px solid #e0e0e0;
width: 50px;
height: 50px;
float: left;
padding: 3px;
margin-right: 12px;
margin-top: 15px;
margin-bottom: 25px;
}
ul.staff li h5 {
margin: 0;
font-weight: 700px;
}
