An Issue with slider on a home page

Hi,
I’m using a slider on my website page, actually this onehttps://woodmart.xtemos.com/demo-fashion-colored/demo/fashion-colored/ slightly edited.

It looks great on desktop, but on mobile and tablets, the problem starts.
Images in your example are very simplified and mine generally aren’t (but even on yours text is centered, images are in blending options…etc
I have complicated images and want to show colors, so I have to move titles, texts in my case to the left side of the screen. Take a look at the screenshots, on mobile, tablet, and desktop.
In Elementor I went to style, then full width, then on absolute so I would be able to set them on the right place where I need them.
After everything looks right (on all three screens in Elementor) I click save. After that, it seems that it is saved, but when I refresh the screen, the desktop looks ok, the tablet has collapsed buttons (now squared, take a look at the screenshot) and the mobile view looks ok in Elementor, but no, on real mobile view looks like 4th screenshot.

I’m really struggling with this for a whole day, can you help me out?
Regards

Attachments:

You must be logged in to view attached files.

Hello,

Our woodmart Slides has options that you can align the content of the slide per device.

Screenshot for Clarification: https://gyazo.com/a82c50cafef5ed0e31eeb07001baaf9f

You can also use seperate images for background:

Screenshot for Clarification: https://gyazo.com/9f90521e57ea5e97139d671f387fa716

You can adjust the image and content as you need.

Best Regards

Hi,
I’ve tried with this, but I’ve been searching for different options for hours now.
Yesterday too, back and forth. Good on desktop, title and letters collapses or left, right on mobile and tablet.
I’ve already set the look on desktop and animations in Elementor (3rd screenshot), but on a tablet, I’m getting square buttons not rectangular (after save and refresh, on phone view, it looks ok on Elementor (1st screenshot), but in mobile view, in reality, all the elements are on the right side (last screenshot).

You will know what to do probably in 5 min.
Can you please log in and resolve this for me? On mobile to look like 1st image, and on a tablet to look like 2nd image but with default rectangular buttons?
So frustrating, simply can’t find how to set this, probably buttons intertwining between tablet and mobile settings in Elementor are causing this error, and I can’t find it.

Thank you.
Kind regards

Hello,

Sorry, but we could not create a slider for you as you required. You have to do it yourself using all the options I have mentioned in my previous reply.

Read our detailed documentation for help:
https://xtemos.com/docs-cat/woodmart-slider/?theme=woodmart

You can use our prebuilt slides and modify them as you need.

Best Regards

Why is that hard to do that?
A slider is already made, I already went through the documentation and didn’t find help, as I said, I’m trying to find a solution for a second day now.
Why is it such a hash for you to only fix letters on a mobile view, in one section of the slider, it only a matter of good will I already have all other slider sections made?

Hello,

The issue on the 2nd slide issue is caused by the left value added to the section.

Screenshot: https://gyazo.com/31fa8feb5a2e7408543a12262645a924

The issue on the 3rd slide is caused by the margin value added.

Screenshot: https://gyazo.com/6a7199e92c35727fea5117aa4b4bb644

Best Regards

Thank you for the clarification, Awan.
I don’t have a problem with the issue on the 3rd slide, it looks ok, everything is visible on phone.
Still, the issue on the 2nd slide issue caused by the left value added to the section, which I can’t understand, as I’m working on this in Elementor.
It is not just the text, it’s the title as well, should be slightly left and up, and the other button is not visible as you can see on your screenshot.
Take a look at the screenshots attached.
1st how it looks on Elemenor (it looks like I want)
2nd is reality, and the one that you showed me is similar.

Attachments:

You must be logged in to view attached files.

Hello,

Please create a new section to display specifically for mobile and hide for the desktop and tablet view.

Please read the following article for help: https://elementor.com/help/show-or-hide-columns-per-device/

Best Regards

I don’t understand what this tutorial has with my question.
I don’t want to hide sections like in this tutorial.
I have three slides in the slider, two are perfect on all devices, and one is only good on desktop.
The problem is on tablet and mobile for this slide number 2.
This tutorial shows how to hide sections, not how to hide the whole slide on the desktop for example.

Are you suggesting to make a fourth slide (it has to be with the same background) the background is represented image? I don’t see a way to change the position of this background as I have here (take a look at the first link, on these banners) I can change the background, on every device to be different, and that’s great.
Maybe I don’t see such an option here, in slider?

I tried adding a new slide and hiding it on other devices, but the background is still showing on the desktop and buttons as well, even if I hide it.
Please guide me through the steps you had in mind?

Regards

Hello,

Please check it now after removing the browser cache. Now all the slides are showing fine on the mobile: https://ibb.co/wM2yXRc

Best Regards.

Hi Awan,
I know that you are overwhelmed with lots of requests in support of this theme as it really looks beautiful and clients are drawn to it. So, lots of questions, lots of problems could happen by default with so many options, in the end, many people are using Woodmart.

I don’t know if my English is not that good, so you don’t understand me in the right way, or my terminology is not correct, as I’m not a website developer.

In short, please read my previous message, the screenshot that you sent me is a good example that I made, so I really don’t know how many times and how to formulate what I need.
A problem is not on page shop info (that you sent, that is a great example), but on the first slider on a home page (precisely the second slide).

I made the shop info page look great on the tablet as well as on mobile, as I have more control there than on the slider.

Hello,

There is an issue with the rows and columns which you have set for slide number 2 on the homepage. Please delete the rows and add them again on the slide in the Elementor. I have set the Title and it is showing fine now same as showing in the Elementor Editor: https://ibb.co/N6tDGWy

Best Regards.

Hi,
Is this a tablet view? Or mobile?
As on my mobile, it is moved but the letter “T” is not well visible as it blends with a light panel background.
That was the reason why I was pushing the title up on mobile view, not to confront with background.
I’m trying to enter the slide in question, slide 6, but Elementor is endlessly loading.
Take a look at the screenshot:

Attachments:

You must be logged in to view attached files.

The Elementor is still only loading and not open when I want to enter its dashboard.

Hello,

Please check it now Elementor is working fine at my end: https://ibb.co/f0G5z61

Best Regards.

Yes, you did something that trigger Elementor to work.
Now I was able to arrange paragraphs, buttons, and titles on mobile to look the way I wanted.
And happy for the problem fixed, I have to take a look on the tablet ….and…why this could not be easy.

On the tablet, everything is mixed up and down. Ok, I set the look on the tablet, hit refresh, and again…
Tablet doesn’t look ok, now the mobile view is not good, it’s ok only the desktop.

I went back to do a revision to get the mobile view back, and then to ask you for help, but the problem stays anyway.
Take a look at the screenshots.

Attachments:

You must be logged in to view attached files.

Hello,

That is why I told you to delete this slide and create the new slide again and use by default all the options in the ELemntor builder. Then the text and image will be auto responsive. There is no issue with the theme, the issue is from the Elementor page and sections settings.

Or you can use the custom CSS code as well to adjust the text on the slides for any particular device mobile or ipad.

Best Regards.

I don’t know what CSS code to use for that as obviously, I’m not a website developer.
I’m just copying the settings of the other two slides that are already made( make a duplicate), changing the name, page address, adding a background that I want, saving that, then editing that slide in Elementor.

Those two are already acting great, and have all animations implemented, by the way, this is a ready-made slider from one of your templates.
Now I duplicated the slider that has a text block, title, and buttons in the middle, but I want to move them left or right, up and down.
To do that I change all these elements to absolute, but it’s still chaotic.
Maybe I should do it in another way?

Hello,

I have recreated the 2nd Slide on your website and it’s displaying fine the same as the 1st.

Please clear cache and check back.

Best Regards

My problem, as I hope you understood by now, is not to make a new slide that has everything in place (title, paragraph, buttons) like the first one, but to copy it, and then to change the background and move title, and buttons on positions I want them to be, regarding this new background.

The way you made it now, I can do that by myself.

But all content is in the middle, on a desktop, tablet, and phone, I don’t want that as I says for how many times.

I want to move paragraphs, titles, and buttons independently for every device.
Now on all devices, it looks the same and it’s unreadable (on desktop, and tablet, on mobile is not that bad)

At this point, I’m starting to think that you just don’t want to help me.

In the previous message:
“Now I duplicated the slider that has a text block, title, and buttons in the middle, but I want to move them left or right, up and down.”
So, I did that, why are you sending me this?
I don’t know how many times I should send what I need to you?

Please, just go through our conversations, to see the problem, or pass me to another support member who will really understand what I’m talking about.

In the attachment clarification with screenshots:
How does this look to you?

Attachments:

You must be logged in to view attached files.

In the attachment clarification with screenshots of how I want this to look like:
(It’s the Elementor view it looks great, but in reality, it’s all messed up:

Attachments:

You must be logged in to view attached files.

Hello,

All the content is in one column and as the result, it is difficult to align content.

Desktop: I would suggest creating two columns and putting the text and buttons on the left: https://gyazo.com/793d4d58a71e5685a2d206d27cbf45df and we get this result on the desktop: https://gyazo.com/2cf5ab0a48e25c699cca6a171d8867da

The height of this block https://gyazo.com/aa187b74a0e926c52ac3e9293791f02a does not allow to keep it compact, you will need to check the height, and locate the elements properly.

Tablet: you will need to reduce font size for the main title: https://gyazo.com/8072fdf8bc89f9870e93013d20ece93e and as soon as you correct the block “My first memory is of light the content would be properly aligned as you show on your screen.

Mobile: You need to align the title with margins, then reduce the margin for My first memory and add top margins for the bottoms. https://gyazo.com/0f85eb5f97da83141798678ad9aa4d7c
In addition, set this alignment in the slide settings for mobile: https://gyazo.com/fea79873da32a903c15e05fba2b7a22a

The slider works properly this issue is the proper content alignment on all devices. WoodMart support covers keeping the proper performance of the theme functionality. Everything works properly.

You need to check each slide and algin content as per your needs, please take into consideration, that you can add more columns to keep the structure.

Best Regards

Thank you for this info. Looks like a way to go.
The left side is good for the title and for the paragraph, but I don’t see buttons.
Also, I’m looking for a way to be able to move these elements where I want them to be, and I showed the examples in my previous screenshots.
My question is how to make this slide look like that. Columns on one look ok, on the other one I can’t move buttons on phone, because the column collapses beneath.

As for my other two slides in the slider, the green one and the yellow one, are perfect, as they have all the elements in the middle, but here that’s not the case.

I’m aware that your theme is working properly but I’m struggling with this for days, something always has to move.
The Elementor dashboard window looks perfect, but when I check doesn’t have anything to do with that on a phone and tablet.

I made another slide and changed the background, just to see, if I copy the setting from the first one (green slider with a shark) and put everything in the center, can I get around this problem.
But…it looks lauzy, graphic solution, the design, doesn’t look educated.
It should be on the left side of the phone and tablet, and it could be in the middle of a phone.

You can check slide number 5 that I’ve added in the slider.
The title is good, buttons are visible and centered, just a paragraph should go down together with buttons to be visible on a pink background, and not to blend in with the panel.
How to do that?

The same slide on desktop and tablet is not that nice.
Paragraphs, titles, and buttons should go left.
But I don’t know how to move them, yet not mess up the mobile view who is centered.
How I should do that?

Thanks

I’m also using an absolute option in settings for elements.

Hello,

Our support does not cover creating any templates as pe special requirements. We do not provide such a service. Our support covers fixing any technical issues related to the theme if any, guiding you in achieving your aims by means of WoodMart functionality.

We have tested the WoodMart slider on your site and have not detected any issue. We have provided detailed step-by-step instructions on how to manage your content on all the devices. When a slider has text, buttons titles and if you want to align it in a special way, you need to detect the proper margins padding of the elements to get it. It is time-consuming and may require numerous attempts. We would recommend a web-master having good skills and creating Eelementor templates.

We do hope for understanding.

Best Regards

Ok. I understand.
It is really time-consuming.
Thank you for the effort.

Regards

You are welcome! We are here to help.

Wish you a wonderful day!

[Author]

Posts