FOLLOW-UP:
To clarify, I marked the previous thread from last year as resolved because I did not want to be solicited by independent “fixers” offering to resolve issues with the Sydney theme.
This morning, the President & CEO of BGM Canada informed me that three people contacted him directly on his work phone, offering to fix the issue after seeing there was a problem with the Sydney theme. He had to block them.
Please, to anyone reading this: do not contact company executives on their personal or work phones, as it is disruptive — they already have plenty of responsibilities and client messages to manage.
I will now wait for the Sydney theme support team’s reply, as I only want to confirm whether the issue will be fixed. The problem is a conflict with the Google Language Translator plugin, so it needs to be resolved between the Sydney theme support team and the Google Language Translator plugin support team.
https://en-ca.wordpress.org/plugins/gtranslate/
Thank you for your understanding.
Hi @isabelleroger,
Thanks for reaching out to Sydney Support.
To ensure we provide the correct solution to your issue, could you please share a screenshot showing how the page is meant to look when the Google Language Translator is disabled? This will allow me to compare it with the screenshot of the page when the plugin is enabled, helping me understand the differences and apply the appropriate CSS to fix the issue.
In case it helps to share, I modified the custom CSS provided in the previous topic to target the #content element, and this is the result.
@media only screen and (min-width: 960px) {
#content {
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
}
If this is the layout you’re looking for, just let me know.
Thanks.
Hello,
Thanks for the CSS code. Unfortunately, it doesn’t change anything — even with the updated result. The issue is that the red section on the homepage is too large. This problem doesn’t appear on the other pages. And honestly, I’d actually prefer the white section to be larger.
On the homepage, due to the conflict caused by the plugin mixed with sydney theme, I can slide the page to the left, and the red section extends way too far. This issue only happens on the homepage, not on the other pages.
If I deactivate the plugin that causes the conflict, the page no longer slides to the left at all — and that’s exactly how it should be.
By clicking on this link, you will see the images showing the problem when the plugin is active, and the absence of the problem when the plugin is deactivated.
https://imgur.com/a/aSxAn3K
Thank you !
Oh, and if you want to compare:
This website has the plugin activated: https://bgmcanada.ca/
This website has the plugin deactivated: https://bgmcanada.com/
Hi @isabelleroger,
Thank you for sharing these details; I now understand the issue more clearly.
From my tests, this issue seems to occur specifically with Chrome and MS Edge, while Firefox and Safari appear to handle it correctly.
Could you please try adding the following CSS under Appearance > Customize > Additional CSS and let me know if it resolves the problem?
body.home.custom-background {
background-image: url(https://bgmcanada.ca/wp-content/uploads/2018/08/rouger1920x1080.2.jpg);
background-position: center center !important;
background-size: cover !important;
background-repeat: no-repeat !important;
background-attachment: fixed !important;
}
Remember to remove the custom CSS I shared yesterday.
Thanks.
Ok, I have tried it and the problem is still there even with the new css code you gave me and the cache emptied :
body.home.custom-background {
background-image: url(https://bgmcanada.ca/wp-content/uploads/2018/08/rouger1920x1080.2.jpg);
background-position: center center !important;
background-size: cover !important;
background-repeat: no-repeat !important;
background-attachment: fixed !important;
}
I removed the precedent one from the Appearance > Customize > Additional CSS
@media only screen and (min-width: 960px) {
#content {
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
}
But you gave me this css code also last year:
@media only screen and (max-width: 767px) {
.page-wrap {
padding-left: 15px;
padding-right: 15px;
}
}
Should I remove that also or it’s for something else ?
and I see that there is another one that you gave me probably 2 years ago
.page-wrap .content-area {
padding-left: 15px;
padding-right: 15px;
}
I mean I don’t know if all the CSS codes that are there belong there… !!!
Thanks
Hi @isabelleroger,
Thanks for keeping in touch.
To speed things up, would you mind dropping us a line via our contact form so that we can check if there is an edge case bug that is causing this issue?
Thank you!
Ok, I will so that. Thanks
Thank you for your help Rajab Said (@snrjosh)
The issue is resolved and I am very happy.
