<style> /* bhoechie tab */ div.bhoechie-tab-container{ z-index: 10; background-color: #ffffff; padding: 0 !important; border-radius: 4px; -moz-border-radius: 4px; border:1px solid #ddd; margin-top: 20px; margin-left: 1px; -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); box-shadow: 0 6px 12px rgba(0,0,0,.175); -moz-box-shadow: 0 6px 12px rgba(0,0,0,.175); background-clip: padding-box; opacity: 0.97; filter: alpha(opacity=97); width:98%; } div.bhoechie-tab-menu{ padding-right: 0; padding-left: 0; padding-bottom: 0; } div.bhoechie-tab-menu div.list-group{ margin-bottom: 0; } div.bhoechie-tab-menu div.list-group>a{ margin-bottom: 0; } div.bhoechie-tab-menu div.list-group>a .glyphicon, div.bhoechie-tab-menu div.list-group>a .fa { color: #5A55A3; } div.bhoechie-tab-menu div.list-group>a:first-child{ border-top-right-radius: 0; -moz-border-top-right-radius: 0; } div.bhoechie-tab-menu div.list-group>a:last-child{ border-bottom-right-radius: 0; -moz-border-bottom-right-radius: 0; } div.bhoechie-tab-menu div.list-group>a.active, div.bhoechie-tab-menu div.list-group>a.active .glyphicon, div.bhoechie-tab-menu div.list-group>a.active .fa{ background-color: #5A55A3; background-image: #5A55A3; color: #ffffff; } div.bhoechie-tab-menu div.list-group>a.active:after{ content: ''; position: absolute; left: 100%; top: 50%; margin-top: -13px; border-left: 0; border-bottom: 13px solid transparent; border-top: 13px solid transparent; border-left: 10px solid #5A55A3; } div.bhoechie-tab-content{ background-color: #ffffff; /* border: 1px solid #eeeeee; */ padding-left: 20px; padding-top: 10px; } div.bhoechie-tab div.bhoechie-tab-content:not(.active){ display: none; } </style> <script type="text/javascript"> $(document).ready(function() { $("div.bhoechie-tab-menu>div.list-group>a").click(function(e) { e.preventDefault(); $(this).siblings('a.active').removeClass("active"); $(this).addClass("active"); var index = $(this).index(); $("div.bhoechie-tab>div.bhoechie-tab-content").removeClass("active"); $("div.bhoechie-tab>div.bhoechie-tab-content").eq(index).addClass("active"); }); }); </script> <div class="container"> <div class="row"> <div class="col-lg-5 col-md-5 col-sm-8 col-xs-9 bhoechie-tab-container"> <div class="col-lg-3 col-md-4 col-sm-4 col-xs-4 bhoechie-tab-menu" style="width:25%;"> <div class="list-group" > <?php foreach ($categories as $category) { ?> <a href="#" class="list-group-item text-center"> <h4><img src="<?php echo $category['thumbx']; ?>" alt="<?php echo $category['name']; ?>"></h4><br/><?php echo $category['name']; ?> </a> <?php } ?> </div> </div> <?php foreach ($categories as $category) { ?> <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9 bhoechie-tab"> <!-- flight section --> <div class="bhoechie-tab-content active"> <center> <div class="row"> <?php foreach ($category['products'] as $product) { ?> <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12"> <div class="product-thumb transition"> <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" /></a></div> <div> <h4><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></h4> <?php if ($product['rating']) { ?> <div class="rating"> <?php for ($i = 1; $i <= 5; $i++) { ?> <?php if ($product['rating'] < $i) { ?> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-2x"></i></span> <?php } else { ?> <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i class="fa fa-star-o fa-stack-2x"></i></span> <?php } ?> <?php } ?> </div> <?php } ?> <?php if ($product['price']) { ?> <p class="price"> <?php if (!$product['special']) { ?> <?php echo $product['price']; ?> <?php } else { ?> <span class="price-new"><?php echo $product['special']; ?></span> <span class="price-old"><?php echo $product['price']; ?></span> <?php } ?> <?php if ($product['tax']) { ?> <span class="price-tax"><?php echo $text_tax; ?> <?php echo $product['tax']; ?></span> <?php } ?> </p> <?php } ?> </div> <div class="button-group"> <button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $button_cart; ?></span></button> <button type="button" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="wishlist.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-heart"></i></button> <button type="button" data-toggle="tooltip" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-exchange"></i></button> </div> </div> </div> <?php } ?> </div> </center> </div> <!-- train section --> </div> <?php } ?> </div> </div> </div> <script> $(document).ready(function(){ $(".bhoechie-tab-menu div.list-group a:first").trigger('click'); //$(".bhoechie-tab-menu div.list-group > a.list-group-item").hover(function(){$(this).trigger('click');}); }); </script>


" />

Opencart 2.2.0.0 Categorical Product Tab Mega Menu Modul

Opencart 2.2.0.0 Categorical Product Tab Mega Menu Modul






Everyone hello friends this evening we will come up with the installation and use of the skin left mega menu, an appearance-like plug-in by editing the categorical product mode for OpenCart 2.2 versions together with you. This add-on normally has an interface with friends that looks like the latest added products, for example OpenCart. The work done this evening will allow the products to be displayed in a panel so that when the left or right side is added, the products are opened to the left and right side. I did not encounter any problems in the end of the test that I have done with Opencart's default theme. The plugin version can work well OpenCart 2.2 .


Opencart 2.2.0.0 Categorical Product Mega Menu Modular Setup


Now to mention a little about my friends setup, there is no difference from what is related to the setup of normal banner patterns. We open the archive file that you downloaded from our site and put the catalog and admin folders in the main directory where our site is installed. Then login to the admin panel of our site and then click on the Add-ons module on the left side and install the categorical products module on the opened page. After the installation is complete, click the edit button on the left side. In the opening page, the settings section of the extension meets. We can select the category we want here, enter the number of pieces for displaying as many items as we want and mark the plug-in status as open. If you want to show the section where you want to be displayed again, click on the Add Module button on the pop-up page and select the composition and order you want the plugin to appear in and click on the slider.


Note :If you are having problems with the tab view, do the following


File Open: caalog/view/theme/default/template/module/


productcategory.tpl


All Raplace.




Write a review

Note: HTML is not translated!
    Bad           Good


60% Complete
HTML / HTML560%
40% Complete (success)
ASP.Net40%
20% Complete (info)
Java20%
60% Complete (warning)
JavaScript / jQuery60%
80% Complete (danger)
CSS / CSS380%
Download
  • Developed by OpenCart Community
  • Documentation Included

File Name
oc2-2-0-tab-mega-menu.zip

File Size
(16.91KB)

Rating


Compatibility
2.2.0.0

Duration
14.00 '

Last Update
18/10/2018

Created
18/10/2018
650 Downloads
Reviews (0)
Opencart

Opencart

Member since: 21 Oct 2011

View all extensions Get Support

Latest Article
Opencart 2.3.x Notification Add To Cart Admin Controls Module
Opencart 2.3.x Notification Add To Cart Admin Controls ModuleOpencart 2.3.x Notification Add To Cart Admin Controls ModuleOpencart 2.3.x Notification Add To Cart Admin Controls ModuleReviews (0)

Opencart 2.3.x Notification Add To Cart Admin Controls Module

Everyone is welcome to appear in a window for a window that has been hired earlier than hello and more. Opencart is starting to be used in standard themes that come with default installations. The layer is constantly getting boring after a while and it has a negative effect on the interest of the customer. We need to use this cell and we have to help. and we guarantee its place at the opening pages. Opencart 2.3.x Notification Sepete Add Admin Controlled Module Features 1-) Resinisation of Added Product Displayed 2-) Added Product Name And Link Display 3-) In addition to the list of buses and bearings to be added. Opencart 2.3...

Module SetupOpencart03/04/2019 372 More ...
Opencart 2.2.x Product In Detail Cargo Release Date Addition
Opencart 2.2.x Product In Detail Cargo Release Date AdditionOpencart 2.2.x Product In Detail Cargo Release Date AdditionOpencart 2.2.x Product In Detail Cargo Release Date AdditionReviews (0)

Opencart 2.2.x Product In Detail Cargo Release Date Addition

Hello friends today we will review together a nice modification setup and use of our related articles. In this article, we will enter the date of cargo delivery of the product of the customer belonging to that product on the addition of the product by admin for OpenCart 2.2 versions or the product detail, and that product detail will be displayed as visitor or customer day, month and year. For example, this product will be given cargo on June 25, 2018. Before installation, this process will be done manually from the database, as well as from the model and controller, as well as tpl files, so we strongly recommend that you back up these files ..

Modification SetupOpencart02/04/2019 406 More ...
Opencart 3.x Distance Sales Contract Page Insert
Opencart 3.x Distance Sales Contract Page Insert Opencart 3.x Distance Sales Contract Page Insert Opencart 3.x Distance Sales Contract Page Insert Reviews (0)

Opencart 3.x Distance Sales Contract Page Insert

Hello friends, as of today, OpenCart 3.x versions are available on the checkout order page, as well as the sales contract, in addition to the sales contract, you will be required to read and agree with the long distance contract of the product you purchased in your long distance sales. This text is also available on this page. In general, the information of the purchaser specifies the information of the seller, the contract document in accordance with the long distance commercial trade, the purchased product, and the total amount of holding the buyer specifies the purchaser. In the following time, I think that this contract document can be in..

Modification Setup11/01/2019 688 More ...
Opencart 2.3.x Distance Sales Contract Page Insert
Opencart 2.3.x Distance Sales Contract Page Insert Opencart 2.3.x Distance Sales Contract Page Insert Opencart 2.3.x Distance Sales Contract Page Insert Reviews (0)

Opencart 2.3.x Distance Sales Contract Page Insert

Hello friends, as of today, OpenCart 2.3.x versions are available on the checkout order page, as well as the sales contract, in addition to the sales contract, you will be required to read and agree with the long distance contract of the product you purchased in your long distance sales. This text is also available on this page. In general, the information of the purchaser specifies the information of the seller, the contract document in accordance with the long distance commercial trade, the purchased product, and the total amount of holding the buyer specifies the purchaser. In the following time, I think that this contract document can be ..

Modification Setup11/01/2019 680 More ...
Opencart 2.3.x Free Shipping Module
Opencart 2.3.x Free Shipping ModuleOpencart 2.3.x Free Shipping ModuleOpencart 2.3.x Free Shipping ModuleReviews (0)

Opencart 2.3.x Free Shipping Module

Hello, This evening, Opencart 2.3.x versions of the products added by the admin will display a label in the charge of non-charge cargo mark. When the free shipping button on the data tab in the product add or change page is activated, the product image will be written free of charge in the modules. These labels are designed in a more stylish design by defining individual css images in the latest product module, in the campaign product module, in the product module you select and in each of the best-selling product modules. With this new arrangement, it no longer interferes with any of the different codes from different codes, and only the def..

Module SetupOpencart28/10/2018 765 More ...
Opencart White Space Removal In Photos
Opencart White Space Removal In PhotosOpencart White Space Removal In PhotosOpencart White Space Removal In PhotosReviews (0)

Opencart White Space Removal In Photos

Everyone hello friends we are with a sine qua non modification for OpenNcart versions. As site owners, we always add our images that are added to dynamic pages such as category product branding images in a certain size and image format, but it adds white as background to our pictures if it is added to the pictures due to the resize function that comes with the standard version of OpenCart. This is also annoying, giving it a bad appearance. Now we will do this by modifying the white space and changing the single file so that we can fit our picture exactly in the specified position.   Opencart Picture Whitening Removal Setup File ..

Modification SetupOpencart23/12/2018 838 More ...
Opencart 2.2.0.0 Distance Sales Contract Page Insert
Opencart 2.2.0.0 Distance Sales Contract Page Insert Opencart 2.2.0.0 Distance Sales Contract Page Insert Opencart 2.2.0.0 Distance Sales Contract Page Insert Reviews (0)

Opencart 2.2.0.0 Distance Sales Contract Page Insert

Hello friends, as of today OpenCart 2.2.0.0 versions are available on the checkout order page in addition to the sales contract, you will be required to read and accept the long distance contract of the product you purchased to your customers in long distance sales, This text is also available on this page. In general, the information of the purchaser specifies the information of the seller, the contract document in accordance with the long distance trade law, the purchased product, and the total amount holding the buyer. In the following time, I think that this contract document can be input by admin. Opencart 2.2.0.0 Distance Sales Contr..

Modification SetupOpencart20/12/2018 555 More ...
Opencart 2.x  Evolution Zoom  Product Page Swap  Additional Images
Opencart 2.x Evolution Zoom Product Page Swap Additional ImagesOpencart 2.x Evolution Zoom Product Page Swap Additional ImagesOpencart 2.x Evolution Zoom Product Page Swap Additional ImagesReviews (0)

Opencart 2.x Evolution Zoom Product Page Swap Additional Images

Everyone hello friends this evening OpenCart 2.x versions of the current version of the detail page in the photos and zoom features and we'll tell you how to use.Evolution Zoom Product Page What is Swap Additional Images Articles ?Opencart 2.x default installations come with the magnet thumb feature. The details in the product detail are in the form of popu-nen- you can use it in normal desktop viewings and also in the use of mobile devices. This plug-in also adds the main picture zoom feature, while the additional image that is clicked when the product's additional images are clicked also zooms in as it passes through the picture. Which disp..

Modification SetupOpencart11/12/2018 767 More ...