Return to previous page

Set content body width different from website width

This topic has 10 replies, 2 voices, and was last updated 11 months, 1 weeks ago ago by Tony Rodriguez

densitysk

Participant

December 11, 2023 at 16:13

Hi,

is there a setting in the theme that allows me to set different width of the text content created with build in gutenberg editor?

Example layout that I want to achieve>
https://ibb.co/4YPsdMy

My current content:
https://ibb.co/xL220mG

Problem that I have is, that I do not see any option to set the content width different from the page width. I want the header, footer and other pages like shop, etc. to be wider, but text content more narrow like in the example above.

Do you have a solution to that?

Thank you in advance
Kind regards
Michal

#376328 Copied Theme version: 9.2.5 WooCommerce version: 8.3.1

9 Answers

Tony Rodriguez

Support staff

December 12, 2023 at 05:30

Hello, @densitysk,

Thank you for using our theme and for contacting us.

Kindly furnish us with the URL of the webpage where you wish to modify the text content width. Additionally, please securely submit your WordPress administrative login credentials in the designated private content section. This will enable us to review the matter and provide you with the necessary assistance.

We kindly recommend that you take a complete backup of your site before proceeding.

Best regards,
The 8Theme Team

Please contact administrator
for this information.

#376356 Copied

densitysk

Participant

December 12, 2023 at 09:02

Hi,

login details in the PM attached along with the example page that I want to modify the width of the body.

But note that I want to have more narrow content on all pages that have content created with the built in gutenberg wordpress editor (excluding footers, headers, shop, etc) and Ideally it should not affect mobile view.

I have already tried some CSS (I am not an expert in this) but when I make the body content of the provided example page narrow, it also makes narrow all pages like the descriptions on product pages. And it also does it in mobile view making the content unreadable.

Here is an example website with content style, that I like to achieve
https://shopkeeper-demo.getbowtied.com/pages/faqs/

Thank you for checking.

Kind regards
Michal

Please contact administrator
for this information.

#376381 Copied

Tony Rodriguez

Support staff

December 12, 2023 at 11:49

Hello, @densitysk,

We regret to inform you that we are currently experiencing difficulties accessing your website. For your reference, we have attached an image that illustrates the issue we are encountering. https://imgur.com/6vgWiYx

To facilitate our ability to provide you with the necessary assistance, we kindly request that you whitelist our IP address, which can be found in the private content area of this communication.

We appreciate your prompt attention to this matter and look forward to resolving it swiftly.

Thank you for your cooperation.

Best Regards,
The 8Theme Team

Please contact administrator
for this information.

#376400 Copied

densitysk

Participant

December 12, 2023 at 12:43

Hi

GeoIP protection is temporarily disabled. Make sure to clear browser cache and cookies and try again.

Kind regards
Michal

#376411 Copied

Tony Rodriguez

Support staff

December 12, 2023 at 14:08

Hello, @densitysk,

We are pleased to inform you that the issue you reported has been successfully resolved. We kindly ask that you revisit your website after clearing your browser’s cache to see the changes.

For your reference, the solution involved the addition of CSS code to your site. This was accomplished by navigating to XStore > Theme Options > Theme Custom CSS > Global CSS.

Please find attached an image that serves as a reference for the changes made. https://pasteboard.co/qyOslx3pqQpF.png and https://pasteboard.co/VWFkF2wXiiZP.png

Should you require any further assistance, please do not hesitate to contact us.

Best regards,
The 8Theme Team

#376427 Copied

densitysk

Participant

December 14, 2023 at 09:59

HI
thank you. That worked well.

But I see that you have set it specifically only for that particular page. I will try to describe my problem in detail.

What I wanted to achieve was, that I want all content on all new created pages with the built in wordpress editor to be the same width like the FAQ page that you have adjusted.

The root cause of my issue is, that your layout settings only allow to set the site width – which means all the headers, content, footers and product descriptions are wide. There is no separate setting for pages or product descriptions.
https://ibb.co/xhKTBzF

Example of other pages and product descriptions that are too wide:
https://ibb.co/BTTbH6d
https://ibb.co/SwcsqXs

When I create a page or product descr. with Elementor, there are options for the margin, padding and width. But I do not always want to use Elementor unless absolutely necessary to avoid long loading times for specific pages.

For simple pages like payment terms, terms, privacy policy, shipping info, or product descriptions I like to avoid using Elementor.
This also allows me in the future to export my website to other domains with less issues compared to when everything is being done with a page builder like WP Bakery or Elementor.

Nice example of what I want to achieve
https://ibb.co/mChCQ3h
Here is also a link to the example website that is the basis of my design
https://shopkeeper-demo.getbowtied.com/shop/bags/orange-leather-retro-handbag/

Can you please check if there is a way to set some default CSS or some setting that would allow me to have a more narrow content for desktop/tablet view when I create simple pages or product descriptions using the built in wordpress editor?

Kind regards
Michal

#376644 Copied

Tony Rodriguez

Support staff

December 14, 2023 at 14:14

Hello, @densitysk,

I hope this message finds you well.

Firstly, I would like to express my gratitude for the detailed explanation and description you have provided, which has greatly assisted us in comprehending your perspective.

As you are aware, we have successfully implemented a Custom CSS solution to address the issue on a specific page of your website. However, this fix is currently limited to that particular page. Should we integrate the default CSS across your entire site, it would affect all pre-existing pages but would not automatically apply to any new pages you create.

To ensure a consistent appearance on future pages, we kindly request that you add the unique page IDs to the Custom CSS code we have utilized to rectify the issue.

We would greatly appreciate it if you could finalize the creation of all necessary pages and submit the URLs for each within the private content area provided. This will enable us to verify the information and incorporate the relevant page IDs into the Custom CSS, thereby resolving the issue comprehensively.

We trust you understand the importance of this process and look forward to your cooperation.

Warm regards,
The 8Theme Team

#376666 Copied

densitysk

Participant

December 17, 2023 at 11:10

HI,

Here is the list in the PM with URLs and Page IDs to which I want to add this custom CSS.

Thank you for checking.

Kind regars
Michal

Please contact administrator
for this information.

#376910 Copied

Tony Rodriguez

Support staff

December 18, 2023 at 07:44

Hello, @densitysk,

Thank you for your response.

We are pleased to inform you that the issue you reported has been successfully resolved. We kindly ask that you clear your browser’s cache and revisit your website to see the changes.

For your reference, the solution involved the addition of CSS code to your site. This was done through the following navigation path: XStore > Theme Options > Theme Custom CSS > Global CSS. Please see the attached image for further clarification. https://ibb.co/mXnGPrv

Should you require any additional assistance, please do not hesitate to reach out to us.

Best regards,
The 8Theme Team

#376955 Copied
Tagged: adjust woocommerce theme width, customize content body width, different website width settings, modify wordpress site width, wordpress woocommerce themes
Viewing 10 results - 1 through 10 (of 10 total)

The issue related to '‘Set content body width different from website width’' has been successfully resolved, and the topic is now closed for further responses

Set content body width different from website width

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection