Tagged: alignment, content element, layout, margins, padding
-
AuthorPosts
-
December 10, 2019 at 8:42 am #1164338
I feel very stupid asking this kind of basic question. Even worse because I’ve been trying to figure it out for hours with no success.
I humbly request your help.
I’m recreating a catalog page containing 16 products.
The old site looks like this, basically with 4 columns, 4 rows of books, neatly stacked directly on top of each other.
The best I am able to do using Column Elements is this.
I want the text to tuck in under the images in the same way it does in the old site.
It looks better on desktop browsers when I set the image alignment to Left, but then it looks unacceptable on mobile.
Help me Obi Wan Kriesi Support, you’re my only hope.
Admin creds in the private content.
New site: https://jorvik.press
Old site: http://jorvikpress.com
Thank you.December 10, 2019 at 9:58 am #1164348Now for those pages that are a collection of existing posts/portfolios there are exactly the blog representations.
Because I see that you have probably created the individual book pages all as posts. So you have the possibility to drag the element “Blog Posts” from the tab “Content Elements” to e.g. a color section. If you want to have a sidebar there, just drag it into a 1/1 container.
Then you can choose the grid display in the element “Blog Posts”.
Whenever you then add a new post in the category, the new entry will automatically appear on the overview page.December 10, 2019 at 4:32 pm #1164493Hi,
Have you checked if @Guenni007’s post above helps?
@Guenni007 thanks as always :)Best regards,
YigitDecember 10, 2019 at 7:49 pm #1164589Thank you, @guenni007, for your quick response.
Regarding manual layout: Really what I need is help finding a way to define margins in text blocks appearing in content elements?Before starting this topic, one of the things I tried without success was the Grid Layout of blog posts (as you suggested).
But similar to the Portfolio Item >> Books idea you helped me explore in another thread, Grid Layout doesn’t offer the control I want over which content is displayed. I need the cover image, the book title, subtitle, and author name. Grid Layout (like Portfolio Item) at most allows for a sometimes-cropped feature image, title, and excerpt. Example screenshot – top of page is grid layout, bottom is my manual layout. (Extra problem: all the entries with no image and lots of text shouldn’t be there, as they’re in categories not specified)
Here’s a very specific image of what I’m trying to achieve:
If it’s not possible to restrict the width of the text, I guess an alternative would be to make the cover image wide (and hence taller) enough to give the same appearance of alignment. I’ll play with that for a while.
December 10, 2019 at 10:55 pm #1164654Hi,
Please add following code to Quick CSS
.home .avia_textblock { max-width: 180px; margin: auto; }
Best regards,
YigitDecember 11, 2019 at 1:23 am #1164690Yigit!
🙏
Solved.
December 11, 2019 at 6:14 am #1164715Hi,
I’m glad this was resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon -
AuthorPosts
- The topic ‘4 columns, images over text blocks: please help me align them nicely’ is closed to new replies.