Any update on this? Can we get this as a theme update (without paying extra as it’s improvement to the theme as the logo overlap with content in the body)
if you go to /js/scripts.js lines 263 to 297 you will see that background color for main elements is set function of the background type (light or dark)
I like to display the menu with non transparent colors (e.g. black) as background to every pages apart from home page. Or only to selected pages. How to call JS function? Is there any seperate plugins do that? Since the JS code executes on footer. Is there any documentation available regarding this? Thanks.
As I mentioned in my prev comment it's not difficult to modify the code to make the menu non-transparent.
Trouble is when you have to distinguish between pages and you java AJAX page transitions on.
Ajax page transitions will load the target page content container within the original page. Since the target page is not loaded normally the <head> and <body> elements will stay the same.
The unique page id is stored as unique CSS class in the <body> element - so that could be the only thing to rely on. Or, if the home page has the fullscreen slider you could test for '#showcase-holder' element existence with
Hello,
Please attached screen shots.
For example when you have text (eg: about us) and start to scroll, the text on menu will overlap with text in the body (Eg: Issue.png)
Can we have something like sticky menu bar activated when scrolling the content?
(Note: I don't need this bar in the home page, its ok to have on other pages )
That's custom work actually, you can always have the option of selecting the overlay menu (so that only the burger will be visible over text)
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Thanks for the reply. From where can I select the option for the overlay menu?
If you look at the mobile version you cant even read the text underneath the logo. I think It's nice if you could fix this in your theme as an update.
Ok, we will consider. You can also hide the logo only on mobile devices if this helps.
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Thanks for the reply...
for Mobile devices, I want to hide logo (except home page)
Hello,
plz try this:
@media screen and (max-width: 767px) {
#logo {
display: none;
}
.home div#logo {
display: table;
}
}
in customizer -> additional CSS
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Thank you for your world class support.
I want fix this error too. please see attached.
This is custom work and I will escalate it to our web designer
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Hello,
Any update on this? Can we get this as a theme update (without paying extra as it’s improvement to the theme as the logo overlap with content in the body)
thanks
Hello,
if you go to /js/scripts.js lines 263 to 297 you will see that background color for main elements is set function of the background type (light or dark)
https://prnt.sc/10age6a
what you need to do is to replace
$("header").css('background-color', 'transparent');
in various places with the color you want (so instead of transparent you will set the hex color code)
Hard refresh the page (Ctrl+F5) after you make the changes
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
How much do you charge to do this change on my site? (to show the background colour in the menu bar except home page)
I like to display the menu with non transparent colors (e.g. black) as background to every pages apart from home page. Or only to selected pages. How to call JS function? Is there any seperate plugins do that? Since the JS code executes on footer. Is there any documentation available regarding this? Thanks.
Hello,
As I mentioned in my prev comment it's not difficult to modify the code to make the menu non-transparent.
Trouble is when you have to distinguish between pages and you java AJAX page transitions on.
Ajax page transitions will load the target page content container within the original page. Since the target page is not loaded normally the <head> and <body> elements will stay the same.
The unique page id is stored as unique CSS class in the <body> element - so that could be the only thing to rely on. Or, if the home page has the fullscreen slider you could test for '#showcase-holder' element existence with
if( $('#showcase-holder').length > 0 ){
... code here if we are in the home page...
}
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Hi,
Thank you for the update.
When the following function and earlier function has been updated on the page, I am getting the following error message,
(index):471 Uncaught TypeError: $ is not a function.
Is it possible to assist me with this matter?
Thanks.
Of course where exactly did you add the code? can you give us more details and a screenshot?
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Following is the script.
<script>
if($('#showcase-holder').length <= 0 ){
$("header").css('background-color', '#000000');
}
</script>
Ok, try the following:
<script>
if( jQuery('#showcase-holder').length <= 0 ){
$("header").css('background-color', '#000000');
}
</script>
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Great thank you for the support!
It is working now!
Thanks.