We are converting a client’s static HTML site to the Vantage theme using Page Builder. We are finding that the graphics from the old site are apparently too small for the default column or cell widths because the margins between them appear undesirably large. We have tried playing with the margin controls in Page Builder but still have about .4″ of white space between the columns.
We are wondering if the problem is that the graphics, coming from the old site, are too small for this responsible theme. Is there a standard or desired width for graphics that are 1/3 page and 2/3 page in size so that they fully fill each cell or column? See for example this page on our construction-test site:
http://lci2.com/markets.html
Thanks for a great theme and plugin combination.
Hi Buck
Please try navigating to Settings->Page Builder->Layout and adjusting the Row Gutter option. There are no defined sizes for images that can be displayed, they should resize to fit the container. In your case this function is being overridden by the Jetpack Photon Module. If you disable this and adjust the gutter you should get your desired result.
Let us know how you get on
Magus
That is very good to know. I will turn off this module and see what else we can do to get the result we want.
Removing the Photon Module was a big help, but now I need to control the left and right horizontal padding of the rows without increasing the top and bottom padding. Can you tell me what CSS code controls that or how to change it?
Hi Buck
We’ll hopefully have top, right, bottom, left padding in a future release of Page Builder. For now we can use the Attributes tab and a little Custom CSS.
Edit a row, click Attributes top right, enter a row class name of your choice, for example:
Then under Appearance > Custom CSS target that class:
/* Page Builder Custom Classes */ .custom-padding { padding-right: 10px !important; padding-left: 10px !important; }Hope that helps.
Thank you for the prompt and considerate service! I will give that a try!
For sure, let us know how that goes :)
Instead of the class being .custom-padding (which did no good), it should be .panel-grid (which works perfectly on all pages with just one CSS addition)
Super, glad to hear you made progress. Thanks for keeping us updated. All the best.