I have an Opencart store with multiple languages. Banners can contain only one picture (irrespective of the language chosen), i designed banner for each language.
Opencart v 2.3.0.2
catalog/./view/theme/default/template/extension/module/banner.tpl
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php foreach ($banners as $banner) { ?>
<div class="item">
<?php if ($banner['link']) { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
You'd have to manage the banner image files manually (with FTP) but an approach like this could work:
For each banner you want to display, upload it as usual in admin.
In the directory where the image is saved, create subdirectories corresponding to the languages you support (for example, "en-gb").
This code assumes banners are under catalog/demo/banners. So it just adds the path "language_name" under that.
Modify catalog/./view/theme/default/template/extension/module/banner.tpl to look first in the language specific subdirectory in the block where it displays the banner. In 2.3.0.2, this would look something like:
<?php
foreach ($banners as $banner) {
$lang = $this->registry->get('language');
if (file_exists($lang . "/" . $banner['image'])) {
$banner['image'] = str_replace("catalog/demo/banners", "catalog/demo/banners/$lang", $banner['image']);
}
}
?>
<div id="banner<?php echo $module; ?>" class="owl-carousel">
<?php foreach ($banners as $banner) { ?>
<div class="item">
<?php if ($banner['link']) { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
Related
I need to display thumbnail images of category in category.tpl module in opencart?
I want display thumbnail of category in extension/module/category.tpl not product/product.tpl
how i can do this?
opencart 2.3.0.2
Show images for the sub-categories in the opencart version 2.3
Find following code at catalog\controller\product\category.php
$data['categories'][] = array(
'name' => $result['name'] . ($this->config->get('config_product_count') ? ' (' . $this->model_catalog_product->getTotalProducts($filter_data) . ')' : ''),
'href' => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '_' . $result['category_id'] . $url)
);
Replace the code with below code:
$data['categories'][] = array(
'name' => $result['name'] . ($this->config->get('config_product_count') ? ' (' . $this->model_catalog_product->getTotalProducts($filter_data) . ')' : ''),
'image' => $this->model_tool_image->resize($result['image'], 100,100),
'href' => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '_' . $result['category_id'] . $url)
);
Changed is 'image' => $this->model_tool_image->resize($result['image'], 100,100), if you have to increase the size then change 100 to other values.
Find following code at catalog\view\theme\default\template\product\category.tpl
<?php if ($categories) { ?>
<h3><?php echo $text_refine; ?></h3>
<?php if (count($categories) <= 5) { ?>
<div class="row">
<div class="col-sm-3">
<ul>
<?php foreach ($categories as $category) { ?>
<li><?php echo $category['name']; ?></li>
<?php } ?>
</ul>
</div>
</div>
<?php } else { ?>
<div class="row">
<?php foreach (array_chunk($categories, ceil(count($categories) / 4)) as $categories) { ?>
<div class="col-sm-3">
<ul>
<?php foreach ($categories as $category) { ?>
<li><?php echo $category['name']; ?></li>
<?php } ?>
</ul>
</div>
<?php } ?>
</div>
<?php } ?>
<?php } ?>
Replace with the below code
<?php if ($categories) { ?>
<h3><?php echo $text_refine; ?></h3>
<?php if (count($categories) <= 5) { ?>
<div class="row">
<div class="col-sm-3">
<ul>
<?php foreach ($categories as $category) { ?>
<li> <a href="<?php echo $category['href']; ?>">
<?php if($category['image']){ ?>
<img src="<?php echo $category['image']; ?>" ><br>
<?php } ?>
<?php echo $category['name']; ?></a></li>
<?php } ?>
</ul>
</div>
</div>
<?php } else { ?>
<div class="row">
<?php foreach (array_chunk($categories, ceil(count($categories) / 4)) as $categories) { ?>
<div class="col-sm-3">
<ul>
<?php foreach ($categories as $category) { ?>
<li><a href="<?php echo $category['href']; ?>">
<?php if($category['image']){ ?>
<img src="<?php echo $category['image']; ?>" ><br>
<?php } ?>
<?php echo $category['name']; ?></a></li>
<?php } ?>
</ul>
</div>
<?php } ?>
</div>
<?php } ?>
<?php } ?>
Extra code added is below and there are two places to add the code:
<?php if($category['image']){ ?>
<img src="<?php echo $category['image']; ?>" ><br>
<?php } ?>
You are set for the default theme, but if you are using custom theme then you have to manage as per your theme.
https://webocreation.com/blog/show-images-sub-categories-opencart-version-2-3
I want to show an image or banner in the middle of product category list page. So if there are 10 products in the product category list then it will show 5 product, and then the image, and then the rest 5 product.
Can anybody show me how to do this? Thank you
Open this file:
catalog/view/theme/default/template/product/category.tpl
find foreach for products:
<?php foreach ($products as $product) { ?>
create a variable as a counter before foreach:
then go to the end of foreach (line 99):
<?php } ?>
add following code before it:
<?php if($i == 5){ ?>
<p>here is place for image</p>
<?php } $i++; ?>
Here is full code for foreach section:
<?php $i = 1; foreach ($products as $product) { ?>
<div>
<?php if ($product['thumb']) { ?>
<div class="image"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></div>
<?php } ?>
<div class="name"><?php echo $product['name']; ?></div>
<div class="description"><?php echo $product['description']; ?></div>
<?php if ($product['price']) { ?>
<div class="price">
<?php if (!$product['special']) { ?>
<?php echo $product['price']; ?>
<?php } else { ?>
<span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
<?php } ?>
<?php if ($product['tax']) { ?>
<br />
<span class="price-tax"><?php echo $text_tax; ?> <?php echo $product['tax']; ?></span>
<?php } ?>
</div>
<?php } ?>
<?php if ($product['rating']) { ?>
<div class="rating"><img src="catalog/view/theme/default/image/stars-<?php echo $product['rating']; ?>.png" alt="<?php echo $product['reviews']; ?>" /></div>
<?php } ?>
<div class="cart">
<input type="button" value="<?php echo $button_cart; ?>" onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button" />
</div>
<div class="wishlist"><a onclick="addToWishList('<?php echo $product['product_id']; ?>');"><?php echo $button_wishlist; ?></a></div>
<div class="compare"><a onclick="addToCompare('<?php echo $product['product_id']; ?>');"><?php echo $button_compare; ?></a></div>
</div>
<?php if($i == 5){ ?>
<p>here is place for image</p>
<?php } $i++; ?>
<?php } ?>
I created a extra tab and custom design for related products in products page. I want to get product name,price and to add to cart,image in a loop. In related product tab check this url I am working on that http://efurnish.co.uk/index.php?route=product/product&path=86&product_id=58
<div class="product-related box">
<div class="box-heading"><span><?php echo $tab_related; ?> (<?php echo count($products); ?>)</span></div>
<div class="box-content products-block">
<?php foreach ($pr
oducts as $i => $product) { $i=$i+1; ?>
<?php if( $i%$cols == 1 && $cols > 1 ) { ?>
<div class="row product-related row-product">
<?php } ?>
<div class="col-lg-<?php echo $span;?>">
<div class="product-block">
<?php if ($product['thumb']) { ?>
<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>"
title="<?php echo $product['name']; ?>"
alt="<?php echo $product['name']; ?>"/></a>
</div>
<?php } ?>
<div class="name"><?php echo $product['name']; ?></div>
<div class="group-item">
<?php if ($product['rating']) { ?>
<div class="rating"><img
src="catalog/view/theme/<?php echo $this->config->get('config_template');?>/image/stars-<?php echo $product['rating']; ?>.png"
alt="<?php echo $product['reviews']; ?>"/></div>
<?php } ?>
<div class="price-cart">
<?php if ($product['price']) { ?>
<div class="price">
<?php if (!$product['special']) { ?>
<?php echo $product['price']; ?>
<?php } else { ?>
<span class="price-old"><?php echo $product['price']; ?></span> <span
class="price-new"><?php echo $product['special']; ?></span>
<?php } ?>
</div>
<?php } ?>
<div class="cart">
<input type="button" value="<?php echo $button_cart; ?>"
onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button"/>
</div>
</div>
</div>
<span class="wishlist"><a class="icon-heart" onclick="addToWishList('<?php echo $product_id; ?>');" data-placement="top" data-toggle="tooltip" data-original-title="<?php echo $button_wishlist; ?>"><span><?php echo $button_wishlist; ?></a></span></span>
<span class="compare"><a class="icon-retweet" onclick="addToCompare('<?php echo $product_id; ?>');" data-placement="top" data-toggle="tooltip" data-original-title="<?php echo $button_compare; ?>"><span><?php echo $button_compare; ?></a></span></span>
</div>
</div>
<?php if( $cols > 1 && ($i%$cols == 0 || $i==count($products)) ) { ?>
</div>
<?php } ?>
I am using this design http://bootsnipp.com/snippets/featured/store-product-layout
There is an option for related products in the product form in the admin panel. You can add related product there to show in the product tab.
To Add Related Products to a product:
In OpenCart admin panel navigate to Catalog -> Products
Search for the product you would like to add related products. Click
Edit link to edit it.
Choose Link tab and scroll down until you see the "Related Products" field.
Start typing a product name in that field and OpenCart will drop
down a list of products that start with whatever letters you have
typed in.
Click on the product you want to add as a related product. You will
see it added to the box below.
Repeat step 4-5 for others product you want to add.
Click on save button
Related products will be added to your product page.
i want to add additional information under the description for every product in the product page. At the moment i have added custom tab for the additional information, but i want it to be right after the description. I guess i have to edit some code in the product.tpl?
If You have created Your own tab for that additional informaation You already had to edit the product.tpl template file, hadn't You?
Now the only difference between displaying the information in additional tab and after the description part is where You echo Your piece of data... So probably what You have so far is something like:
<div id="tabs" class="htabs">
<?php echo $tab_description; ?>
<?php if ($attribute_groups) { ?>
<?php echo $tab_attribute; ?>
<?php } ?>
<?php if ($review_status) { ?>
<?php echo $tab_review; ?>
<?php } ?>
<?php if ($products) { ?>
<?php echo $tab_related; ?> (<?php echo count($products); ?>)
<?php } ?>
<!-- YOUR OWN TAB -->
<?php echo $tab_mytab; ?>
</div>
<div id="tab-description" class="tab-content"><?php echo $description; ?></div>
<?php if ($attribute_groups) { ?>
<div id="tab-attribute" class="tab-content">
<!-- ... -->
</div>
<?php } ?>
<?php if ($review_status) { ?>
<div id="tab-review" class="tab-content">
<!-- ... -->
</div>
<?php } ?>
<?php if ($products) { ?>
<div id="tab-related" class="tab-content">
<!-- ... -->
</div>
<?php } ?>
<!-- YOUR OWN TAB -->
<div id="tab-mytab" class="tab-content">
<?php echo $my_tab_content; ?>
</div>
Now what You only need to do is to move that <?php echo $my_tab_content; ?> right after the description (description tab):
<div id="tabs" class="htabs">
<?php echo $tab_description; ?>
<?php if ($attribute_groups) { ?>
<?php echo $tab_attribute; ?>
<?php } ?>
<?php if ($review_status) { ?>
<?php echo $tab_review; ?>
<?php } ?>
<?php if ($products) { ?>
<?php echo $tab_related; ?> (<?php echo count($products); ?>)
<?php } ?>
</div>
<div id="tab-description" class="tab-content">
<?php echo $description; ?>
<!-- YOUR OWN CONTENT HERE -->
<?php echo $my_tab_content; ?>
</div>
<!-- ... -->
If you need to add the same text on every product page, you can add it with 'welcome module'. Just put <?php echo $content_bottom; ?> in custom tab you added. Then create new welcome module in admin panel and place it at the bottom of product layout.
How do I insert only the pager in the bottom of product list?
At the top of the product list I want: "Sort by relevance/bestselers/etc" and the "Sort item by: Table/list", this I was able to do.
At the bottom of the product list I only want the pager, I've tried to insert the following code in list.phtml
<?php echo $this->getPagerHtml() ?>
but this php code doesn't work directly on the product list.
How can I make the pager work on the product list and appear at the bottom?
Hello you create new toolbar-bottom.phtml file with following code
i.e app/design/frontend/(base or default)/(default or yourtheme)/template/catalog/product/list/toolbar-bottom.phtml
<?php if ($this->getCollection()->getSize()): ?>
<div class="toolbar">
<div class="pager">
<p class="amount">
<?php if ($this->getLastPageNum() > 1): ?>
<?php echo $this->__('Items %s to %s of %s total', $this->getFirstNum(), $this->getLastNum(), $this->getTotalNum()) ?>
<?php else: ?>
<strong>
<?php echo $this->__('%s Item(s)', $this->getTotalNum()) ?>
</strong>
<?php endif; ?> </p>
<div class="limiter">
<label><?php echo $this->__('Show') ?></label>
<select onchange="setLocation(this.value)">
<?php foreach ($this->getAvailableLimit() as $_key => $_limit): ?>
<option value="<?php echo $this->getLimitUrl($_key) ?>"<?php if ($this->isLimitCurrent($_key)): ?> selected="selected"
<?php endif ?>
<?php echo $_limit ?>
</option>
<?php endforeach; ?>
</select>
<?php echo $this->__('per page') ?> </div> <?php
echo
$this->getPagerHtml()
?>
</div>
</div>
<?php endif ?>
call into bottom of line in app/design/frontend/(base or default)/(default or yourtheme)/template/catalog/product/list.phtml
getToolbarBlock()->setTemplate('catalog/product/list/toolbar-bottom.phtml')->toHtml();
You can do this one of two ways.
1) Using CSS
<div class="category-products">
<div class='top-toolbar'><?php echo $this->getToolbarHtml() ?></div>
...
<div class='bottom-toolbar'><?php echo $this->getToolbarHtml() ?></div>
</div>
In css
.bottom-toolbar .xyz{
display:none;
}
2) Using a Custom module to overwrite getToolbarHtml and
$this->getToolbarHtml('top-toolbar');
$this->getToolbarHtml('bottom-toolbar');
public function getToolbarHtml($toolbar_position)
{
$this->toolbar_position = $toolbar_position;
return $this->getChildHtml('toolbar');
}
Then try to pass $this->toolbar_position to each block to show the section you need
I think this is what you want.
$toolbar = $this->getToolbarBlock();
$toolbar->setCollection($_productCollection);
if($toolbar->getCollection()->getSize() > 0):
echo $toolbar->getPagerHtml(); //Pager
echo $toolbar-> __('Items %s to %s of %s total', $toolbar->getFirstNum(), $toolbar->getLastNum(),
$toolbar ->getTotalNum());
endif;
font:
http://mayankpatel104.blogspot.com.br/2012/07/magento-pagination-without-toolbar.html