[Resolved] Using Blocks as well as Views

[Author]

Posts

[Pete]

Hi there,

I've just watched this video about Toolset sliders: hidden link

Now we have over 20 Views using the Views plugin, this we 'do not' wish to change or lose.

What happens if I add the Blocks plugin? Tried this and it disabled the Views plugin so quickly undid this.

Happy to give blocks a try however...if we can and do use Blocks, can I design a slider using blocks yet display it on a page using the Elementor builder?

Thank you

[Shane]

Hi Pete,

Thank you for getting in touch.
Actually you won't lose your views that you've already created with our Views plugin. This is because Views and Blocks are essentially the same plugin with just a difference in which editor is enabled by default.

You can enable the blocks editor in views by going to Toolset->Settings and scroll to Editing experience and enable the 3rd option.

"can I design a slider using blocks yet display it on a page using the Elementor builder?"

No you're not able to. This is because the Blocks plugin require the Gutenburg editor in order to create your views.

Please let me know if this was clear.

Thanks,
Shane

[Pete]

Hey Shane,

Thanks for getting back to me.

Ok, so as it stands I have no real advantage to adding blocks to our site if I can't use the views created with this in Elementor. However am I right in thinking....

Our posts use Gutenburg, so if we wished to get creative with something for a post, blocks may be the way to go considering Toolset seem to be developing this?

- to be clear...you said...
You can enable the blocks editor in views by going to Toolset->Settings and scroll to Editing experience and enable the 3rd option.

So my views will still be in code form and not changed in anyway?

The whole reason I ask is I want to create this kind of slider using Toolset rather than add another plugin...unsure I can do this easily using Toolset Views. Nothing is straight forward with Toolset 🙂

[Shane]

Hi Pete,

Our posts use Gutenburg, so if we wished to get creative with something for a post, blocks may be the way to go considering Toolset seem to be developing this?

Yes that is correct and if you are creating a content template for your Posts you can also use the Block editor to customize the content template. The block editor uses gutenburg.

- to be clear...you said...
You can enable the blocks editor in views by going to Toolset->Settings and scroll to Editing experience and enable the 3rd option.

So my views will still be in code form and not changed in anyway?

That is correct. Your original views will remain unchanged. It will just allow you to build out new views visually with the Gutenburg editor when you create a new post.

For your slider, is it going to display images from 1 single post or over multiple posts.

Secondly will this be in a repeatable field group or just repeatable fields.

Please let me know.
Thanks,
Shane

[Pete]

Great, thanks for clearing this up, I'll look into Blocks for sure.

I'm after something to look like the image I sent, very similar to this on Toolset actually: hidden link

It will be for Pages or Posts, on certain pages it would use the feature image and info from pages, on others it'll use info from posts.

[Shane]

Hi Pete,

So this is actually a post slider that is built with views using the pagination and some custom css to overlay the text onto the image.

Also we have a tutorial for sliders and you can take a look at this by checking out the documentation in the link below.
https://toolset.com/2019/02/create-your-own-sliders-with-thumbnails-its-easy-now/
Thanks,
Shane

[Pete]

Hey Shane,

Thank you for getting back to me, ok messed with some stuff however apologies if I have a few 'more' questions 🙂

I've done a rough slider here: hidden link
I can style and mess with it later however...

I am taking inspiration from this site:hidden link
See there carousel / slider? These are all over sites like ours, HomeAway and Air B&B.

I didn't think Toolset could do this kind of thing...it may of course.

So with my slider:
How can I do it where it moves, one slide at a time, rather than all three refresh?
I created a slider however I wonder if a carousel is needed, I can't find a video on how to do this.
To do what I've done so far I followed this Toolset vid: hidden link

The images are using this code:
[wpv-post-featured-image size="custom" width="446" height="720" crop='true']
Is there a way of making them all the same size regardless of their 'actual size?

For phone view I can see an issue. Is there a way of stopping the grid from stacking?
On Plum Guide there grid stays the same, horizontal and I think this better for this setup.

All the above I have looked on Google and your support for the answer, I will of course continue doing so keeping in mind the time diff. I thought it worth the ask 🙂

[Shane]

Hi Pete,

Happy to see that you're making your way around our Blocks plugin.

How can I do it where it moves, one slide at a time, rather than all three refresh?

No its not possible to have your slider transition with 1 slide at a time. Remember the slider is essentially a paginated view.

I created a slider however I wonder if a carousel is needed, I can't find a video on how to do this.

You can essentially create the carousel but it won't slide at 1 image at a time but with the limit you've set in the pagination settings for the slider.

Is there a way of making them all the same size regardless of their 'actual size?
Yes it is by using the size attributes like this shortcode here.
[wpv-post-featured-image size="custom" width="446" height="720" crop='true']

This will resize the images regardless of their original images.

For phone view I can see an issue. Is there a way of stopping the grid from stacking?
On Plum Guide there grid stays the same, horizontal and I think this better for this setup.

Using the Blocks plugin you are able to customize what layout is shown on a mobile view. Lets say you have 4 column slider for Desktop but on mobile you can customize this to only a single column layout. See Screenshot.

Please let me know if this helps.
Thanks,
Shane

[Pete]

Hi Shane,

Thanks for getting back to me 🙂

Ok, I'm not using blocks yet, this something I mentioned I would start to try out so this an issue:

For phone view I can see an issue. Is there a way of stopping the grid from stacking?
On Plum Guide there grid stays the same, horizontal and I think this better for this setup.

Is there a way of sorting this using a View rather than Blocks?

The whole issue is our site is Elementor based and the pages we are adding this to are Elementor.

Also I am already using this code and its not resizing the images:
[wpv-post-featured-image size="custom" width="446" height="720" crop='true']

Scroll a little and you'll see the images change their size: hidden link

Thank you.

[Shane]

Hi Pete,

For phone view I can see an issue. Is there a way of stopping the grid from stacking?
On Plum Guide there grid stays the same, horizontal and I think this better for this setup.
As mentioned in my previous post with blocks you are able to let your view know how much columns you want to display on mobile and how much you want to display on Desktops.

With just views you won't be able to do this unless you look at the bootstrap css to have varied columns.

Also the images are being resized. See screenshot

Based on your specified dimensions this is what wordpress is outputting.

Thanks,
Shane

[Pete]

Hi there,

Ok, if I use Blocks, can I design a View in Blocks and then use this in Elementor. Basically create something and then in then use the Toolset Widget to use this in an Ele page?

Finally, even though I am setting the image size of a height of 720, two of the images, The Old Chapel and Chapel farm are outputting at 680...why is this please?

[Shane]

Hi Pete,

Ok, if I use Blocks, can I design a View in Blocks and then use this in Elementor. Basically create something and then in then use the Toolset Widget to use this in an Ele page?

If you build your Block by going to Pages -> Add new and create your block there then you won't be able to use it in elementor, unless elementor has a way to display the Post Content since the view will be a part of the post content.

However I do believe elementor is able to do this. They should have a post content cell.

Secondly are these images original size smaller than the others ? If they are smaller than the specified dimensions then you won't be able to scale them up to the specified dimensions.

Thanks,
Shane