Page 1 of 1

How to customise navigation drop-menu e.g. 3 or more deep?

Posted: Thu Jul 28, 2011 12:06 am
by benfrain.com
First of all, my first post here 'hello all!'

Also my first time building with OpenCart (v1.5.0) - cracking bit of kit mind and liking the experience. I just have a few questions with tempting and I'm hoping some kind soul can point me in the right direction:

Multi Level Drops
I'd like my navigation to be three (possibly more) deep e.g.

Shop
> Product Main Category
> Product Sub Cat

I've found some pages in Google (e.g. http://craigmurray.me.uk/opencart-mods/ ... -opencart/ and http://www.shahz.net/web-development/op ... -list.html that address the issue but they don't seem to work in 1.5.

Does anyone know how this can be fixed?

Drops for Other Lists?
Also, I'd like my navigation menu to include drops for the 'Information' and 'Customer Service' <ul> lists. I tried copying and pasting in the parts they are called in the footer e.g.

Code: Select all

<h3><?php echo $text_information; ?></h3>
      <ul>
        <?php foreach ($informations as $information) { ?>
        <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
        <?php } ?>
      </ul>
Put that just give me a PHP error: "Notice: Undefined variable: text_information" so presumably I need something else in there too?

As you've no doubt gathered I'm not experienced with PHP, being more of a front end chap so any pointers greatly appreciated.

Thanks - Ben

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Thu Jul 28, 2011 12:10 am
by uksitebuilder
cant help much with the categories but for the footer info, basically each .tpl file has an associated controller .php file

so if you are moving code from the footer to the header, you will also need to move the associated code from the footer controller to the header controller

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Thu Jul 28, 2011 12:37 am
by benfrain.com
Hi Simon, great stuff. Thanks.

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Tue Aug 02, 2011 10:10 pm
by benfrain.com
In case anyone else needs to do this in future, here is how I copied the Information pages lists into the menu bar (to work as a drop down list similar to the products).

This is based on a v1.5.0 installation:


Copy the following from the footer controller file: opencart/catalog/controller/common/footer.php

Code: Select all

$this->language->load('common/footer');
		
		$this->data['text_information'] = $this->language->get('text_information');
		$this->data['text_service'] = $this->language->get('text_service');
		$this->data['text_extra'] = $this->language->get('text_extra');
		$this->data['text_account'] = $this->language->get('text_account');
		$this->data['text_contact'] = $this->language->get('text_contact');
		$this->data['text_return'] = $this->language->get('text_return');
    	$this->data['text_sitemap'] = $this->language->get('text_sitemap');
		$this->data['text_manufacturer'] = $this->language->get('text_manufacturer');
		$this->data['text_voucher'] = $this->language->get('text_voucher');
		$this->data['text_affiliate'] = $this->language->get('text_affiliate');
		$this->data['text_special'] = $this->language->get('text_special');
		$this->data['text_login'] = $this->language->get('text_login');
		$this->data['text_order'] = $this->language->get('text_order');
		$this->data['text_wishlist'] = $this->language->get('text_wishlist');
		$this->data['text_newsletter'] = $this->language->get('text_newsletter');
		
		$this->load->model('catalog/information');
		
		$this->data['informations'] = array();

		foreach ($this->model_catalog_information->getInformations() as $result) {
      		$this->data['informations'][] = array(
        		'title' => $result['title'],
	    		'href'  => $this->url->link('information/information', 'information_id=' . $result['information_id'])
      		);
    	}

		$this->data['contact'] = $this->url->link('information/contact');
		$this->data['return'] = $this->url->link('account/return/insert', '', 'SSL');
    	$this->data['sitemap'] = $this->url->link('information/sitemap');
		$this->data['manufacturer'] = $this->url->link('product/manufacturer', '', 'SSL');
		$this->data['voucher'] = $this->url->link('checkout/voucher', '', 'SSL');
		$this->data['affiliate'] = $this->url->link('affiliate/account', '', 'SSL');
		$this->data['special'] = $this->url->link('product/special');
		$this->data['login'] = $this->url->link('account/login', '', 'SSL');
		$this->data['order'] = $this->url->link('account/order', '', 'SSL');
		$this->data['wishlist'] = $this->url->link('account/wishlist', '', 'SSL');
		$this->data['newsletter'] = $this->url->link('account/newsletter', '', 'SSL');		

		$this->data['powered'] = sprintf($this->language->get('text_powered'), $this->config->get('config_name'), date('Y', time()));
		
		if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/common/footer.tpl')) {
			$this->template = $this->config->get('config_template') . '/template/common/footer.tpl';
		} else {
			$this->template = 'default/template/common/footer.tpl';
		}
		
		$this->render();
And insert it into the top (line 4 onwards in v1.5.0) of opencart/catalog/controller/common/header.php after the following lines:

Code: Select all

<?php   
class ControllerCommonHeader extends Controller {
	protected function index() {
Save the file.

Now amend the header.tpl in your theme and add the following section where you need the Information list to appear. Note the code here was added after the

Code: Select all

<div id="menu">
to make the Information list appear in the menu bar as a drop-down. Alter the ul and li tags if you need it to display differently elsewhere:

Code: Select all

<ul>
  	<li>
  		<a href="#"><?php echo $text_information; ?></a>
      	<div>
      		<ul><?php foreach ($informations as $information) { ?>
        		<li>
        			<a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a>
        		</li>
        <?php } ?>
        	</ul>
    </li>
  </ul>
That should be it, the Information pages should be in the relevant place and can now be styled at will with CSS.

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Tue Nov 01, 2011 12:22 am
by pitkin2020
ok I seem to be able to manage to get part of this working lol on v1.5.1.3.1. I really have no clue about PHP lol

I ammended the header.php by copying the information as above from the footer .php. I got the information drop down to work fine, but i come unstuck when trying to add the customer service drop down

here is the code in the header.tpl

Code: Select all

<div id="menu">
  	  <ul>
     <li>
        <a href="#"><?php echo $text_information; ?></a>
         <div>
            <ul><?php foreach ($informations as $information) { ?>
              <li>
                 <a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a>
              </li>
        <?php } ?>
           </ul>
    </li>
  </ul>
  <ul>
     <li>
        <a href="#"><?php echo $text_service; ?></a>
         <div>
            <ul><?php foreach ($services as $service) { ?>
              <li>
                 <a href="<?php echo $service['href']; ?>"><?php echo $service['title']; ?></a>
              </li>
        <?php } ?>
           </ul>
    </li>
  </ul>
as you can see here www.savvysigns.co.uk one of the drop downs works fine the other not so good.

In reality all I want really is to add home, contact (maybe some others into that bar) as I don't want the catergories to appear there but still want the bar with some basic functions.

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Sun Feb 19, 2012 2:29 am
by JackDavis
Hi,

I have written a blog post showing how to completely customise the OpenCart navigation bar. It's at:

http://www.jackwdavis.com/2012/02/18/cu ... ation-bar/

Hope this helps, let me know how it works out for you!

Cheers,

Jack

Re: How to customise navigation drop-menu e.g. 3 or more dee

Posted: Fri Mar 02, 2012 6:58 am
by eleven28
@benfrain.com
Thanks, worked in 1.5.1.3, but I only needed to use a little bit of that code from the footer.php (controller) in my header.php, not the whole thing.

Ended up with

Code: Select all

$this->language->load('common/footer');
		
		$this->data['text_information'] = $this->language->get('text_information');
				
		$this->load->model('catalog/information');
		
		$this->data['informations'] = array();

		foreach ($this->model_catalog_information->getInformations() as $result) {
      		$this->data['informations'][] = array(
        		'title' => $result['title'],
	    		'href'  => $this->url->link('information/information', 'information_id=' . $result['information_id'])
      		);
    	}
				
		if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/common/footer.tpl')) {
			$this->template = $this->config->get('config_template') . '/template/common/footer.tpl';
		} else {
			$this->template = 'default/template/common/footer.tpl';
		}
		
		$this->render();
Other than that, works great! Thanks.