Skip Navigation

[Resolved] Mobile version is disaster

This thread is resolved. Here is a description of the problem and solution.

Problem:
Customer was having issues after building the site for the desktop and checking how it looked on mobile it didn't look responsive.
Solution:
We oriented the customer about techniques that can be used to adapt the site for mobile devices:

- Responsive Adjustments: Toolset allows you to check how pages look on various devices and offers solutions for common responsive design issues, such as adjusting text sizes, column widths, and gaps between elements.
- Typography and Color Adjustments: You can control typography and color settings for different screen sizes within any Toolset block. This feature lets you optimize text for readability across devices.
- Grid Control: For layouts that use columns, Toolset’s Grid block lets you set different column sizes and control the spacing between columns and rows for each screen size.
- Element Visibility: Toolset also provides options to hide specific elements (like large images) on mobile devices to improve loading times and user experience.
Relevant Documentation:
https://toolset.com/course-lesson/creating-responsive-designs/

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 -
- 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 -

Supporter timezone: America/Sao_Paulo (GMT-03:00)

Author
Posts
#2691797

Hi team,

I am building directory website. I am in the final stage of designing it for desktop. I have checked how it looks like on mobile but it's complete disaster. Do I have to go through all settings for mobile and tablet version? Is there any smart solution for this? For example comparison how it looks like on those devices at the same time while I create it for desktop?

Tell us what you are trying to do?
Directory website

Is there any documentation that you are following?
Nothing found

Is there a similar example that we can see?
Not sure

What is the link to your site?
Under construction

#2691920

Mateus Getulio
Supporter

Languages: English (English )

Timezone: America/Sao_Paulo (GMT-03:00)

Hi there,

I understand your challenge with making your directory website responsive across different devices.

Toolset offers features for creating responsive designs directly within the WordPress Block Editor. Here’s a brief overview based on your request:

- Responsive Adjustments: Toolset allows you to check how pages look on various devices and offers solutions for common responsive design issues, such as adjusting text sizes, column widths, and gaps between elements.
- Typography and Color Adjustments: You can control typography and color settings for different screen sizes within any Toolset block. This feature lets you optimize text for readability across devices.
- Grid Control: For layouts that use columns, Toolset’s Grid block lets you set different column sizes and control the spacing between columns and rows for each screen size.
- Element Visibility: Toolset also provides options to hide specific elements (like large images) on mobile devices to improve loading times and user experience.

For your specific case, using the Toolset Blocks and following these guidelines will allow you to design your site responsively with minimal hassle:

https://toolset.com/course-lesson/creating-responsive-designs/

Please make use of emulators and real devices to see how your site performs and adjust as necessary.

If you haven’t already, exploring the detailed guide above on creating responsive designs in WordPress could be a great next step. This resource is designed to help you tackle the exact challenge you're facing, ensuring your site looks and functions beautifully no matter what device your visitors are using.

Best of luck with your directory website, and feel free to reach out if you have any more questions or need further assistance.