How to increase width of sidebar and main content

[imtaimur]

Hello.
Just purchased origami theme yesterday. I tried for like 3 hours to increase the width of sidebar to 350 px and the main content to 700px but failed to do so. Can you please help me in this regard.
Thanks.

[satori]

Hey Imtaimur,

first of all, thank you for the purchase!

By design, Origami has fixed width, which also pertains to the content and the sidebar. Since the widths are specified in fixed units for several page elements in several places, it would take some new CSS code in order to change the width of the sidebar and the content area, while preserving the relative sizes of all other elements (e.g. the menu, the images, etc). All the CSS that needs overwriting is contained in the “style.css” and “lessframework.css” files in the theme folder (wp-content/themes/Origami/).

Despite the fact that this is considered a theme customization and is thus not covered by the standard ThemeForest support offer, I thought I’d provide the code anyway:

#sidebar { width: 350px; }
#content { width: 700px; }
.single-post #content .featured-thumbnail img, .page #content img, .blog #content .featured-thumbnail img, .single-post #content a img, .tag #content .featured-thumbnail img, .category #content .featured-thumbnail img { max-width: 700px; }
#nav-secondary { width: 340px; }
.container { width: 1050px; }
#top-left { width: 670px; }
.post-meta { margin-left: 701px; }

You can paste this code into the “Style: Add Custom CSS” tab of the Theme Options panel for the new rules to take effect (do not forget to hit the “Save All Changes” button ;) In case there’s something I’ve forgotten in the code and some parts of the website become displaced, please let me know, I will correct that.

Sincerely,
Andrii / Satori Studio

[imtaimur]

It works. Thank you soo much for providing the code without charging.

Thanks again. Cheers.

[Author]

Posts