[marcofama]

hey guys, any news on this instead? :(

I heard Elementor Pro might have a “Sticky Header Offset” which could possibly work? do you have a chance to try that? cause I don’t have a Pro license, obviously…

Thanks for giving us updates on this matter

[marcofama]

hey serkan, you are right and that’s weird – placing it at the top makes it work!
unbelievable… ok thank u a lot!

[marcofama]

I’m sorry serkan but not sure if you tried it on your end, but this doesn’t do anything… please see this
https://d.pr/i/dog6f2

thanks

[marcofama]

Anyone on this? thanks

[marcofama]

Hi Serkan,

Thank you for continuing to support this issue — but I really need to express how deeply frustrating this has become.

I have followed all the troubleshooting steps you suggested:
– I have created a stripped-down debug page, containing only two sections: a large block of text and a simple #chi-siamo section, made up of plain text. No animations, no dynamic content, no JavaScript, nothing.

– I have deactivated all non-essential plugins, as you can clearly see in the attached screenshot — only Elementor and system-critical plugins remain.

– I have thoroughly cleared the entire cache, both on the browser and server side.

Yet, the issue still persists: on mobile, clicking the anchor link to #chi-siamo still scrolls to the wrong position, only on first click, regardless of the layout simplicity or animation status. And also even REGARDLESS of the page content: again, check the debug page, it’s ONLY TEXT now.

I also applied every workaround we’ve discussed so far:
– scroll-margin-top and scroll-padding-top via CSS — no change
– custom JavaScript to override scroll behavior with offsets and even delayed double-scroll — ineffective
– using IntersectionObserver to wait until the element was rendered before performing a forced scroll — no change
– replacing the anchor links with custom attributes and triggering the scroll entirely through JavaScript — also failed

I can now confidently say that this is not an animation issue, nor a plugin conflict, nor a layout-shift caused by dynamic content. It’s a deeply rooted problem tied to the theme or template behavior on mobile anchor scrolling.

At this point, I’m investing an unreasonable number of hours trying to make this work. My client is understandably pressing to launch, and frankly, I can’t tell him that a basic scroll-to-anchor doesn’t work because of a template bug.

So please — I kindly ask that you do everything in your power to help resolve this issue.

Here is the debug page I mentioned, with no animation or layout complexity, where the problem can be reproduced in its pure form (check below in the private area)

Let me know what additional logs or steps I can provide — but I’d really appreciate if your team could take this issue seriously and try to reproduce and fix it directly in the theme code or whatever it is guys.

Thank you again for your time and support,
Marco

PS: feel free to deactivate any plugins on the site, do whatever it takes (just don’t delete the content or any our plugins eheh) to debug and fix this

[marcofama]

Honestly speaking Ahmet? I’m getting mad on this

even on the backup page the behaviour appears and there is no way to understand what that is because even following your advice, the moment you introduce the section again it goes f**** again

Not only – I also tried creating a “test” anchor a few paragraphs higher: the scroll scrolls even HIGHER again

:/

What should I do? :/ I’ve never seen anything like this before

[marcofama]

hey Ahmet, thanks for taking a look at it.

So my question is: how do you suggest we proceed on this? :/ if you can’t figure it out too, I’m a bit lost :)

thanks a lot

[marcofama]

Hi Serkan,

Thanks again for your detailed reply and the helpful suggestions — I really appreciate your support.

Unfortunately, both your proposed solution and an adjusted version like this:

document.addEventListener(“DOMContentLoaded”, function () {
const isMobile = window.innerWidth <= 768; if (!isMobile) return; // Solo su mobile const anchor = document.querySelector(‘a[href=”#chi-siamo”]’); const target = document.getElementById(‘chi-siamo’); if (!anchor || !target) return; anchor.addEventListener(“click”, function (e) { e.preventDefault(); const offset = 50; const y = target.getBoundingClientRect().top + window.scrollY – offset; // Primo scroll window.scrollTo({ top: y, behavior: “smooth” }); // Secondo scroll (dopo layout stabilito) setTimeout(() => {
const newY = target.getBoundingClientRect().top + window.scrollY – offset;
window.scrollTo({ top: newY, behavior: “smooth” });
}, 400);
});
});

didn’t resolve the issue.

We’re still experiencing the same behavior: the #chi-siamo anchor scrolls to the wrong position on the first click from the top of the page on mobile, and only works correctly on the second click.

That said, I truly value your willingness to assist, and I’d be honored to do a screen sharing session with you to debug this together.

Could you please let me know your timezone and what time slots you have available? I’m based in CEST (Italy).

Looking forward to your reply and thanks again for your support!
Best regards,
Marco

[marcofama]

Hi Serkan

I’m reaching out to report a persistent issue we’re experiencing with anchor scrolling on our website, specifically and ONLY for the #chi-siamo section and ONLY on mobile.

Despite trying several reliable methods, it’s the only section where the scroll behavior fails on mobile — and only on the first click. On second click, it behaves correctly.

Here’s a detailed summary of everything we’ve tested and implemented, all without success:

✅ Current setup
• The section has a proper ID in the DOM: id=”chi-siamo”…
• Anchor menu items are standard < a href=”#chi-siamo” > links
• No lazy loading is currently active on the page

🔁 Solutions we tried
1. Native CSS scroll offset using scroll-margin-top:

#chi-siamo {
scroll-margin-top: 91px;
}

@media (max-width: 768px) {
#chi-siamo {
scroll-margin-top: 50px;
}
}

This works perfectly for other sections like #contatti and #scegliere-ellisse, but not for #chi-siamo on mobile, where the scroll lands too far up on first click.

2. Global scroll padding with :root override:

:root {
scroll-padding-top: 91px;
}

No effect on the problematic anchor.

3. JavaScript scroll override (vanilla JS):

document.querySelectorAll(‘a[href=”#chi-siamo”]’).forEach(anchor => {
anchor.addEventListener(‘click’, function(e) {
e.preventDefault();
const el = document.getElementById(‘chi-siamo’);
if (!el) return;

const offset = 91;
const y = el.getBoundingClientRect().top + window.scrollY – offset;

window.scrollTo({ top: y, behavior: ‘smooth’ });

// Force re-scroll in case of layout shift
setTimeout(() => {
window.scrollTo({ top: y, behavior: ‘smooth’ });
}, 500);
});
});

We also placed this code both in the page footer and via a JS plugin to ensure execution order. Still no success.

4. Tested with other IDs and sections, and everything works as expected — even on mobile. The issue only affects the #chi-siamo anchor on mobile and only when clicking it before any scrolling has taken place.

❓ Questions / Request

Could you please help us identify why the #chi-siamo anchor behaves differently compared to other anchors?

We’re wondering if there’s:
• A hidden margin or padding above the section causing a false offset?
• A render or repaint delay for that specific container?
• A theme-level script or behavior that is applied only to that section?

Any guidance or fix you can provide would be greatly appreciated — the client has explicitly requested this behavior to be fixed, and we’ve exhausted all other options on our end.

Looking forward to your help!

Best regards,
Marco

[marcofama]

You can close this one, chatGPT helped me proposing a great solution (I’m pasting it here, just in case somebody needs it).

There is a CSS function that can help you scrolldown to section + offset in pixels

#sectionYouNeedToLink {
scroll-margin-top: 91px;
}

@media (max-width: 768px) {
#about {
scroll-margin-top: 50px;
}
}

[marcofama]

You can close this one, chatGPT helped me proposing a great solution (I’m pasting it here, just in case somebody needs it).

There is a CSS function that can help you scrolldown to section + offset in pixels

#sectionYouNeedToLink {
scroll-margin-top: 91px;
}

@media (max-width: 768px) {
#about {
scroll-margin-top: 50px;
}
}

[marcofama]

that’s sorting things out. Thank you.

[marcofama]

any hint please?

it’s been 7 days now… :(

thanks

[marcofama]

any hint please?

[marcofama]

PS: please use the credentials as provided, now you can access the site WITHOUT editing the hosts file as it went officially live (soft launch, waiting for you to take a look at all our open tickets) – so you should be able to have a look at the issue without any problem

[marcofama]

PS: please use the credentials as provided, not you can access the site WITHOUT editing the hosts file as it went officially live (soft launch, waiting for you to take a look at all our open tickets)

[marcofama]

Let me share with you something that might help you.

Can you please follow the below instruction on your machine, so that you can then access the site?

Again, the site is in dev mode, on the new hosting, so it should be pretty basic / simple: just add the two lines below to your hosts, and try the login.

:/ it should be definitely straightforward.

If still it doesn’t work I can support you but again, I believe it’s definitely not the first time you face a situation like this from a dev :)

Thank you please let me know how it goes

_________________________
ARE YOU ON WINDOWS?
_________________________
To edit the hosts file in Windows, you need to open Notepad as an administrator, navigate to the hosts file location (C:\Windows\System32\Drivers\etc), and then make the desired changes. You can then save the file with your changes.
Here’s a more detailed breakdown:
1. Open Notepad as Administrator:
Search for “Notepad” in the Start Menu.
Right-click on “Notepad” and select “Run as administrator”.
2. Locate and Open the Hosts File:
In Notepad, go to “File” > “Open”.
Navigate to the following directory: C:\Windows\System32\Drivers\etc.
In the “Open” dialog, select “All Files” to see the hosts file.
Select the “hosts” file and click “Open”.
3. Edit the Hosts File:
Add or modify entries in the hosts file.
Each entry should be in the format: IP address hostname.
You can add comments using the “#” symbol.
4. Save the Changes:
Go to “File” > “Save” or use Ctrl+S.
Notepad will save the changes automatically, overwriting the existing hosts file.

_________________________
ARE YOU ON MACOSX?
_________________________

To edit the hosts file on a Mac, open Terminal, use the command sudo nano /private/etc/hosts (or sudo nano /etc/hosts on newer macOS), enter your administrator password, and then make your changes. Save the changes by pressing Ctrl+O, then Enter, and exit the editor with Ctrl+X.
Detailed Steps:
1. Open Terminal:
You can find Terminal in the Utilities folder within the Applications directory, or search for it using Spotlight.
2. Open the Hosts File:
Type the command sudo nano /private/etc/hosts (or sudo nano /etc/hosts on newer macOS) into the Terminal window and press Enter. You’ll be prompted for your administrator password.
3. Edit the Hosts File:
The Nano editor will open the hosts file. You can add or modify lines to map IP addresses to domain names. For example, to redirect http://www.example.com to the IP address 1.2.3.4, you would add a line like this: 1.2.3.4 http://www.example.com.
4. Save the Changes:
Press Ctrl+O in the Nano editor to save the file. You’ll be asked to confirm the filename, which is usually /private/etc/hosts (or /etc/hosts). Press Enter to accept it.
5. Exit the Editor:
Press Ctrl+X to exit the Nano editor.

[marcofama]

still no news on this one?

[marcofama]

Hey Serkan, tried, won’t work unfortunately (please see screenshot)

[marcofama]

are you sure you are following the instructions as per the private content area below? please see the video recording, proofing they are actually correct… :)

thanks

[marcofama]

Thank you Mehmet, it seems this was the issue, so pls consider this closed!

[marcofama]

You’re amazing, thank you! – this is solved

[marcofama]

All is good now, not sure what you did or if some kind of server side caching is active or poltergeist :) but it works – thanks

[marcofama]

yes I did and applied it but still on my iPhone 15 Pro this is shown the non proper way (although in Elementor this works ok in the backend… just like in the past remember? where it was spoiled / not working in frontend but ok in the backend)…

:(

you can check the main URL from your mobile as well, it is now open

[marcofama]

hey serkan

Can you please show me how?

nothing changes as you can see
https://d.pr/i/snA3UH

and I’m stuck again on this

[marcofama]

anyone?

[marcofama]

Thank you so much

[marcofama]

how can I stop receiving email alerts on this thread? I unflagged already many times the ” Notify me of follow-up replies via email”…

[marcofama]

PS: do you know why the valign=top doesn’t work here, and the 1st column is not aligned top with the WPForm?
https://d.pr/i/ZDgBzW

[marcofama]

Thanks, you finally found the solution :) and I’m feeling better now

With regards to the 2 star rating: absolutely, the client agreed to amend the review once the project is finalized and he’s happy with it (which should be hopefully pretty close now)

[marcofama]

Thanks for checking.. must have self-deactivated after reinstalling Elementor and WP core…

Point is: still issues are there!

For example, this is how it looks in the backend
https://d.pr/i/Qkc0LY

and this in the frontend
https://d.pr/i/dbLPCJ

plus the other one, can you check the issues and understand where this hell comes from?

thanks

[marcofama]

I did it as you suggested and now all the “text content” has completely GONE.

can you please check at you earliest convenience!?

texts don’t display at all now! :(((((((((((((((((((((((((((((((((((((((((((((

all “home clone” pages should have, and the 6 should be the last one

guys I don’t know what to do, it’s giving me headaches

[marcofama]

ok for WordPress reinstallation…

what about elementor? where do I get your Elementor installer? or should I install the default basic elementor plugin from the wordpress library (i.e. https://it.wordpress.org/plugins/elementor/ )?

thanks

[marcofama]

Well, obvioulsy I’m talking about working in the backend as per all my other tickets, which is ok in the backend (kind of, at least) but spoiled on the FRONTend.

For example, this is how it looks in the backend
https://d.pr/i/Qkc0LY

and this in the frontend
https://d.pr/i/dbLPCJ

CAN YOU BELIEVE IT!?!?!?!? this is driving me crazy

can you please check??

:(((((

[marcofama]

:/ providing them once again in the private box

[marcofama]

Thanks, so first thing first (FYI), the option is not located in

elementor > settings > advanced > disable default fonts

but

elementor > settings > general > disable default fonts

Point is: I did as you asked, still the issue persists!

I had to clone the page and publish it again to make it work.

So, this is solved but… guys… This is not really the way we can work… you should definitely be fixing this issue :(

Thanks for your feedback

[marcofama]

Thanks for the workaround, which I hoped you could find it faster :D

To be honest tho, the bug repeats again and again, I had to clone it again to get it fixed, but hey… this is not the way we want to live our life :) you know what I mean?

I truly hope you fix your theme, it has potential but these bugs are so annoying…

Thanks for the moment

[marcofama]

hi serkan, any news on this issue?

It’s been days and the client is definitely not happy with the delay, and I don’t know how to bypass the problem….

Can you please fix it ASAP and provide and ETA? Is it really that huge problem? Shall we ask for the refund and turn to another theme? I don’t know what to tell them anymore.

Thanks

[marcofama]

hi guys, any news on this issue?

Thanks

[marcofama]

Thanks but… do you have an ETA for this?! I need to tell the final client, as we’re stuck.

PS: now the same thing happens with Accordions and Toggles, so they look ok in backend
https://d.pr/i/ZEgZ1Y

but like crap on the frontend:
https://d.pr/i/ZcANdk

Thanks for letting me know!
Marco

[marcofama]

Oh I see, thanks – what is the parameter that you have to set (there are 100’s in Top Bar, Logo, Header etc.) so that I can tweak the bar height?

Take care, hope you can fix that bigger issue we have with the theme too:
https://www.pixelwars.org/forums/topic/container-looks-like-demo-only-in-the-backend/

Thanks for letting me know about that and this one

[marcofama]

hey, I checked and the only active plugins are yours / those coming with the theme. Only one I added was Yoast duplicate post, which I deactivated for testing purposes, and the issue is still there

Can you please help? I need it to be working the same way both in backend and frontend as you can see in my provided screenshots. Not sure why this happens :(

thanks in advance

[marcofama]

all good now, thanks

[marcofama]

that is great thanks, although I’d need it to be centered – how do I center it in the page? Now that I have removed the fake item I placed, the menu overlays the slider and is also top left and not centered as per the demo (where it was a text I know, but the final client would like to have its logo there)

Thanks for letting me know