Toolset Blocks 1.2 Beta Offers Image Galleries, Masonry, and More!

   Amir

April 15, 2020

The upcoming release of Toolset Blocks lets you display images the way you want. It includes new Gallery and Slider blocks for static lists of images and dynamic lists in templates.

The Gallery Block – Image grids, masonry and collage layouts

When you insert blocks, look for Gallery, under the Toolset section.

Inserting the new Gallery block

Galleries offer you three layout modes – Grid, Masonry and Collage.

A “grid” gallery
A “masonry” gallery
A “collage” gallery

The Gallery block is loaded with features, such as cropping, Lightbox, captions, drag-and-drop editing and even custom layouts. To make life easy, they are use sensible defaults, which make these blocks look great without tweaking any settings.

The Slider Block – Flexible image sliders

The new Slider block lets you quickly create beautiful image sliders.

Insert the new Slider block

You can choose different slider layouts, add captions and styling.

Images slider

While we’re on the subject of sliders, if you want to create more advanced sliders with texts, images, fields and taxonomy, check out our tutorial video on creating custom sliders with Views.

Great for Responsive Sites

Remember the responsive-design features that Toolset Blocks has? They work great for the new Gallery and Slider blocks. You can choose different sizes and settings for galleries and sliders for different screen sizes.

Use on Pages with Static Images and on Templates with Repeating Image Fields

There are many Gutenberg Block plugins that already offer galleries and sliders. So why did we bother creating our own? You guessed it. All of Toolset’s blocks work great with static content and with dynamic content.

If you’re building the site’s homepage, insert Gallery and Slider blocks, upload images and apply nice styling.

If you’re building a template, insert the Gallery or Slider Block, enable dynamic source and choose the repeating image field to populate the images.

A “collage” gallery with dynamic images on a template

Masonry and Collage layouts for Views and Archives

Want to build more advanced galleries with images, texts, fields and taxonomy? Want to have galleries with custom search and sorting?

We’ve added the new masonry and collage layouts to Views and Archives!

Grid, Masonry and Collage layouts in Views

Now you can create Views and Archives with the new beautiful layouts.

A View with a Masonry layout
A View with Collage layout

Download and Try

The beta release for Toolset Blocks 1.2 is waiting for you. Log-in to your Toolset account, go to Downloads and select the Beta channel. Download Toolset Blocks 1.2 Beta and install it. It’s a beta, so we recommend to use it on testing and development sites only. If you’re itching to try it on production sites, be sure to back up your content before.

We’re aiming to release the production version in two weeks. We have a few last cosmetics to complete and a lot more testing before the production release.

Feedback?

The whole Toolset team took part in this development and we’re super-eager to hear your thoughts. Please leave your comments and we’ll get back to you.

 

Comments 40 Responses

  1. Very nice! I have already implemented my custom masonry layout in the past, but having this in the block editor is much better now! No need to write custom styles.

    The Collage also looks interesting I’ll give it a try!
    Thanks for the update!
    D.

  2. Great! How about looping through an existing Custom Search View, and having only the Search result’s custom posts content in the Slider. So, each time the custom search changes, the slider shows different content, meaning the content of the lase custom search.
    Could you describe how to set this up?

  3. Well, I supposed to have much more after all these months rather than a gallery block. I waited for nested view, oneself relationship, tab blocks, the possibility to reuse a view in other template and to modify out of the page where you can use it (as in non-block edition of toolset), a better way to use the lightroom. I also hoped in a timeline. Lot of thinks I waited. Thank you. I am sure to wait for a long time. Carletto

    • Thank you for your feedback. Let me tell you about what’s coming next and pretty soon:
      * Revamped relationships and a new translation workflow in the next release
      * Reusable blocks, sections and designs in the following release
      * Event management (calendar, online meetings, etc.) in the following

      So far, that’s the plan. We wish we could do everything at once. We’re doing our best, but we can’t always cover everything – not even what we want for our own sites.

  4. If we build a view with a lot of images, filters / search and pagination, do these new capabilities allow the lightbox to span pages? In other words, if I click an image on page one and it opens in the lightbox, can I arrow or swipe my way through to page 2’s images in the lightbox?

    • Sorry, but it’s will not work. Lightbox is its own JS library. It identifies the different images **on the page** and will only let you navigate between them. But it’s a great feature suggestion for the future 🙂

  5. A great new addition. I had a slider view on my site that was custom post specific. It was something that was a module that Toolset created a while. It worked great but there was a small compatibility issue with Divi and it eventually stopped working. This looks like a good optional replacement for that.

    Thumbs up to Evan for the production values on his video.

  6. I’m still a Guttenberg hater. I never used the old visual editor either. I prefer to write my own HTML in the text editor. Guttenberg adds so much extra code that I can’t read it. It’s as bad as Microsoft FrontPage.
    Also, styling on-the -fly rather than using CSS is duplicative and vulnerable to inconsistencies.
    Do you have any plans to better support users like me? Or am I fighting a losing battle?

    • I’m sure that you’re not really a “hater”. Maybe you just prefer HTML editing over visual design? The shortcodes editing (old Views) is not going anywhere. You can use it as before and keep building sites the way you prefer.

    • Can you open a ticket in our support? Our supporters will get the right debug info, see what’s wrong and help get it running for you.

  7. Wow, this looks promising.

    Even I was a skeptic when you take the whole Toolset away from Elementor (and other page builders) and start using Blocks, these few recent updates are very good.

    Keep up the good work.

    In the past few weeks, I am working to replicate a Toolset-based directory site (with Elementor) I built, with JetEngine just to compare these two “ecosystems”. How hard/easy it is and the limitations of these two.

    Best,
    Strahinja

    • I’m interested in reading your comparison. I hope that you’ll find advantages in Toolset and I’m sure that we’ll see some things that we should improve. When you have a comparison article, will you add another comment here linking to it?

  8. Hi Amir,

    Just doing some testing with the Views Beta of the plugin and some observations.

    In Divi the Grid, Masonry and Collage views are not laying out properly on the front end, just one block item after the other vertically.

    The other little niggle I am seeing now is we can only create block views in a page and not compositionally under Views in the dashboard. As you know I like to build pages compositionally with Divi builder and views/templates dropped in by shortcode.

    I have been able to recreate a slider (fullwidth in a Divi section/row/text module) at the top of a Divi layout. The workaround is achieved by building the slider view on a regular page. You can then the view listed under Toolset/Views but you can only edit it on the original page. You can though get the shorcode for the view and put it wherever you like.

    I think the whole block approach is great but I am not sure of the methodology of having two different plugins. For the most part I can mix a match compositions between blocks, the Divi builder in many different ways with shortcodes are a good workaround for edge cases.

    The frustrations set in when I go to make a view component as a stand alone view, create once and render in many places, and I have to go through the hoops to do this.

    • Yes, these layouts are available in the new Block View and not in the legacy (shortcodes) View. Because of the way the new Blocks work, it’s only possible to create them inside Gutenberg, so there’s no “stand alone” editor. When you’re building a site with Gutenberg, this is an advantage. When you’re using Divi, I can see how this back-fires. Just for the sake of testing, have you tried Toolset without a separate page builder?

      • Thanks Amir,

        Can you look at my first question again >

        In Divi the Grid, Masonry and Collage views are not laying out properly on the front end, just one block item after the other vertically.

        I am building this on a regular page, using the Divi theme, but not the builder. The grid option did work in previous version of Views so I am not sure if it should still work, in terms of layout, along with masonry and collage.

        On Views, you can create content templates with the older html/css/js option or with blocks in an interface independent of a set post or page. Perhaps due to some technical something views can’t be managed in the same way.

        As I said there are workaround and a shortcode is generated for the view built with blocks.

        • Just one more observation,

          On my test site, I disabled Views and installed the Toolset Blocks plugin. I see that I can configure it in such a way that I have the choice to create block views on a per page basis (available via shortcode elsewhere on the site) and I can continue to create views, if I want, using the older html/css/js method.

          For all intents and purposes Views and Blocks are the same plugin or am I missing something?

        • Hi Stephen,

          Thanks for taking your time to test the new beta.

          I have tested DIVI and Views block and it worked for me, the cells of the view are displayed according with the layout (grid, masonry and collage). Although I have found small compatibility issues related to the new Gallery block, that I will fix before the stable release.

          I would love to help you with the issue you are facing, because it might be caused by a “setup” I haven’t been able to detect. Please, open a Support ticket and ask for me and I will do my best to fix the issue 🙂

          Regards
          Luis

          • Will do. I will get to it tomorrow. I am going to test on another locals site to rule out any oddness in the backup I have been testing on.

          • Hi Luis,

            Just getting back to you. I tested on a different backup and I don’t see the issue there so no need to open a ticket. All is good.

  9. Great!
    And I would like a clarification on the best way to use and what plugins and resources (Views, Blocks, content models) to activate for a better development. It gets complicated when you have the limitation of not being able to use Views and Blocks at the same time.
    With news and work, it can be difficult to find time to research, learn and test which is the best combination of plugins and resources to activate and use.
    Or should I forget Views ?!

    • Sorry for the confusion. We are almost done reorganizing the documentation for Toolset. A grand new set of documentation and training content will be ready in 3 weeks.

      You only need Types and Blocks. If you need to create “legacy” Views (not as blocks) with shortcodes, you can still achieve this with Toolset Blocks plugin. But otherwise, if you’re happy building your Views visually, then all you need are “Toolset Types” and “Toolset Blocks” plugins.

      • In (old) Views, I have one Views inside another: “Views/Template Products” inside “Views Sellers”. Well, in Blocks, where do I find the filter (not “search field”) to be able to filter the “products” of a “seller”?

        Or what is the way to pass and receive parameters in the case of a View within another?

        Thank you.

        • We haven’t yet implemented nested Views in Blocks. This is on our todo list. So, in the meanwhile, the only way to achieve this is to keep using the old Views editor for the internal View. You can ask our supporters how to accomplish this. Please make sure to tell our supporters that you’re familiar with the old Views, so that they explain to you how to integrate between the new Views Block and the old “shortcode” Views.

  10. Amazing, your support team said a an update like this would be due shortly.

    Just spent a few hours, being helped by support, to create an alternating post layout to feature some of our holiday properties.

    I wanted something that was a feature with a more ‘designed’ layout, something less ‘grid like’. This development in blocks will be great in creating more interesting layouts.

    Bring it on 🙂

  11. Hey Amir, I have not tested the new gallery block and I have a question:

    I want to set up a conditional that will look for the amount of photos the user has uploaded as a part of a custom field, and based on the number of uploaded photos activate a separate gallery custom layout.

    For instance, if the user uploads 3 photos I will have one layout, for 4 photos another, for 5 a third one, and for 6 yet another one, etc.. for this I can have all my gallery blocks set up with predefined custom layout designs but I can’t seem to find a way to create a conditional block that will check for the amount of uploaded photos.

    Perhaps a custom function will be needed for this? Or I am missing something else..

    Please advise!

    • Hello,
      This is Agnes from the Toolset team. Yes, custom coding would be needed to handle such a case but let me try to understand your case better. Why don’t you simply choose your gallery layout (one for all) and that’s it?

      • Because I want to adjust the layout based on the amount of photos the user uploads.

        For instance:
        – If the user uploads a single photo, they will have a full-width “hero” style header.
        – If they upload 2 – they will see a 50% / 50% laoyt
        – for 3 they will get one that looks like this:
        — first row: 50% / 50%
        — second row: 100 %
        for 4 photos:
        — first row: 50% / 50%
        — second row: 50% / 50%
        for 5 photos:
        — first row: 50% / 50%
        — second row: 100%
        — third row: 50% / 50%
        6 photos:
        — first row: 50% / 50%
        — second row: 100 %
        — third row: 33% / 33% / 33%
        .. and so on.

        • Thanks. Now, it’s clear. I’m sorry but we don’t provide such flexibility because our conditional block doesn’t have any option to set up a condition that would calculate/return the number of images uploaded to your post. If you know how to create your custom shortcode that would do so, feel free to add one and then use it in the Toolset Conditional block. So to sum up, in your template, you would end up with 6 gallery layouts, each within the Conditional block using your custom shortcode returning the number of images compared with the static value (1, 2, … 6). Please follow up on our support forum for further instructions. Please note that providing PHP code is beyond the scope if our support but our supporters might point you in the right direction.

          • Thanks Agnes!

            How do you think, is it possible to actually include such functionality in the gallery block itself in a future release? Does this classify as a possible feature request?

            That would be great if we can get dynamic gallery layouts based on the amount of photos provided to a gallery.

            I guess a solution with a range slider input from 1 to 10 and then each position of these would actually show a separate custom layout picker/builder where we can build custom layouts based on the actual range. This option would only apply to custom layouts that we see in this beta release.

            • The solution you suggest would require changes in our GUI, which are always expensive. But we might consider extending the conditional block with the number of items returned from your repeating gallery field so that you don’t need to add the shortcode yourself. Anyway, I’ll bring that topic up in a meeting with our devs next week. Thank you for all your suggestions. Have a good weekend.

Leave a Reply  

Please leave here comments about this page only.
For technical support and feature suggestions, head to our forum. We are waiting there!

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>