Blocs 4.2 Beta Build 9

Hey everyone, here is beta build 9 of Blocs 4.2. This release patches a range of issues and brings a few tiny performance optimisations as well.

Bootstrap 5 :rocket:
It’s here, but please remember the framework is actually still in beta. We have a feeling the official release may happen during the beta testing for Blocs 4.2, however, until then we do not recommend using Bootstrap 5 for live production sites.

Migration :dizzy:
You can migrate up to Bootstrap 5 but not backwards, so as this is a super early beta only migrate with backup projects and again don’t migrate and push to production, it’s way to soon for that. :no_entry:

To migrate, open a Bootstrap 4 project and head to project settings, you will see a new framework dropdown, change this and you are good to go!

Javascript Rewrite :writing_hand:
Almost all of the javascript Blocs generates for light boxes, special navigations, scrollFX etc has all been completely rewritten in vanilla JS so regardless of whether your project uses bootstrap 4 or 5, please test every feature of the site before you move it into production. It’s a big rewrite and there may be some issues in these early stages, that will break functionality once exported.

JS Updates :face_with_monocle:
Jquery and the lazyload javascript have both been updated to the latest versions.

Localisation :fr: :de: :es:
Bonjour, Hallo, Hola! Our none native English speaking users will be happy to hear Blocs now speaks French, German and Spanish. You may notice a bad translation, some text cropping or another little interface oddity. Please let me know if you spot something and it’ll be fixed up in no time!

CSS Selectors :nerd_face:
For those interested in the new CSS selector support, you can now add these manually to classes, below is a list of newly support selectors.

  • :first-letter
  • :first-line
  • :selection
  • :first-child
  • :last-child
  • :first-of-type
  • :last-of-type
  • :placeholder

Solis :sunny:
We have also spent some time working on the Blocs companion app Solis, basically patching up some longstanding issues bringing in support for Bootstrap 5. You can download Solis 1.0.7 beta build 1 here.

Summary :grinning:
Please don’t be put off using this version of Blocs, just remember there are a lot of big changes in this release, so only use it for none critical, none production work, at least for the first few betas anyway.

Hopefully we are now closer to a final release, enjoy testing!


Download Blocs 4.2 Beta Build 9

Don’t forget to hard reload your browser, if the beta doesn’t show!


Additional
Custom Brics now show a warning symbol in the Bric Bar if their framework doesn’t match that of the project. Many of our custom Brics have been updated so they flag the new framework setting in the Bric Builder, you can download the updates for those using the Extension Manager.

There is also this new knowledge base post that should help with any custom code migration issues you may encounter when trying out Bootstrap 5.

4 Likes

Is there any way of fixing the THREE year old bug where the audio keeps playing when you close a video in a modal? This is beyond frustrating.

2 Likes

I would love to see more control on video - keep your eyes peeled though @Malachiman might have something coming…pleaaseeeeeeeeeeeeee!!!

3 Likes

Sorry for the frustration, but this is not a three year old bug.

The reason the videos do not automatically pause is because there are so many ways to embed videos using 3rd party platforms and almost all of them require different code in order to pause the video.

Also consider not all modals and light boxes contain videos, which means we would need to add a lot of extra code, that’s not necessary useful or required to every site, we do already do this in some places but we hope to avoid that going forward.

With this in mind we have left it down to the end user to add this additional code, which I know, you have already found here on the forum.

However, it appears you have not managed to find the knowledge base as you are unsure as to how to implement the code. This post on the Code Editor should point you in the correct direction.

Although this point hasn’t (to my knowledge) come up much in the last three years, I’ll put together a little knowledge base post to cover the implementation for the most common video platforms.

Hopefully this will save any future frustration.

7 Likes

The frustration is that this is “supposed” to be a SUPER simple website builder … yet I cannot do something as simple (and extremely common) as clicking on a video to see it, then closing it. THEN, I need to paste scripts to make it work (which I tried and doesn’t work)? Maybe you could make step-by-step work-arounds for simple / common things like this? Obviously, I’m not the only person that has run into this situation.

Well, having to open a modal in order to view a video is not common practice. The embedded video itself should have some kind of fullscreen toggle to enlarge it.

There’s also a video bric in the store… Never tried it in a modal though.

A modal is like a hidden content area on the page, which is just made visible.

The video will also not stop if you scroll past it to another area.

Blocs V1 was a super simple website building app, Blocs V4 is a very different app. It offers a lot more functionality and delivers options that are a lot more complex in nature.

Like I said, there are many variations of code required to do what you want depending on the implementation. The fact the code snippet doesn’t work, illustrates the reason why we don’t have a perfect solution, because it doesn’t exist.

I’ll hopefully be able to put together a few examples next week for the knowledge base.

Are you using a hosted video on YouTube/Vimeo etc or self hosted?

1 Like

Not sure what the frustration is as Blocs is indeed a SUPER simple website builder.

Yes, you can do this but you want to bring this to the next level and want to have this working in a modal as well. That’s not common practice, that’s a personal preferred style of showing a video.

Searching the forum you will find several solutions for your challenge.

1 Like

To be honest, whatever way actually works (hosted or YouTube/Vimeo). Thanks Norm, the examples in Knowledge Base are very much appreciated :slight_smile:

Jerry … and Norm too … Blocs is beautiful-looking (which I REALLY appreciate since V1) and it’s SUPER simple to make SUPER simple websites, yes … but to make the slightest bit more complex websites? Please. It gets VERY confusing & VERY overwhelming, VERY fast … it’s definitely NOT made for someone who doesn’t completely understand HTML like myself. I have so many custom classes on so many parts in so many levels, it has my head spinning!! I can’t keep track of it all. It’s definitely not intuitive drag & drop like other HTML builders, and there’s a TON of tinkering (A TON) I need to do on EVERY part of EVERY page at EVERY breakpoint EVERY single time. I come from Design software like Figma, Adobe XD, Sketch, etc where you click on something to move it. In Blocs, I’m spending hours fiddling around in the layers and Class Editor trying to select the right layer to make a part move or look correct. I dunno … the Class Editor is kind of cool, but WHY can’t ALL those options be on the right side? It may make sense to a developer, but not me.

So is Blocs SUPER simple? … maybe, depending on your experience. For me (owner since v1), Blocs is beautiful, it works (although still very buggy since v1), I can make basic websites, but … it’s a looooong drawn-out painful experience of fiddling around with hundreds of parts I can’t keep track of. I even have all of Eldar’s videos and the way he accomplishes things is NOT intuitive either. I have to KEEP re-watching his videos just to remember ALL the little details he goes through to get a certain feature … which means the efficiency & productivity of Blocs is not very streamlined. Sorry for the small rant … just being honest at how frustrating & time consuming Blocs can be … for me at least.

And as far as not being common practice … maybe for you, but I’m a designer with hundreds of videos and designs where a modal / lightbox is absolutely necessary. My point (yes I searched the forum and the scripts do NOT work), was that it doesn’t work as expected (the sound continuously plays when you close the modal). Why have the ability to even make a modal with video if it’s known for 3 years to NOT to work correctly? I’m looking forward the the updated Knowledge Base so the correct way of doing this will be solved :slight_smile:

Lastly, Norm … keep up the amazing work, I’m certainly looking forward to (and hoping) future versions are more accessible to “non-coder” people like me. That’s what originally attracted me to Blocs! I like to see it swing back to simplicity instead of the endless, time-consuming, fiddling around with layers and classes that I evidently have to do now to create a Blocs website.

Thanks

2 Likes

All new things are overwhelming at the beginning, even if it’s just an update with little change… even more if there is a whole new version coming up.
I think, especially in these fast changing times, we need to stay flexible and be open to changes that demand us to alter our own workflow. I really hate to alter my very good elaborated workflows, but I’m always glad after I did it. Cause it always gives me new and improved possibilities.

What I wanna say: I guess sometimes it’s not the “problem” of the application, but our own aversion to change. On some days I really miss my old NOKIA phone, but most of the time I’m very glad the technology improved, even if I lost the overview of all the functions my iPhone has (and with every update I loose it a little more :see_no_evil:)

Users that want the simplicity of V1 probably have no other option than stay with V1… no offence :slight_smile:

I love change … change is good. I always try to educate myself and, in fact, have all of Eldar’s tutorials. My point is, that the added complexity is a good thing, but Norm and company seem to be looking at the interface and HTML process from a “developer” perspective to solve the added complexity … not the end user’s “non-coder” perspective. This makes the entire application needlessly tedious and un-streamlined. A good, well designed piece of software is not only beautiful, but uses simple solutions to solve complex problems … not complex solutions to solve complex problems. There is no reason I should spend hours in the layers and class editor endlessly tweaking parts across multiple breakpoints to get a webpage that works. This is why I bought Blocs because at V1, it was a simple solution to a complex problem. I hope Norm starts to revisit that ideology moving forward.

2 Likes

That’s exactly what I’m afraid of.

1 Like

I think you make some really good points, although, there are various points I disagree with.

Some examples from the latest beta 4.2 that simplify development tasks:
• Migrate to Bootstrap 5 framework
• Combine CSS & JS
• Set open Accordion item
• Wrap Bric in div container function
• Wordpress custom loop controls

Some general examples of simplicity.
• Building layouts
• Applying animation
• Applying scroll animations
• Applying Parallax
• Implementing popups/modals
• Integrating Social cards
• Add scroll to top button
• the list goes on

I would also point out that the core developer tool, “the Code Editor” is one of the weakest aspects of Blocs. It’s extremely limited in comparison to the likes of Sublime, Nova etc.

It also rarely gets any attention.

It’s also worth noting that we make decisions and integrate features to give the greatest level of flexibility. In the past we have limited some features to focus on simplicity only to then backtrack to give more design options.

The idea that our view is biased towards developers, in my opinion is not valid. Our view is based on flexibility and simplicity.

None of which have the ability to generate production quality code. What is interesting is these tools now offer ways to create responsive layouts, which in turn massively increases the complexity of editing and maintenance.

Putting the Class Editor in the side bar completely side steps the entire point of the code (CSS) it manipulates. The reason it is separate is because a single class can be used on multiple elements, unless I’m mistaken, your suggestion is that every item on the page should have dedicated styling options limited only to each individual item? This is great for animation or interactions but very limiting when regarding the flexibility CSS delivers.

I’ve no doubt placing the class controls in the side bar would make Blocs feel more design-tool like and it may happen, however it wouldn’t change the functionality of it. It would simply be populated with the class you select from the class field, it would just no longer be a floating window.

It’s also important to note, there are still areas in Blocs that need to be simplified (styling the hamburger menu icon, closing videos in modals, etc) but overall Blocs is one of the few web design apps available that balances simplicity and flexibility and doing it all with quality code output.

I hope my response doesn’t come across too defensive, as a contributing factor of the success of Blocs is the type of feedback you have put forward.

We do listen but we also need to consider both sides of the coin :sweat_smile:

12 Likes

@gregjobes like you I’m a non coder.
Before Blocs, I used Freeway and Muse, both very visual in how you put the pages together, but they turned out decent sites without extra coding, bringing in extras and making life easier with their versions of paid for brics and blocs.
If @Norm was to be incorporating all of these extras into the programme then you’d be paying a hell of a lot more for it, for some bits that some of us wouldn’t need, but I digress.
If there’s something specific, this is the place to come, along with the knowledge base (which I have difficulty finding my way around) or the blocs store. You may be able to pick up what you need for a relatively cheap cost.
I’m very slowly picking up bits of code, just by hunting through the forum and incorporating here and there.
Out of the three web programmes I’ve used, Muse was my favourite because of its free form placement of objects, but that brought its own problems.
The more I use Blocs and understand it, the more I enjoy it, and although I’m not a big web designer, it’s something I can see myself sticking with for as long as it lasts as it always seems to turn out rock-solid sites, which is the final solution for all concerned.

3 Likes

I thought it was me, so I’m glad to read that you have the same frustrations with Blocs as I do. Super simple it most certainly is not. The solutions, once found, might then appear simple, but the process of finding them is not (and I particularly like your point about fidlding with the layers in order to find the right one to make a part move or look correct).

1 Like