Thanks! A lot of it was just styles that already existed in the global stylesheet of the site I was working with, but if you download the pack of pre-made demo templates (linked in the description) you'll get the one I showed in this video with all the CSS/SASS baked into that Style tab. Should be easy to spot but the template is called "Advanced - Styled blog post grid." - Ben
You're a cool personable Tutor, it's easy to see you're behind the product. And the functions are also mega cool. And hey, you were born to produce videos like this.
L&L templates need to be rendered before they get displayed to a user, which means that the markup itself always needs to be written inside a template. Other plugins and browsers probably won't know how to render/interpret the L&L language so you can't write your markup just anywhere on your site. I'm not familiar with LiveCanvas myself, but a quick Google search indicates that there's a LiveCanvas shortcode block. So you could theoretically write an L&L template and then render it in LiveCanvas using the [template] shortcode that's mentioned in the video. - Ben
We do plan on expanding our support for page builders (currently we support Gutenberg, Beaver Builder & Elementor along with WP Grid Builder to a lesser extent), but each one requires serious effort and consideration so we have to do it on the basis of popularity and ease of maintenance. We're working on some systems to make it faster to integrate new ones but I don't think we'll add anything outside of the top 5 in the next few months. That's not to say that those we don't currently have time to integrate aren't good builders, it's just that with the amount of builders out there we have to prioritize by popularity. Each builder also has its own unique 3rd party ecosystem and people always want us to make it work with whatever addon packs they have installed so once you add a builder the work doesn't end there haha.
Wow, what an amazing plugin -- this is a game changer!!! Thank you folks for creating this amazing tool, I will be converting so many of my sites with it.
This is valuable; and the ideal implementation to solve for the use case you described; namely, being able to create and reuse work that is builder agnostic. I'm going into a new build using Bricks, and their query builder is powerful; but for those recurring instances where clients whose sites were not built by me, reach out to have me build some custom component, your solution seems to be the ideal tool to build whatever is needed, and drop it into whatever environment I may find myself working in. There is definitely a need for this sort of thing in agency work. While building an entire site with L&L seems to be possible, I see the real value as a utility to construct an ad-hoc, fully containerized component in a project where I'm being brought in as an accessory to solve a specific problem.
That's absolutely how we use it internally as well, though increasingly we drop the page builders in favor of L&L on large dynamic data-driven projects where flexibility and performance is more important than drag-and-drop. Where we still find it useful even when a more advanced builder is available is making things client-proof since the advanced query blocks are too complicated for typical clients to manage themselves. Instead we make L&L based blocks for the page builder being used that only have the options that make sense for clients (and may include several queries and dynamically driven elements in the same block). We're looking forward to rolling out those block building capabilities to a wider audience in the future!
Just at the beginning of the video. I already have some hesitation. Gutenberg query block and that lets you build a loop like that in the Editor, it may be more code, a hassle to manually code it because all the JSON as comments, but it can be done. And when you build your loops like that you do not need anything but WordPress and you are more future-proof, not dependent on some 3rd party sh1t and people who have no clue of coding at all can later edit the loop inside the editor. You're also WAY better off using WP native blocks for post title, post image and all the dynamic stuff, you then have all the default CSS classes, and filters from WordPress that plugins and your own code can access. There are also already 100 templating languages that are implemented on php/wp already. Yeah, this is nice because it's just like HTML, but hardly a revolution. Sorry not impressed. I encourage people to learn Gutenberg FSE and build sites with blocks and write their own custom blocks/templates/template-parts/pattern when needed. The ecosystem of Gutenberg is the universal, maintained and long-lasting future of WP.
It's not for everyone, but we agree that for client handoff blocks are a better experience than giving clients access to some kind of HTML editor. That's why we've created Tangible Blocks, a system that allows you to use L&L syntax to quickly make configurable blocks without having to learn PHP/JS. You can even run these blocks without having the L&L editor on the site, so client admins can never see and mess up the L&L code powering the blocks. This is particularly interesting in cases where a client might even mess things up if given a generic loop block given all the options they could potentially touch. The L&L block can have just the options that the customer should be able to change, and can even have restrictions around acceptable values for sizing/colors to enforce a design system (yes there are other ways to do this with their own pros & cons). Is hand coding everything from scratch "better" in some ways? Sure, but in real life things are more complicated. We tested getting some experienced WP devs to make some custom blocks vs a brand new L&L user and the new L&L user was 10X faster at creating an equivalent Gutenberg block. Beyond that, the L&L block system creates a Gutenberg Block, Elementor Widget and Beaver Builder module at once from the same L&L template, ensuring we can have the same capabilities in many different stacks. Is using native WP stuff "better" than 3rd party builders? We think so, but we also know that when we work with clients their sites may be large complex monstrosities with years of history and we might not have the option of spending months to rebuild it. L&L allows us to have as much power and flexibility as we need in every stack, even if the client's 3rd party builder plugin has limited dynamic data and loop editing support. At the end of the day, since we've adopted this system, the frequency at which our frontend team members have to use up backend time has dropped dramatically and we're iterating faster than ever. L&L syntax is a lot more expressive than a loop block can ever be, so we use it for all kinds of things like creating complex reporting views, calendars, mixing non-post data from plugins that store things in Custom Tables that can't be accessed at all in loop blocks, etc. If you're a highly skilled full stack developer and are exclusively working solo on small projects where you have tight control of the entire stack, this probably won't help you. If you work with a team with mixed skillsets on more complex projects, we think it's worth a look and have a lot of internal data that proves to us it's a massive productivity boost. Sometimes we use L&L to quickly prototype a solution and iterate through different changes before then coding a custom plugin from scratch. This allows a client to get very quick turnaround on a feature and benefit from a prototype that is 80% of what they need while we work on the fully custom version. In terms of being dependent on a 3rd party vendor, L&L is free at the entire codebase is on GitHub for anybody to fork or contribute to so hopefully the risk is somewhat mitigated there, but most people are in the WP ecosystem because of the strength of 3rd party plugins in the first place.
This video is very well done.
Did you get permission to use the backdrops from these RUclipsrs?
Wonderful demo.. Really sells it all very well..
Could you share the CSS from the Style tab? I'd love to see it.
Thanks! A lot of it was just styles that already existed in the global stylesheet of the site I was working with, but if you download the pack of pre-made demo templates (linked in the description) you'll get the one I showed in this video with all the CSS/SASS baked into that Style tab. Should be easy to spot but the template is called "Advanced - Styled blog post grid."
- Ben
@@tangibleinc The styles editor supports sass in daahboard? That's nuts if it does.
@@QuickHistoryBits It does indeed!
Is that the @wptuts studio at 1:27
👀
Wow I'm feeling more inspired right now. This plugin is dope and will definitely recommend to my friends
You're a cool personable Tutor, it's easy to see you're behind the product. And the functions are also mega cool. And hey, you were born to produce videos like this.
You'd give the webflow guy a run for his money that's for sure
Long live to this project !
This only works in the L&L interface, right? We can’t slap it into the LiveCanvas editor?
It would be great
L&L templates need to be rendered before they get displayed to a user, which means that the markup itself always needs to be written inside a template. Other plugins and browsers probably won't know how to render/interpret the L&L language so you can't write your markup just anywhere on your site. I'm not familiar with LiveCanvas myself, but a quick Google search indicates that there's a LiveCanvas shortcode block. So you could theoretically write an L&L template and then render it in LiveCanvas using the [template] shortcode that's mentioned in the video.
- Ben
@@tangibleinc need to get an integration so they render with LC. That would be something.
We do plan on expanding our support for page builders (currently we support Gutenberg, Beaver Builder & Elementor along with WP Grid Builder to a lesser extent), but each one requires serious effort and consideration so we have to do it on the basis of popularity and ease of maintenance. We're working on some systems to make it faster to integrate new ones but I don't think we'll add anything outside of the top 5 in the next few months. That's not to say that those we don't currently have time to integrate aren't good builders, it's just that with the amount of builders out there we have to prioritize by popularity. Each builder also has its own unique 3rd party ecosystem and people always want us to make it work with whatever addon packs they have installed so once you add a builder the work doesn't end there haha.
Looking forward to see the evolution of this.
First!
Second!
Wow, what an amazing plugin -- this is a game changer!!! Thank you folks for creating this amazing tool, I will be converting so many of my sites with it.
Looks great, please provide us with some free starter WooCommerce templates as well.
now this looks an interesting addition to gutenberg and more
Make more of these vid's, please!!
This is valuable; and the ideal implementation to solve for the use case you described; namely, being able to create and reuse work that is builder agnostic.
I'm going into a new build using Bricks, and their query builder is powerful; but for those recurring instances where clients whose sites were not built by me, reach out to have me build some custom component, your solution seems to be the ideal tool to build whatever is needed, and drop it into whatever environment I may find myself working in.
There is definitely a need for this sort of thing in agency work.
While building an entire site with L&L seems to be possible, I see the real value as a utility to construct an ad-hoc, fully containerized component in a project where I'm being brought in as an accessory to solve a specific problem.
That's absolutely how we use it internally as well, though increasingly we drop the page builders in favor of L&L on large dynamic data-driven projects where flexibility and performance is more important than drag-and-drop. Where we still find it useful even when a more advanced builder is available is making things client-proof since the advanced query blocks are too complicated for typical clients to manage themselves. Instead we make L&L based blocks for the page builder being used that only have the options that make sense for clients (and may include several queries and dynamically driven elements in the same block). We're looking forward to rolling out those block building capabilities to a wider audience in the future!
Third!
w
Just at the beginning of the video. I already have some hesitation. Gutenberg query block and that lets you build a loop like that in the Editor, it may be more code, a hassle to manually code it because all the JSON as comments, but it can be done. And when you build your loops like that you do not need anything but WordPress and you are more future-proof, not dependent on some 3rd party sh1t and people who have no clue of coding at all can later edit the loop inside the editor.
You're also WAY better off using WP native blocks for post title, post image and all the dynamic stuff, you then have all the default CSS classes, and filters from WordPress that plugins and your own code can access. There are also already 100 templating languages that are implemented on php/wp already.
Yeah, this is nice because it's just like HTML, but hardly a revolution. Sorry not impressed. I encourage people to learn Gutenberg FSE and build sites with blocks and write their own custom blocks/templates/template-parts/pattern when needed. The ecosystem of Gutenberg is the universal, maintained and long-lasting future of WP.
It's not for everyone, but we agree that for client handoff blocks are a better experience than giving clients access to some kind of HTML editor. That's why we've created Tangible Blocks, a system that allows you to use L&L syntax to quickly make configurable blocks without having to learn PHP/JS. You can even run these blocks without having the L&L editor on the site, so client admins can never see and mess up the L&L code powering the blocks.
This is particularly interesting in cases where a client might even mess things up if given a generic loop block given all the options they could potentially touch. The L&L block can have just the options that the customer should be able to change, and can even have restrictions around acceptable values for sizing/colors to enforce a design system (yes there are other ways to do this with their own pros & cons).
Is hand coding everything from scratch "better" in some ways? Sure, but in real life things are more complicated. We tested getting some experienced WP devs to make some custom blocks vs a brand new L&L user and the new L&L user was 10X faster at creating an equivalent Gutenberg block. Beyond that, the L&L block system creates a Gutenberg Block, Elementor Widget and Beaver Builder module at once from the same L&L template, ensuring we can have the same capabilities in many different stacks. Is using native WP stuff "better" than 3rd party builders? We think so, but we also know that when we work with clients their sites may be large complex monstrosities with years of history and we might not have the option of spending months to rebuild it. L&L allows us to have as much power and flexibility as we need in every stack, even if the client's 3rd party builder plugin has limited dynamic data and loop editing support.
At the end of the day, since we've adopted this system, the frequency at which our frontend team members have to use up backend time has dropped dramatically and we're iterating faster than ever. L&L syntax is a lot more expressive than a loop block can ever be, so we use it for all kinds of things like creating complex reporting views, calendars, mixing non-post data from plugins that store things in Custom Tables that can't be accessed at all in loop blocks, etc.
If you're a highly skilled full stack developer and are exclusively working solo on small projects where you have tight control of the entire stack, this probably won't help you. If you work with a team with mixed skillsets on more complex projects, we think it's worth a look and have a lot of internal data that proves to us it's a massive productivity boost. Sometimes we use L&L to quickly prototype a solution and iterate through different changes before then coding a custom plugin from scratch. This allows a client to get very quick turnaround on a feature and benefit from a prototype that is 80% of what they need while we work on the fully custom version.
In terms of being dependent on a 3rd party vendor, L&L is free at the entire codebase is on GitHub for anybody to fork or contribute to so hopefully the risk is somewhat mitigated there, but most people are in the WP ecosystem because of the strength of 3rd party plugins in the first place.