Short Info Arriba de Centro de Información

Información:
Hola amigos, bueno este maravilloso tutorial es muy importante para dar un estilo mas profesional a su foro, muestra un conteo de mensajes, usuarios, ultimo registrado y máximo en linea siempre en el index de su foro. Viene inclusido un estilo CSS muy bonito, estoy seguro que les gustará. Enjoy!!

Resultado:



Empezemos:

Archivo a Editar: BoardIndex.template.php (.../Themes/{TU THEME}/BoardIndex.template.php)

Buscar:

Code: [Select]

// Here's where the "Info Center" starts...
echo '
<span class="clear upperframe"><span></span></span>
<div class="roundframe"><div class="innerframe">
<div class="cat_bar">
<h3 class="catbg">
<img class="icon" id="upshrink_ic" src="', $settings['images_url'], '/collapse.gif" alt="*" title="', $txt['upshrink_description'], '" style="display: none;" />
', sprintf($txt['info_center_title'], $context['forum_name_html_safe']), '
</h3>
</div>
<div id="upshrinkHeaderIC"', empty($options['collapse_header_ic']) ? '' : ' style="display: none;"', '>';
Reemplazar:

Code: [Select]

// Here's where the "Info Center" starts...
echo '
<br class="clear" />
<div id="iclinks" align="center">
    <ul class="iclinks">
    <li class="value">', $context['common_stats']['total_posts'], '</li><li>', $txt['posts_made'], ' ', $txt['in'], ' ', $txt['total'], '</li>
    <li class="value">', $context['common_stats']['total_members'], '</li><li>', $txt['members'], ' ', $txt['in'], ' ', $txt['total'], '</li>
    <li class="value">' . $context['common_stats']['latest_member']['link'] . '</li><li>', $txt['latest_member'] . '</li>
    <li class="value">', comma_format($modSettings['mostOnline']), '</li><li>', $txt['most_online_ever'], '</li>
        </ul>
    </div>
<span class="upperframe"><span></span></span>
<div class="roundframe"><div class="innerframe">
<div class="cat_bar">
<h3 class="catbg">
<img class="icon" id="upshrink_ic" src="', $settings['images_url'], '/collapse.gif" alt="*" title="', $txt['upshrink_description'], '" style="display: none;" />
', sprintf($txt['info_center_title'], $context['forum_name_html_safe']), '
</h3>
</div>';
Archivo a Editar: index.css (.../Themes/{TU THEME}/css/index.css)

Agregar al Final:

Code: [Select]

#iclinks
{
margin: 10px 0;
width: 100%;
height: 35px;
}
.iclinks
{
    padding: 0;
margin: 0;
list-style: none;
text-align: center;
display: table-cell;
}
.iclinks li
{
    float: left;
margin-right: 25px;
padding: 0 5px;
height: 30px;
line-height: 30px;
}
.iclinks li.value
{
color: #FFF;
font-size: 14px;
background: #232323;
border-radius: 5px;
    height: 30px;
line-height: 30px;
padding: 0 15px;
margin-left: 5px;
margin-right: 0;
}
.iclinks li a
{
color: #FFF;
}
.iclinks li a:hover
{
text-decoration: none;
}
Creditos:
Daniel > Development
EduardO > Tutorial

Muy bueno esto, queda bastante bien.
Felicitaciones

Muy bueno esto, queda bastante bien.
Felicitaciones

Gracias

Me ha quedado genial.Muchas gracias por el tip.