Hi, on our landing page, we have assigned a page and are using the showcase template for that page, we have assigned the header image, light and dark, however when we scroll / flip through the folio pieces on the landing page the header logo, does not change from light to dark and visa versa when there is a light image set as the hero.
We have tried to set the portfolio options to white on any folio page that has a white hero image, but the header and menu do not change to black, this makes the site logo and menu disappear or blend in with the background image on the landing page.
Is there any setting or css code that needs to be applied to the header / folio item page or folio landing page that will fix this issue as it is crucial for interface operation.
If you select background color to Black the text & logo will show white/light and the other way around
Second, in the portfolio content if you want to have a section/container which reverts the logo when scrolling over, you can also add the class change-header-color
sorry not working for me still . . . it only changes when you click the slide link, the problem is when the site loads to the home page, and a slider with a white background image doesnt switch the menu and header image to black, I still think that some code or css needs to be injected into the actual slider template page to explicitly tell the slider that when there is a slider image with a white or light colour background that it should switch to black - or explicitly target the slide ID number and tell the slider to switch the header to black when slide id768 / name etc. is loaded
cool, if you can let me know asap as Im almost finished, if there are issues I can get our developer to look at it to speed things up, i have actually told him to look at into now, but they won't edit anything except show some possible solutions, it would beat if we could have a solution by tomorrow.
<div class="swiper-slide<?php if( $bauman_bknd_color == "dark-content" ) { echo " change-header"; } ?>"... rest of the code follows...
- then you can add CSS for it, for example
.light-content .change-header .title {
color: #fff; }
- then dynamically in /js/scripts.js you should change dynamically the color of the header and footer elements (for example adding a CSS class white-header and white-footer )
Hi, on our landing page, we have assigned a page and are using the showcase template for that page, we have assigned the header image, light and dark, however when we scroll / flip through the folio pieces on the landing page the header logo, does not change from light to dark and visa versa when there is a light image set as the hero.
We have tried to set the portfolio options to white on any folio page that has a white hero image, but the header and menu do not change to black, this makes the site logo and menu disappear or blend in with the background image on the landing page.
Is there any setting or css code that needs to be applied to the header / folio item page or folio landing page that will fix this issue as it is crucial for interface operation.
Thanks
Aldo
Hello Aldo,
if you can:
- provide wp admin access in a private comment (admin login URL, admin username & password)
- indicate the page where the logo does not change (page URL)
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 Aldo,
first of all to change the color of text over hero section you need to change its background type in portfolio item options:
https://prnt.sc/26cppax
If you select background color to Black the text & logo will show white/light and the other way around
Second, in the portfolio content if you want to have a section/container which reverts the logo when scrolling over, you can also add the class change-header-color
https://prnt.sc/26cpqid
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,
sorry not working for me still . . . it only changes when you click the slide link, the problem is when the site loads to the home page, and a slider with a white background image doesnt switch the menu and header image to black, I still think that some code or css needs to be injected into the actual slider template page to explicitly tell the slider that when there is a slider image with a white or light colour background that it should switch to black - or explicitly target the slide ID number and tell the slider to switch the header to black when slide id768 / name etc. is loaded
HI Aldo,
ok, I see what you mean. We will try to address this as soon as possible.
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 Support,
cool, if you can let me know asap as Im almost finished, if there are issues I can get our developer to look at it to speed things up, i have actually told him to look at into now, but they won't edit anything except show some possible solutions, it would beat if we could have a solution by tomorrow.
Thanks
A.
Hello Aldo,
while waiting you can try the following in showcase:
- read the background type property with
$bauman_bknd_color = bauman_get_post_meta( BAUMAN_THEME_OPTIONS, get_the_ID(), 'bauman-opt-portfolio-bknd-color' );
add the code before/after line 60
- assign a class if the bknd color is different
<div class="swiper-slide<?php if( $bauman_bknd_color == "dark-content" ) { echo " change-header"; } ?>"... rest of the code follows...
- then you can add CSS for it, for example
.light-content .change-header .title {
color: #fff;
}
- then dynamically in /js/scripts.js you should change dynamically the color of the header and footer elements (for example adding a CSS class white-header and white-footer )
if ($this.hasClass("change-header")) {
setTimeout( function(){
$('header').addClass('white-header');
} , 10 );
}
in slider's transitions
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