Return to previous page

Section on home page appearing very glitchy on different devices

This topic has 26 replies, 2 voices, and was last updated 3 months ago ago by Luca Rossi

Storee

Participant

July 30, 2024 at 16:41

Hello,

Ill create various posts to highlight the issue so it can be understood correctly.

Image 1 and 2 (attached) show how this section used to appear on mobile and desktop.

IMG_4148
Is Mobile view. As you should be able to see, each section is to be even in dimensions , the title, text, and buttons are even laid out.
(Titles on mobile are 1 Line, Not 2)
((paragraph on mobile ALL need to be 3 lines or 4 (preferably) line to remain even in layout))

Screenshot 2024-04-20 at 15.20.30
Is desktop view. As you should be able to see, the layout is perfect.
(Titles on mobile are 2 Lines, Not 1)
(Paragraph text on mobile are 4 lines)

Im not sure what changed it but now it appearly very horrible. Ill will attached images on next post.

Files is visible for topic creator and
support staff only.

#407933 Copied Theme version: 9.3.16

25 Answers

Storee

Participant

July 30, 2024 at 16:44

This is how it appears now, the background image is missing from each section. And also each section is a different shape and size on each device.

I need to to be how it was before, which is highlighted in the images.

How it was before = Exactly how the theme was by default, no changes to layout other than the words in the text and the image before the background. The background image is the same as theme default and was never changed.

Files is visible for topic creator and
support staff only.

#407934 Copied

Luca Rossi

Support staff

July 31, 2024 at 15:58

Dear Storee Team,

We hope this message finds you well. We kindly request that you add a background color to your inner sections as illustrated in the following screenshot: [https://prnt.sc/aoTWufZSUb4g](https://prnt.sc/aoTWufZSUb4g).

Additionally, we recommend converting all existing sections to containers using the latest version of the Elementor plugin. The Container Flexbox Display offers enhanced capabilities compared to the older sections format. For more detailed guidance, please refer to: [https://elementor.com/help/convert-existing-sections-to-containers/](https://elementor.com/help/convert-existing-sections-to-containers/).

Thank you for your attention to these matters. We look forward to seeing the enhancements and are here to assist with any questions you might have.

Best regards,
The 8Theme Team

#408154 Copied

Storee

Participant

August 2, 2024 at 09:01

Hi Luca,

As previously advised, it’s not a color I am looking to put there. Im looking to revert it back to how it was naturally, which was with an image.

It’s an image, the image is what comes with the child theme by default. The image, is an image (i.e picture.jpg) and not a color (ie’ #222222).

I am not asking for any customization to be done here, I am asking for it be be reverted back to the themes default look.

To simplify things, you could just provide me with sections style code from the child themes default theme, this will allow me the paste the style and just remodify the content.

Screeshots show, a screenshot from the theme preview, and a screenshot from the media gallery showing that these are images in the background… Not colours…

Files is visible for topic creator and
support staff only.

#408443 Copied

Storee

Participant

August 2, 2024 at 10:18

ive managed to make a bit of progress reverting it. Please ignore the last message to save yourself time. I will update shortly.

#408468 Copied

Luca Rossi

Support staff

August 2, 2024 at 10:42

Dear @Storee,

We are pleased to inform you that we have reinstated the background images as per your request. You can view the updated images by following this link: [https://prnt.sc/l4pUFr-2yl1E](https://prnt.sc/l4pUFr-2yl1E).

Please review the changes at your earliest convenience.

Best regards,
The 8Theme Team

#408479 Copied

Storee

Participant

August 2, 2024 at 11:26

Ok, so I managed to create a live version of an old back up.

I have created an elementor JSON template file from the old version, and I have imported to the main site and replaced the glitchy version with this, it is now reverted to the state which has the images in the background.

There’s are still some mild layout issues which I would like assistance with, its just the text and overlay on certain devices are slightly off.

Image 1: How it looks now, much better but there is a slight overlay and text issue. On section 2(green) and 3(blue) the title is 1 line, where as on section 1(orange), it remains as 2 lines.

Image 2: Shows how it needs to look (how it used to look) . Everything is aligned perfectly, because the title is 2 lines, the paragraph text is 4 line, this forces the button to be in place and the dark overlay to be correct. This is same on each section.

Image 3: Shows how mobile must look. When you align the title text to 2 lines on desktop, each section must stay on 1 line on mobile.

It should be like this:

Desktop title text = 2 lines
Desktop paragraph text = 4 lines

Mobile title text = 1 line
Mobile paragraph text = 3 lines (or 4, but all sections must be the same for it to remain uniform).

Please contact administrator
for this information.

Files is visible for topic creator and
support staff only.

#408493 Copied

Storee

Participant

August 2, 2024 at 11:33

Hi, sorry I wrote a message 30 mins before saying to ignore that message to save yourself the extra work. That staging site is now deactivated, and the upto date one has been provided with unto date instructions.

#408496 Copied

Luca Rossi

Support staff

August 3, 2024 at 05:12

Hi @Storee,

We’ve reduced the right padding and also set the height of inner section to 100%.

Now everything looks good on both mobile & desktop view.

https://prnt.sc/DDSDtcu4VIII

Could you please double check?

Thank you!

#408591 Copied

Storee

Participant

August 3, 2024 at 09:32

Hello Luca, thanks everything looks great on desktop version now.

There are still a couple of small layout issues on mobile.

https://drive.google.com/file/d/1HHKm1_KjdzxUwdgoC8riqEMc8xmZOqTp/view?usp=sharing

ive attached a video, it shows the overlap on the orange section, it is overlapped by the green section, which cuts the bottom off. The video then compares this to the blue section, which has no over lap. However, The sections are all different sizes on mobile, with the blue being the largest.

Ive attached a side by side for your comparison.

Mobile horizontal view also is unaligned.

Thanks for your help

Files is visible for topic creator and
support staff only.

#408622 Copied

Storee

Participant

August 3, 2024 at 09:54

Please see screenshots of mobile view attached here

Files is visible for topic creator and
support staff only.

#408625 Copied

Luca Rossi

Support staff

August 5, 2024 at 05:58

Dear Storee,

We hope this message finds you well.

We have recently updated the padding on your columns to 60px on desktop and 40px on mobile and adjusted the height of the text elements to enhance alignment across various screen sizes. This approach ensures a more consistent appearance rather than adding right padding to the columns, which may not uniformly accommodate all screen dimensions.

Could you kindly review these changes at your earliest convenience to ensure that everything appears as intended on your end?

– https://prnt.sc/WcoldVqshisA
– https://prnt.sc/pjMVfeyP4Y07
– https://prnt.sc/YNWZgsiniPg7

Thank you for your attention to this matter.

Best regards,
The 8Theme Team

#408767 Copied

Storee

Participant

August 5, 2024 at 13:59

It appears the homepage on the staging site has malfunctioned so I am unable to check the changes….

In my first previous messaged I mentioned a few times:

((paragraph on mobile ALL need to be 3 lines or 4 (preferably 4) line to remain even in layout))

(Paragraph text on mobile are 4 lines)

Desktop paragraph text = 4 lines

Mobile paragraph text = 3 lines (or 4, but all sections must be the same for it to remain uniform).

The screenshots you send me can see that the paragraph text in. the middle section (column 2) is not the same as the paragraph text on either side (column 1 and 3)

I can change the wording in the text slightly to make it even, but I am unable to view the staging site correctly or use the builder anymore….

#408862 Copied

Storee

Participant

August 5, 2024 at 14:06

Please refer to the instructions on my original image (I have attached it again, Called original image)

Files is visible for topic creator and
support staff only.

#408863 Copied

Storee

Participant

August 5, 2024 at 14:10

If the blue area, contains to much text, you can change the text from

“Every one of our customers is automatically enrolled into the Loyalty & Rewards Program. Earn points & save money.”

to

“Every one of our customers is automatically enrolled into the Loyalty Program. Earn points & save money.”

Remove “& Rewards” from the text.

Hopefully this will decrease the text lines.

#408865 Copied

Luca Rossi

Support staff

August 6, 2024 at 05:12

Dear @Storee Team,

We hope this message finds you well.

We have encountered an issue where the recent changes on your homepage are not visible. It appears there might be a conflict involving third-party plugins, such as Themify Builder. We noticed that the Elementor plugin, which we already utilize, serves a similar purpose, and we are curious about the continued use of Themify Builder alongside it.

Could you kindly assist us by copying the latest version of your LIVE website to the staging environment? This will allow us to conduct a thorough review and ensure everything is functioning correctly.

Thank you very much for your cooperation.

Best Regards,
8Theme’s Team

#408896 Copied

Storee

Participant

August 7, 2024 at 15:46

Hello,

Themify builder is used for the notification bar only, it doesn’t interfere with the Elementor Plugin. the issue you are experiencing with the homepage is to do with licensing issues (being on the staging site), I think it happens when the Elementor Pro activation is attempted.

I will create a new staging environment now. Thanks

#409370 Copied

Storee

Participant

August 7, 2024 at 17:40

new staging is given here.

Please contact administrator
for this information.

#409386 Copied

Luca Rossi

Support staff

August 8, 2024 at 10:52

Hi @Storee,

This is how your website looks on our end: https://www.awesomescreenshot.com/image/49926879?key=cf4138e3646104232aebe740bc4d5835

We didn’t update anything on your home page yet.

Can you please double check?

Thank you so much!

#409499 Copied

Storee

Participant

August 9, 2024 at 09:56

hello,

I am unsure why this happens, it has happened before when a third party has used the staging site. but when I create it and log in it doesn’t appear to replicate the issue.

I will create another staging site later, and show you how I access the builder, perhaps our methods of reaching the home page builder are different.. please leave it with me I will update when I am available again,

thanks

#409633 Copied

Luca Rossi

Support staff

August 10, 2024 at 14:09

Thanks @Storee,

Let us know when your staging site is ready.

Best Regards,
8Theme’s Team

#409753 Copied

Storee

Participant

August 14, 2024 at 12:27

I have reset the staging link, the credentials are the same as previously mentioned.

Please see the video to see the route which I take to reach the elementor builder, I have never encountered the issue you mention, so I assume its to do with the method used to reach the builder (its on staging site, so I think its license related).

#410214 Copied

Storee

Participant

August 14, 2024 at 12:27

https://drive.google.com/file/d/1AfZJhW9MNZQnaqR0Zcl5ych2hoHRjrkf/view?usp=sharing

#410215 Copied

Luca Rossi

Support staff

August 16, 2024 at 08:29

Hi @Storee,

We still can’t access to your home page but we’ve already copied that section from the home page to another page. You can check here: https://staging8.ugmp.co.uk/?page_id=13880.

The spacing now looks good on desktop, tablet & mobile.

You can copy this section to your home page.

Best Regards,
8Theme’s Team

#410431 Copied

Storee

Participant

August 20, 2024 at 09:43

Hello, the link you have provided takes me to a 404 page not found.

can you please follow the video in structure on. how to access the home page correctly

#410809 Copied

Luca Rossi

Support staff

August 20, 2024 at 10:50

Dear @Storee,

We are pleased to inform you that we updated the padding and implemented some custom CSS codes to the inner sections of your website. You can review the changes at the following link:

[https://www.awesomescreenshot.com/image/50124690?key=bf93bd8b58905abadf54f048ad70d177](https://www.awesomescreenshot.com/image/50124690?key=bf93bd8b58905abadf54f048ad70d177)

Please log in to your account to inspect these modifications. We have not yet created a video tutorial for these changes. If the updated section meets your expectations, you are welcome to save it as a template and then import it to your homepage.

Thank you for your attention, and we look forward to your feedback.

Best Regards,
The 8Theme Team

#410825 Copied
Tagged: best selling, different devices, glitchy appearance, home page section, solution, woocommerce themes
Viewing 26 results - 1 through 26 (of 26 total)