You can try this:
Inn file: catalog/view/theme/YOUR-THEME/template/common/header.twig
find:
Add additional class like this:
An in your stylesheet.css add this style
Inn file: catalog/view/theme/YOUR-THEME/template/common/header.twig
find:
Code: Select all
<header>
<div class="container">
Code: Select all
<div class="container sticked-menu">
Code: Select all
.sticked-menu {
z-index: 1000; position: sticky; top: 0;
}
Custom OpenCart modules and solutions. You can write PM with additional questions... Extensions you can find here
thank you for your reply.kestas wrote: ↑Sat Jul 18, 2020 5:20 pmYou can try this:
Inn file: catalog/view/theme/YOUR-THEME/template/common/header.twig
find:Add additional class like this:Code: Select all
<header> <div class="container">
An in your stylesheet.css add this styleCode: Select all
<div class="container sticked-menu">
Code: Select all
.sticked-menu { z-index: 1000; position: sticky; top: 0; }
Where exactly should I add the style in my stylesheet.css?
thanks once again
yes he is sure.
Have you refreshed your caches? both in modifications top right and in dashboard top right cog
Cleared your browser cache?
Checked your server is not caching?
Checked you have done as instructed?
According to the weblink provided the header.twig has not been edited.
Nor can I see the css has been added.
Have you refreshed your caches? both in modifications top right and in dashboard top right cog
Cleared your browser cache?
Checked your server is not caching?
Checked you have done as instructed?
According to the weblink provided the header.twig has not been edited.
Nor can I see the css has been added.
DISCLAIMER:
You should not modify core files .. if you would like to donate a cup of coffee I will write it in a modification for you.
Spinning Social : Links : Menus : Payments : Socials : Ads : Screen Backgrounds : Galleries : Headers : Banners : Promos
Try attached modification.
- Tested on OC2302 and OC 3032
- adds style and script to all theme folders present, all header.* files
- Install using Extension - Installer
- Extension - Modifications : Refresh
Style:
Script:
- Tested on OC2302 and OC 3032
- adds style and script to all theme folders present, all header.* files
- Install using Extension - Installer
- Extension - Modifications : Refresh
Style:
Code: Select all
<style>
/* Sticky Nav */
#menu.sticky {
position: fixed;
left: 35px;
right: 35px;
top: 0;
z-index: 999999;
}
@media screen and (max-width: 768px) {
#menu.sticky {
left: 15px;
right: 15px;
}
}
</style>
Code: Select all
<script type="text/javascript"><!--
$(document).ready(function(){
var menuPos = $('#menu').offset().top;
var windowScrollTop = $(window).scrollTop();
if(windowScrollTop > menuPos){
$('#menu').addClass('sticky');
} else {
$('#menu').removeClass('sticky');
}
$(window).scroll(function(){
var windowScrollTop = $(this).scrollTop();
if(windowScrollTop > menuPos){
$('#menu').addClass('sticky');
} else {
$('#menu').removeClass('sticky');
}
});
});
//--></script>
I refreshed the cashes both in admin and browser. My server is not. You can't see any changes because when I didn't see any result I set it back to the default.by mona wrote: ↑Sat Oct 03, 2020 5:47 pmyes he is sure.
Have you refreshed your caches? both in modifications top right and in dashboard top right cog
Cleared your browser cache?
Checked your server is not caching?
Checked you have done as instructed?
According to the weblink provided the header.twig has not been edited.
Nor can I see the css has been added.
Thank you for your help though
hi,
you may use extension developed by me (free extension) available at https://www.opencart.com/index.php?rout ... n_id=27771
you may use extension developed by me (free extension) available at https://www.opencart.com/index.php?rout ... n_id=27771
Good Day,
Jagruti
opencart tips and tricks ,
opencart blogs , opencart extensions/themes , custom development.
Who is online
Users browsing this forum: No registered users and 9 guests