Joomla! Template Override:

Modernes-Bloglayout

Mit diesem Override von "com_content" "category" erhaltet Ihr ein schönes und modernes Bloglayout.

Ihr braucht das Einleitungsbild und einen Einleitungstext, dieser sollte kurz gehalten werden. Die Artikel haben eine max-height von 215px.

Zusätzlich benötigt Ihr vier Sprachoverrides die Ihr anlegen müsst:

  1. DATE_FORMAT_JOVER_DAY = Wert: d
  2. DATE_FORMAT_JOVER_MONTH = Wert: M
  3. JOVER_TAGS = Wert: Schlagworte
  4. JOVER_WRITTEN_BY = Wert: Geschrieben von

Benötigte Override-Dateien

  • <?php
/**
 * @package Joomla.Site
 * @subpackage com_content
 *
 * @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
 * @license GNU General Public License version 2 or later; see LICENSE.txt
 */
defined('_JEXEC') or die;
JHtml::addIncludePath(JPATH_COMPONENT . '/helpers');
JHtml::_('behavior.caption');
?>
<div class="blog<?php echo $this->pageclass_sfx; ?> jover-modern-blog" itemscope itemtype="http://schema.org/Blog">
 <?php if ($this->params->get('show_page_heading')) : ?>
 <div class="page-header">
 <h1> <?php echo $this->escape($this->params->get('page_heading')); ?> </h1>
 </div>
 <?php endif; ?>

<?php if ($this->params->get('show_category_title', 1) or $this->params->get('page_subheading')) : ?>
 <h2> <?php echo $this->escape($this->params->get('page_subheading')); ?>
 <?php if ($this->params->get('show_category_title')) : ?>
 <span class="subheading-category"><?php echo $this->category->title; ?></span>
 <?php endif; ?>
 </h2>
 <?php endif; ?>

<?php if ($this->params->get('show_cat_tags', 1) && !empty($this->category->tags->itemTags)) : ?>
 <?php $this->category->tagLayout = new JLayoutFile('joomla.content.tags'); ?>
 <?php echo $this->category->tagLayout->render($this->category->tags->itemTags); ?>
 <?php endif; ?>

<?php if ($this->params->get('show_description', 1) || $this->params->def('show_description_image', 1)) : ?>
 <div class="category-desc clearfix">
 <?php if ($this->params->get('show_description_image') && $this->category->getParams()->get('image')) : ?>
 <img src="/<?php echo $this->category->getParams()->get('image'); ?>" alt="<?php echo htmlspecialchars($this->category->getParams()->get('image_alt')); ?>"/>
 <?php endif; ?>
 <?php if ($this->params->get('show_description') && $this->category->description) : ?>
 <?php echo JHtml::_('content.prepare', $this->category->description, '', 'com_content.category'); ?>
 <?php endif; ?>
 </div>
 <?php endif; ?>

<?php if (empty($this->lead_items) && empty($this->link_items) && empty($this->intro_items)) : ?>
 <?php if ($this->params->get('show_no_articles', 1)) : ?>
 <p><?php echo JText::_('COM_CONTENT_NO_ARTICLES'); ?></p>
 <?php endif; ?>
 <?php endif; ?>

<?php $leadingcount = 0; ?>
 <?php if (!empty($this->lead_items)) : ?>
 <div class="items-leading clearfix">
 <?php foreach ($this->lead_items as &$item) : ?>
 <div class="leading-<?php echo $leadingcount; ?><?php echo $item->state == 0 ? ' system-unpublished' : null; ?>"
 itemprop="blogPost" itemscope itemtype="http://schema.org/BlogPosting">
 <?php
 $this->item = & $item;
 echo $this->loadTemplate('item');
 ?>
 </div>
 <?php $leadingcount++; ?>
 <?php endforeach; ?>
 </div><!-- end items-leading -->
 <?php endif; ?>

<?php
 $introcount = (count($this->intro_items));
 $counter = 0;
 ?>

<?php if (!empty($this->intro_items)) : ?>
 <?php foreach ($this->intro_items as $key => &$item) : ?>
 <?php $rowcount = ((int) $key % (int) $this->columns) + 1; ?>
 <?php if ($rowcount == 1) : ?>
 <?php $row = $counter / $this->columns; ?>
 <div class="items-row cols-<?php echo (int) $this->columns; ?> <?php echo 'row-' . $row; ?> row-fluid clearfix">
 <?php endif; ?>
 <div class="span<?php echo round((12 / $this->columns)); ?>">
 <div class="item column-<?php echo $rowcount; ?><?php echo $item->state == 0 ? ' system-unpublished' : null; ?>"
 itemprop="blogPost" itemscope itemtype="http://schema.org/BlogPosting">
 <?php
 $this->item = & $item;
 echo $this->loadTemplate('item');
 ?>
 </div>
 <!-- end item -->
 <?php $counter++; ?>
 </div><!-- end span -->
 <?php if (($rowcount == $this->columns) or ($counter == $introcount)) : ?>
 </div><!-- end row -->
 <?php endif; ?>
 <?php endforeach; ?>
 <?php endif; ?>

<?php if (!empty($this->link_items)) : ?>
 <div class="items-more">
 <?php echo $this->loadTemplate('links'); ?>
 </div>
 <?php endif; ?>

<?php if (!empty($this->children[$this->category->id]) && $this->maxLevel != 0) : ?>
 <div class="cat-children">
 <?php if ($this->params->get('show_category_heading_title_text', 1) == 1) : ?>
 <h3> <?php echo JTEXT::_('JGLOBAL_SUBCATEGORIES'); ?> </h3>
 <?php endif; ?>
 <?php echo $this->loadTemplate('children'); ?> </div>
 <?php endif; ?>
 <?php if (($this->params->def('show_pagination', 1) == 1 || ($this->params->get('show_pagination') == 2)) && ($this->pagination->get('pages.total') > 1)) : ?>
 <div class="pagination">
 <?php if ($this->params->def('show_pagination_results', 1)) : ?>
 <p class="counter pull-right"> <?php echo $this->pagination->getPagesCounter(); ?> </p>
 <?php endif; ?>
 <?php echo $this->pagination->getPagesLinks(); ?> </div>
 <?php endif; ?>
</div>
  • <?php
/**
* @package Joomla.Site
* @subpackage Layout
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
defined('_JEXEC') or die;
// Create a shortcut for params.
$params = $this->item->params;
JHtml::addIncludePath(JPATH_COMPONENT . '/helpers/html');
$canEdit = $this->item->params->get('access-edit');
$info = $params->get('info_block_position', 0);
?>
<?php if ($this->item->state == 0 || strtotime($this->item->publish_up) > strtotime(JFactory::getDate()) || ((strtotime($this->item->publish_down) < strtotime(JFactory::getDate())) && $this->item->publish_down != JFactory::getDbo()->getNullDate())) : ?>
<div class="system-unpublished">
<?php endif; ?>
<div class="row">
<article class="ellipsis">
<div class="col-md-4">
<?php echo JLayoutHelper::render('joomla.content.intro_image', $this->item); ?>
</div>
<div class="col-md-8">
<div class="col-md-2">
<div class="jover-blog-date">
<p class="jover-date-day"><?php echo JHTML::_('date', $this->item->created, JText::_('DATE_FORMAT_JOVER_DAY')); ?></p>
<p class="jover-date-month"><?php echo JHTML::_('date', $this->item->created, JText::_('DATE_FORMAT_JOVER_MONTH')); ?></p>
</div>
</div>
<div class="col-md-10">
<?php echo JLayoutHelper::render('joomla.content.blog_style_default_item_title', $this->item); ?>
<div class="jover-modern-blog-details">
<?php if ($this->params->get('show_author')) : ?>
<?php echo JText::_('JOVER_WRITTEN_BY'); ?>: <?php echo $this->item->author; ?><br/>
<?php endif; ?> 
<?php if ($params->get('show_tags') && !empty($this->item->tags->itemTags)) : ?>
<?php echo JText::_('JOVER_TAGS'); ?>:<?php echo JLayoutHelper::render('joomla.content.tags', $this->item->tags->itemTags); ?>
<?php endif; ?>
</div>
</div>
</div>

<div class="jover-modern-blog-introtext">
<?php echo $this->item->event->beforeDisplayContent; ?> <?php echo $this->item->introtext; ?>
</div>
<?php if ($params->get('show_readmore') && $this->item->readmore) :
if ($params->get('access-view')) :
$link = JRoute::_(ContentHelperRoute::getArticleRoute($this->item->slug, $this->item->catid, $this->item->language));
else :
$menu = JFactory::getApplication()->getMenu();
$active = $menu->getActive();
$itemId = $active->id;
$link1 = JRoute::_('index.php?option=com_users&view=login&Itemid=' . $itemId);
$returnURL = JRoute::_(ContentHelperRoute::getArticleRoute($this->item->slug, $this->item->catid, $this->item->language));
$link = new JUri($link1);
$link->setVar('return', base64_encode($returnURL));
endif; ?>

<?php echo JLayoutHelper::render('joomla.content.readmore', array('item' => $this->item, 'params' => $params, 'link' => $link)); ?>
</article>
</div>
<?php endif; ?>

<?php if ($this->item->state == 0 || strtotime($this->item->publish_up) > strtotime(JFactory::getDate()) || ((strtotime($this->item->publish_down) < strtotime(JFactory::getDate())) && $this->item->publish_down != JFactory::getDbo()->getNullDate())) : ?>
</div>
<?php endif; ?>
<?php echo $this->item->event->afterDisplayContent; ?>
  • @media only screen and (min-width : 320px) {
/* ARTIKEL-STRUKTUR */
div.jover-modern-blog article.ellipsis {
 margin-bottom: 50px;
 padding: 15px 0;
 height: auto;
 max-height: auto;
}

div.jover-modern-blog article.ellipsis:hover {
 background: #eaeaea;
}

/* FORMATIERUNG: ÜBERSCHRIFTEN */
div.jover-modern-blog .page-header {
 border-bottom: none;
 margin: 0;
 padding-bottom: 0;
}

div.jover-modern-blog div.page-header h2 {
 color: orange;
 text-transform: uppercase;
 margin: 10px 0 0 0;
 padding: 0;
}

div.jover-modern-blog div.page-header h2 a {
 color: #5b5a5a;
}

div.jover-modern-blog div.page-header h2 a:hover, div.page-header h2 a:focus {
 color: orange;
 text-decoration: none;
}

/* FORMATIERUNG: TEXT */
div.jover-modern-blog div.jover-modern-blog-introtext {
 line-height: 24px;
 font-family: 'Open Sans', sans-serif;
 color: #7b7b7b;
 font-style: normal;
 text-align: left;
 text-transform: none;
}

div.jover-modern-blog .jover-blog-date {
 text-align: center;
 border: 3px solid #ccc;
 padding: 10px;
 margin-left: -30px;
 margin-bottom: 10px;
}

div.jover-modern-blog p.jover-date-day {
 font-weight: 700; 
 font-size: 32px;}

div.jover-modern-blog p.jover-date-month {
 font-size: 24px;
 text-transform: uppercase;
 padding-top: 5px;
 padding-bottom: 0;
 margin-bottom: 0;
 color: orange;
}

div.jover-modern-blog div.jover-modern-blog-details {
 text-transform: uppercase; 
 font-size: 9px; 
 color:#5b5a5a; 
 margin-top: 5px;
}

div.jover-modern-blog div.jover-modern-blog-details a{
 font-weight: 700;
}

div.jover-modern-blog div.jover-modern-blog-details a:hover, div.jover-modern-blog-details a:focus{
 color: orange; 
 text-decoration: none;
}

/* FORMATIERUNG: SCHLAGWORTE */
div.jover-modern-blog-details ul.tags.inline {
 display: inline-block;
}

div.jover-modern-blog-details ul.inline > li, ol.inline > li {
 display: inline-block;
 padding-right: 0;
}

div.jover-modern-blog-details .label-info[href], .badge-info[href] {
 background-color: transparent;
}

div.jover-modern-blog-details .label, .badge {
 display: inline-block;
 padding: 2px 4px;
 font-size: inherit;
 font-weight: bold;
 line-height: 14px;
 color: #5b5a5a;
 vertical-align: baseline;
 white-space: nowrap;
 text-shadow: none;
 background-color: transparent;
}

/* FORMATIERUNG: WEITERLESEN */
div.jover-modern-blog p.readmore a.btn {
 display: inline-block;
 padding: 4px 0;
 margin-bottom: 0;
 font-size: inherit;
 line-height: 18px;
 text-align: center;
 vertical-align: middle;
 cursor: pointer;
 color: #7b7b7b;
 text-shadow: none;
 background-color: transparent;
 background-image: none;
 -webkit-background-image: none;
 -moz-background-image: none;
 background-repeat: no-repeat;
 filter: none;
 border-color: transparent;
 filter: none;
 border: none;
 border-bottom-color: transparent;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 border-radius: 0;
 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 box-shadow: none;
}

div.jover-modern-blog p.readmore a.btn:hover, div.jover-modern-blog p.readmore a.btn:focus {
 color: orange;
 text-decoration: none;
}
}

@media only screen and (min-width : 768px) {
 div.jover-modern-blog article.ellipsis {
 margin-bottom: 50px;
 padding: 15px 0;
 height: 215px;
 max-height: 215px;
}
}

Tonino Gerns


Fehler melden

Bitte beachte unsere Datenschutzerklärung

Alle mit (*) markierten Felder werden benötigt um eine E-Mail zu senden.

E-Mail für Kontakt
Nachricht hier eingeben.
Dieses Feld wird benötigt.