Post by mausz85 » Wed Nov 22, 2017 1:51 pm

Image
Any way to light up only the part showed in the picture? or change the color to make it different from the others?

New member

Posts

Joined
Wed May 24, 2017 3:04 pm

Post by kestas » Wed Nov 22, 2017 1:57 pm

Hi,

Use css.

Cheers

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am

Post by sachin6609 » Wed Nov 22, 2017 1:58 pm

mausz85 wrote:
Wed Nov 22, 2017 1:51 pm
Image
Any way to light up only the part showed in the picture? or change the color to make it different from the others?
Hello

Yes It is possible by some css tricks let me share the url i will Give you the css changes to do That

Thanks

Sachin

Active Member

Posts

Joined
Thu Jul 23, 2015 2:57 pm

Post by mausz85 » Wed Nov 22, 2017 2:15 pm

sachin6609 wrote:
Wed Nov 22, 2017 1:58 pm
mausz85 wrote:
Wed Nov 22, 2017 1:51 pm
Image
Any way to light up only the part showed in the picture? or change the color to make it different from the others?
Hello

Yes It is possible by some css tricks let me share the url i will Give you the css changes to do That

Thanks

Sachin
Website
http://www.led-biz.com

you mean this?

New member

Posts

Joined
Wed May 24, 2017 3:04 pm

Post by kestas » Wed Nov 22, 2017 4:00 pm

Hi
There are some tutorial:
https://stackoverflow.com/questions/268 ... rrent-page
Regarding this tutorial you should edit your stylesheet.css
and catalog/view/theme/default/template/common/header.tpl (or header.twig if OpenCart is 3 version).

Good Luck

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am

Post by mausz85 » Wed Nov 22, 2017 4:33 pm

kestas wrote:
Wed Nov 22, 2017 4:00 pm
Hi
There are some tutorial:
https://stackoverflow.com/questions/268 ... rrent-page
Regarding this tutorial you should edit your stylesheet.css
and catalog/view/theme/default/template/common/header.tpl (or header.twig if OpenCart is 3 version).

Good Luck
i already checked but i dont understand it :/, thx anyway!

New member

Posts

Joined
Wed May 24, 2017 3:04 pm

Post by kestas » Wed Nov 22, 2017 4:59 pm

ok
find your theme stylesheet.css open in some text editor like notepad or notepad++
find the code:

Code: Select all

#menu .nav > li > a {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px 15px;
    min-height: 15px;
    background-color: transparent;
}
below add:

Code: Select all

#menu .nav > li > a.active-page {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px 15px;
    min-height: 15px;
    background-color: #a94442;
}
where
background-color: #a94442;
is your color you can change.

next open in text editor catalog/view/theme/YOUR-THEME/template/common/header.tpl
find:

Code: Select all

 <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
change to:

Code: Select all

 <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle active-page" data-toggle="dropdown"><?php echo $category['name']; ?></a>
I have not tried, but it should work...

Good Luck

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am

Post by mausz85 » Wed Nov 22, 2017 5:07 pm

kestas wrote:
Wed Nov 22, 2017 4:59 pm
ok
find your theme stylesheet.css open in some text editor like notepad or notepad++
find the code:

Code: Select all

#menu .nav > li > a {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px 15px;
    min-height: 15px;
    background-color: transparent;
}
below add:

Code: Select all

#menu .nav > li > a.active-page {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px 15px;
    min-height: 15px;
    background-color: #a94442;
}
where
background-color: #a94442;
is your color you can change.

next open in text editor catalog/view/theme/YOUR-THEME/template/common/header.tpl
find:

Code: Select all

 <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
change to:

Code: Select all

 <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle active-page" data-toggle="dropdown"><?php echo $category['name']; ?></a>
I have not tried, but it should work...

Good Luck
#menu .nav > li > a {
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
padding: 10px 15px 10px 15px;
min-height: 15px;
background-color: transparent;
}

#menu .nav > li > a.active-page {
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
padding: 10px 15px 10px 15px;
min-height: 15px;
background-color: #a94442;
}

<li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>

i did as you wrote but nothing changed, any other ideas? anyway thx for the time helping me out!
I only want one button to be always lighted up not all

New member

Posts

Joined
Wed May 24, 2017 3:04 pm

Post by kestas » Wed Nov 22, 2017 5:21 pm

you did not do all
you need replace this line in your header.tpl

Code: Select all

<li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
with this one:

Code: Select all

<li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle active-page" data-toggle="dropdown"><?php echo $category['name']; ?></a>
because I have checked in your site and did not found this class="dropdown-toggle active-page" class where is active page defined.
Or maybe your header.tpl is not default. so to help I need your header.tpl file

you can write me PM
Last edited by kestas on Wed Nov 22, 2017 5:24 pm, edited 1 time in total.

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am

Post by mausz85 » Wed Nov 22, 2017 5:24 pm

kestas wrote:
Wed Nov 22, 2017 5:21 pm
you did not do all
you need replace this line in your header.tpl

Code: Select all

<li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
with this one:

Code: Select all

<li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle active-page" data-toggle="dropdown"><?php echo $category['name']; ?></a>
because I have checked in your site and did not found this class="dropdown-toggle active-page" class where is active page defined.
i did just now but nothing changed

New member

Posts

Joined
Wed May 24, 2017 3:04 pm

Post by kestas » Wed Nov 22, 2017 6:11 pm

Please write me PM and send your header.tpl and stylesheet.css files to me. I'll check it.

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am

Post by kestas » Thu Nov 23, 2017 9:21 pm

The first post with suggestions was wrong.

I just checked and this is working solution

So in your catalog/view/theme/default/template/common/header.tpl in the end of the file after last
<?php } ?>
add this script:

Code: Select all

<script>
$(document).ready(function() {
  var url = window.location.href; 
    $("#menu a").each(function() {
         if(url == (this.href)) { 
            $(this).parents("li:last").addClass("active");
        }
    });
});
</script>
and in your stylesheet.css file add:

Code: Select all

#menu .nav > li.active > a  {
	background-color: lightblue;
}
where
lightblue
is your color you can change to your desired.

Custom OpenCart modules and solutions. Just PM me... Extensions you can find here and here


Active Member

Posts

Joined
Tue Oct 12, 2010 2:23 am
Who is online

Users browsing this forum: No registered users and 10 guests