Modify the grid and widget size


Hi! I would like to perfect a website layout.

I would like to know if it is posible to do a couple of things in layout.

This is what I'd like to obtain:

A - Change the size of the primary sidebar to 20% of the page width. I don't know if this is the proper way to do it (in functions.php ?):

beans_replace_attribute( 'beans_sidebar_primary', 'class', 'uk-width-medium-1-4', 'uk-width-1-5 ' );

B - I would like to eliminate the notice of "no sidebar", because I may like to have the possibility of leaving the space empty, with no sidebars at all. I tried the function http://www.getbeans.io/code-snippets/remove-the-secondary-sidebar/ but it is not the same thing: this removes the sidebar AND the space occupied by it, by resizing the content area.

C - I would like to know if it is posible to create a flex container with 60% of total page width so the content gets centered on the page (bearing in mind the left sidebar is 20% width).

D - Below 800px, the content should be full-width.

Edited: I posted earlier this discussion in different means. But after some reasoning, I think this way will be cleaner.

Thanks in advance for any help on achieving this.


Hey Sami,

  1. Regarding change the grid width, have a look at this replie.
  2. To remove the no widget notice, you can add beans_remove_action( 'beans_no_widget' ); to your functions.php
  3. Banks child theme has a centered content as you described it, so I suggest you download it from the themes page and look into the code, it is the best way to learn πŸ˜‰

Have fun,


Hi!

First of all, thanks for the tip on how to change the layout grid size. That's exactly what I needed.

Regarding the suggestion in your #3, thanks, but what I want is slightly different. I do like banks child theme, I installed it already, too. But what I want is slightly different. Bearing in mind that the left sidebar uses 20% width (after this mod), I will use the remaining 80% width for the post image, but for the content, i'll set it to 60%, leaving a margin on the right with 20%. I plan to achieve that with flexbox. Just need some testing now.

Cheers


An update:

I managed to create the flex container I needed. A lot of testing but in the end it went out exactly is I needed. I'll tell you when it is online so you can see the end result.

Cheers


Great stuff Sami, glad to hear you managed to get it working as you intended to πŸ™‚

Looking forward to seeing your work,


Hi Sami

Can you post the answer you figured out to the questions you raised? How you used it. Perhaps even include a link to where you are using it?

I am going through the forums looking for material to create tutorials.

Thanks.

Write a reply

Login or register to write a reply, it's free!