Hi Chi-K,
I have replaced many codes in this file, I think you can download the old file here:
1/ I have added the following code to under line 14:
if (!class_exists('ContentHelperRoute')) {
if (version_compare(JVERSION, '4', 'ge')) {
abstract class ContentHelperRoute extends \Joomla\Component\Content\Site\Helper\RouteHelper
{
};
} else {
JLoader::register('ContentHelperRoute', $com_path . '/helpers/route.php');
}
}
//compatible params on joomla 4
$this->columns = !empty($this->columns) ? $this->columns : $this->params->get('num_columns', 1);
if (!$this->columns) $this->columns = 1;
$this->blog_class_leading = $this->params->get('blog_class_leading', '');
$this->blog_class = $this->params->get('blog_class', '');
2/ Line 31- Raplace this code:
$num_columns = $this->params->get('num_columns');
// init columns value if not set
if (empty($num_columns)) $num_columns = 1;
// $this->params->get('num_columns')
// var_dump($num_columns);
// die();
?>
With this code:
$htag = $this->params->get('show_page_heading') ? 'h2' : 'h1';
// init columns value if not set
if (empty($this->columns)) $this->columns = 1;
?>
3/ Line 50 - Replace this code:
<h2 class="page-subtitle"> <?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>
With this code:
<<?php echo $htag; ?> class="page-subtitle"> <?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; ?>
</<?php echo $htag; ?>>
4/ Line 68 - Replace this code:
<img src="<?php echo $this->category->getParams()->get('image'); ?>" alt="<?php echo htmlspecialchars($this->category->getParams()->get('image_alt'), ENT_COMPAT, 'UTF-8'); ?>">
With this code:
<?php $alt = empty($this->category->getParams()->get('image_alt')) && empty($this->category->getParams()->get('image_alt_empty')) ? '' : 'alt="' . htmlspecialchars($this->category->getParams()->get('image_alt'), ENT_COMPAT, 'UTF-8') . '"'; ?>
<img src="<?php echo $this->category->getParams()->get('image'); ?>" <?php echo $alt; ?>>
5/ Line 85 - Replace this code:
<?php if (!empty($this->lead_items)) : ?>
<div class="com-content-category-blog__items blog-items items-leading <?php echo $this->params->get('blog_class_leading'); ?>">
<?php foreach ($this->lead_items as &$item) : ?>
<div class="com-content-category-blog__item blog-item bg-primary-light" itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = &$item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php $leadingcount++; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
With this code:
<?php if (!empty($this->lead_items)) : ?>
<div class="com-content-category-blog__items blog-items items-leading <?php echo $this->blog_class_leading; ?>">
<?php foreach ($this->lead_items as &$item) : ?>
<div class="com-content-category-blog__item blog-item" itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
<div class="blog-item-content"><!-- Double divs required for IE11 grid fallback -->
<?php
$this->item = &$item;
echo $this->loadTemplate('item');
?>
</div>
</div>
<?php $leadingcount++; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
6/ Line 107 - Replace this code:
<div class="items-intro cols-<?php echo $num_columns; ?>">
With this code:
<?php $blogClass = $this->blog_class; ?>
<?php if ((int) $this->columns > 1) : ?>
<?php $blogClass .= (int) $this->params->get('multi_column_order', 0) === 0 ? ' masonry-' : ' columns-'; ?>
<?php $blogClass .= (int) $this->columns; ?>
<?php endif; ?>
<div class="com-content-category-blog__items blog-items <?php echo $blogClass; ?>">
<div class="items-row cols-<?php echo (int) $this->columns; ?> <?php echo 'row-' . $row; ?> row">
7/ Line 109 - Replace this code:
<?php $rowcount = ((int) $key % (int) $num_columns) + 1; ?>
<?php if ($rowcount === 1) : ?>
<?php $row = $counter / $num_columns; ?>
<?php endif; ?>
<div class="item-wrap">
<div class="item bg-primary-light clearfix<?php echo $item->state == 0 ? ' system-unpublished' : null; ?>" itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
With this code:
<div class="col-12 col-md-<?php echo $this->columns > 2 ? '6' : round(12 / $this->columns); ?> col-lg-<?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="https://schema.org/BlogPosting">
8/ Line 127 - Replace this code:
<div class="com-content-category-blog__items-more items-more">
With this code:
<div class="items-more">
9/ Line 133 - Replace this code:
<div class="com-content-category-blog__children cat-children">
With this code:
<div class="com-content-category-blog__children cat-children row">
10/ Remove the following js:
<script>
(function($) {
$(document).ready(function() {
var $container = $('.items-intro');
if (!$container.length) return;
$container.isotope({
itemSelector: '.item-wrap',
gutter: 30
});
// re-order when images loaded
$container.imagesLoaded(function() {
$container.isotope();
/* fix for IE-8 */
setTimeout(function() {
$('.items-intro').isotope();
}, 8000);
});
});
})(jQuery);
</script>