Setting up Masonry Format

  • I’m hoping to solve my own Masonry format issues and possibly help others with the question.

    I’m trying to create a highly visual site of images in Masonry format that link to posts/projects. Each post or project would then have more images, audio, video, text, etc.

    I’ve read the support threads and imported the demo content and still don’t know how to make masonry work. I’ll break it down into several questions:

    1) Is it better to use portfolios or blog posts when aiming for masonry layouts? What are the pro’s and con’s? (Neither are working for me).

    2) Your demo content (Masonry Page: 2,3,4,5, Full-Width) all have images of different sizes that make use of the masonry format. All my images appear as square (1:1) format – even though the uploaded images are of different dimensions.

    3) When is it necessary to use Page Builder vs the grid template to apply the Masonry format?

    4) Clearly other users are struggling with the same issue. Is there a simpler, more straight-forward approach to creating content in a masonry format? (I’ve tried literally dozens of themes before coming to Bento. I was hoping Bento would make it easy. At least your support is good!)

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter El Sapo

    (@el-sapo)

    Addendum:

    5) How are the roll-over attributes of images altered? i.e. the demo images in your Masonry formats (i.e. Masonry Page: 4 Columns), have different hover/roll-over colours, whereas all of mine default to grey. How do I alter mine?

    Thread Starter El Sapo

    (@el-sapo)

    Possible answers:

    I’ve dug a bit deeper, and think that I may have some answers, as much of site is now working. I think most of this is due to activating the SiteOrigin Widget “Simple Masonry Layout”. You can find it under Plugins – SiteOrigin Widgets. I’ve also ensured that the page that features Posts is using the Grid template (Page Attributes – Template – Grid).

    1) Posts now have many more options, but I haven’t tested this on Projects. I’ve decided to go with Posts as I know they’ll respond to SEO.

    2) The new-found Posts options (scroll to the bottom) now include controls for tile size (dimensions of the featured image in the masonry format) ie. 1×1, 1×2, 2×2, 2×1, etc.

    3) I managed to get a masonry format without resorting to PageBuilder.

    4) If it’s as simple as activating the Simple Masonry Plugin, then maybe this could be highlighted in the manual?

    5) Roll-over/hover attributes of masonry tile images can be easily customised via the options that now appear on each post page (scroll to the bottom).

    Now that I’ve got this working, I’m surprised by the number of options and ease of customisation. Great work Sentori!

    Thank you!

    Theme Author satoristudio

    (@satoristudio)

    Hi @el-sapo,

    thanks for providing insights on the questions, much appreciated! I’ll go over each point in the same order below; also, please take a look at this part of the official theme manual, just in case you haven’t seen it yet.

    1. You can use posts, projects or products (if you have WooCommerce installed) as the items for the grid – you can even combine several of these content types in a single grid, like presented on this demo page. All content types have similar features, with projects having a little different layout (see the Bento demo) and products having more data types, like price and stock. You can choose which content types to display in a grid by adjusting the checkboxes in the “Content types” setting in the “Grid settings” section, while in the edit mode for the page that serves as the grid container.

    2. Exactly, each individual post/project/product has a “Masonry tile settings” section in the editor mode, which contains the options for the grid item dimensions as well as other relevant settings.

    3. The page builder is not required to create native grid layouts in Bento, the guide I’ve linked to above can help with this ??

    4. Please let me know if it still looks difficult after the manual and the current thread! I’m always thankful for feedback and recommendations on how to make the theme better and easier to use.

    5. Exactly as you’ve described in the previous post ??

    In case you encounter any issues or have more questions about using the grid layouts in Bento, don’t hesitate to contact me!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Setting up Masonry Format’ is closed to new replies.

Tags