Helix Ultimate 2.0 Beta 2: Bootstrap 5 & Updated Font Awesome, Improved Menu Builder and Accessibility - JoomShaper

Helix Ultimate 2.0 Beta 2: Bootstrap 5 & Updated Font Awesome, Improved Menu Builder and Accessibility

09 April 2021
Hits 10,202
4 min read
Helix Ultimate 2.0 Beta 2: Bootstrap 5 & Updated Font Awesome, Improved Menu Builder and Accessibility

They say sequels never live up to the original. In the case of Helix Ultimate, that trend doesn’t have a leg to stand on. Helix Ultimate 2.0 is shaping up to be a more amazing product than its predecessor.

Good morning Joomlers! Here to welcome the weekend, we’re dropping another beta update to your favorite template framework that brings us one step closer to the final version that you can use on your production website. We’re thrilled about this beta release, and we think you will be too! Let’s go through some of the most notable additions and changes to Helix Ultimate 2.0.

If you’re not caught up with Helix Ultimate 2.0’s latest changes, I highly recommend reading our previous blog on Helix Ultimate 2.0 Beta 1.

Helix Ultimate 2.0 Beta 2 Changelog:

  • New: Bootstrap updated to 5.0
  • New: Update Font Awesome to 5.15.2
  • New: Option to enable or disable Font Awesome
  • Update: Improved accessibility
  • Update: Improved menu builder 
  • Update: Drafted changes are now reflected only to the edit mode
  • Fix: Edit menu item validation issue
  • Fix: Media library blog image sizes issues
  • Fix: Multilingual header menu issue
  • Fix: Frontend article editing issues

Today’s (April 9th) Beta version is an experimental release and not ready for production sites. We wholeheartedly appreciate your interest in Helix Ultimate 2.0. You are invited to try this Beta version, but DO NOT use it on a production site.

Updated Bootstrap Version to 5.0

With this release, we have updated Bootstrap to v5.0. This brings huge changes to the popular frontend framework such as switching from jQuery to vanilla JS, utility classes, and a custom SVG icon library. To find out more about Bootstrap 5, head over to their official documentation here.

You Can Now Disable Font Awesome + Font Awesome 5.15.2

Font Awesome’s a pretty cool tool for designers and frontend developers which enables you to use clean fonts and icons on web pages. But, it’s not always necessary to load Font Awesome on every page, as you may not need its resources. So, we’ve added a new option to disable Font Awesome for your entire website. This will hopefully improve load times slightly but noticeably.

We have also updated Font Awesome to v5.15.2. This adds a bunch of visual and internal upgrades to Font Awesome which should drastically improve your experience with it.

Usability Upgrade to The Menu Builder

This update also improves the Menu builder. If items with the same name are assigned to the same menu level, then the system will warn you and prevent you from performing that action. You will not be able to add that item until and unless you have renamed the duplicate name. This will hopefully remove any confusing factors regarding menu building.

Miscellaneous Fixes

  • Edit menu item validation issue: Your input data will be validated while editing or adding new menu items to ensure consistency of the items.
  • Media library blog image sizes issue: Previously, if you edited the default image sizes in the media library, they were not being saved properly. This has been fixed and now you can customize image sizes for blogs in the media library.
  • Multilingual header menu issue: Previously, when a page was translated and the multilingual mode was enabled, the header would not show up in the correct language. Now, this issue has also been fixed.
  • Frontend article editing issues: When a user wanted to edit an article from the frontend, the frontend article editing tab could not be found under certain conditions. In this release, we have also fixed this inconsistency.

All other known bugs from previous community feedback have also been fixed as well.

Road to a Stable Release of Helix Ultimate 2.0

The road to Helix Ultimate 2.0 has been quite a long one. But at the same time, it feels like only yesterday when we started working on the alpha versions.

With the release of Helix Ultimate 2.0 Beta 2, we only have these 2 other major updates before a stable release is up for grabs: 

  • Helix Ultimate 2.0 Beta 3
  • Helix Ultimate 2.0 RC

Wrapping Up

We’ve come a long way from our first alpha builds of Helix Ultimate 2.0 a few months ago. Our team has worked tirelessly throughout these troubled times to give you the best Joomla experience ever with Helix. Which feature are you most looking forward to this time around? Leave a comment!

Warning: This is an experimental build intended for testing purposes. Please don't use this experimental version in production sites!

Try Helix Ultimate 2.0 Beta 2

 
 
 
 
 
 
 
 
 
 
 
Ruhit Rafian

Ruhit Rafian

Technical Content Writer
Ruhit is a technical content writer at JoomShaper. He writes about technology, loves music and gaming, and likes to occasionally get lost into the mountains.
H
happydancer
3 years ago
This is indeed good news, well done joomshaper Team. I've particular value in this realease is the option to enable or disable FontAwesome. In the past, lack of this option this has made me reluctant to use the Helix template framework due to the unnecessary overhead of FontAwesome contacting google servers and the consequent impact on page speed whether the fonts are wanted or not.

One question: by "disable" does this absoluely mean that the code for contacting google servers does not appear anywhere in the rendered page html code?
Paul Frankowski
Paul Frankowski
3 years ago
Font Awesome files are loaded from the template folder, with no relation with Google. FA collection is not made by Google or own by Google.
If disabled - FA isn't loaded.
H
happydancer
3 years ago
I need to edit my typos but not edit function available so apolgies!
Carlos Miguel Soria
Carlos Miguel Soria
3 years ago
https://youtu.be/htRfKoQ6ROE En este video haremos un Review de la última actualización de la plantilla Helix tomaremos en cuenta aspectos como:
- Menús de la Plantilla
- Diseño Responsive
- Header de la Plantilla
- Aspectos que se deberían de mejorar.
Dmitry Goncharov
Dmitry Goncharov
3 years ago
You need to make it possible to disable google fonts and the ability to upload your local fonts.
A
Andrea
3 years ago
I agree with you
Paul Frankowski
Paul Frankowski
3 years ago
You can disable Google fonts, no problem, just select Arial, Tahoma, Verdana etc.
About Custom font - not in 2.0 version. Right now you have to load using custom CSS as was before, it takes only 3 min longer.
H
HDcms
3 years ago
HI,
+1
Thanks
S
ssnobben
3 years ago
MG
Michael G
3 years ago
How can i set the color from the burger icon and the cross icon if the sidebar menu is open?
right now it is always black and i have to change this to get conform with my site design.
Sajeeb Ahamed
Sajeeb Ahamed
3 years ago
Currently, there is no such option for changing the color. But you can do it on your own by writing a simple CSS. Just create a directory named `custom` under `templates/shaper_helixultimate/css/` and create a file inside the `custom` directory. The filename would be anything you want. Say the filename is `custom_header.css` then put this CSS code into this file. `.burger-icon > span {background-color: #dc3545 !important;}`
A
AMurray2017
3 years ago
Could you also do this in the template's "custom code" setting?
Paul Frankowski
Paul Frankowski
3 years ago
Yes, of course. Use Custom CSS field.
J
Justin
3 years ago
Not sure if this is a bug but when I add a custom.css file to the template's css folder it doesn't seem to recognize it, where as it did with the previous beta.
Sajeeb Ahamed
Sajeeb Ahamed
3 years ago
This is a bug. For now, you can add your custom CSS file(s) inside `css/custom/your_file.css`. There you can add as many files as you need to add and there the name of the file doesn't matter. The issue will be fixed in the next version.
J
Justin
3 years ago
Thanks Sajeeb, creating the 'custom' folder and then adding the file there did the trick!
Y
yo_ray
3 years ago
Thanks Joomshaper Team.
Could you maybe inform in a post or blog if HU2 will be just available for Joomla 4 when it will be released or if it will work with J3x and J4 or if there will be two different versions.
What we can expect. Thanks a lot!
Sajeeb Ahamed
Sajeeb Ahamed
3 years ago
Helix Ultimate 2 is already compatible with Joomla! 4. This will be one package which will work J3 & 4 simultaneously.
AV
Adrian Versey
3 years ago
Hi How can I turn off the off canvas menu in desktop view but leave it on for mobile view?
Adrian
Paul Frankowski
Paul Frankowski
3 years ago
Template Options > Menu > Mega Menu > Menu Type: choose only Mega Menu
AV
Adrian Versey
3 years ago
Hi The custom.css file you can create and add your own css is not working
Paul Frankowski
Paul Frankowski
3 years ago
Please read the answer comment (from Sajeeb) about it - above!
Paul Frankowski
Paul Frankowski
3 years ago
just use my_custom.css
H
happydancer
3 years ago
My mistake over FontAwesome vs Google Fonts and Google Servers and my confusion, none of which I like or want on my websites. I dont like to include fancy fonts that confer nothing more than a visual look but with a web page speed load performance hit. So, does the same problem persist then, you cannot switch off the automatic contacting of goodle servers regardless of whether you want google fonts or not? If you can switch this off then great, if not I'll take a pass again, in all other respects this is a great product but I am not prepared to take the performace hit of automatric contac t of google servers for fonts. I also don't want Font Awesome either but at least that can now be switched off!
Paul Frankowski
Paul Frankowski
3 years ago
Yes, FA you can just disable: On/ Off.
But almost this same is with Google Fonts - just in Typography set Arial, Verdana etc. I mean set System Font for body, headers - and do not choose any Google Fonts, and they would not be loaded.
Svyatoslav
Svyatoslav
3 years ago
Thanks, Joomshaper!

You switched to Bootstrap 5. That's great! But now there is no jQuery in the template. But older sites used it for other Joomla components. If you simply update the template, they will stop working. For example, "Phoca Guestbook" does not work. This can be fixed in inconvenient ways. Is it possible to add a drop-down list to the template settings with a choice of popular versions of jQuery v1.12 - jQuery v3.*. They must be specially selected for Bootstrap 2-3-4 separately. This drop-down list would be handy next to the FontAwesome "on / off" button. By the way, FontAwesome can also be made a drop-down list with different versions 4-5-6.....Material Icons :).
Paul Frankowski
Paul Frankowski
3 years ago
About JQuery you can just load jQuery directly from Joomla 3x, it was and still is here: media \ jui \ js \ jquery.min.js
it would take you only 60sec more to enable this.
OR ask the component developer. Because as we both know JQuery should be loaded only on subpages where is really used by extension.

FontAwesome 4.7 - old, finished line.
FontAwesome 5 Free - is default.
FontAwesome 6 - in the future, when it would be a stable version.

About icons - we can consider icons from the Boostrap liblary.



Svyatoslav
Svyatoslav
3 years ago
Yes, I agree. Maybe it's not necessary.

"About icons - we can consider icons from the Boostrap liblary."

It would be nice, a lot of icons do not happen!
Svyatoslav
Svyatoslav
3 years ago
And there is another very cool idea!

If you can implement it you will have the coolest template on the market Joomla CMS!

The point is to use pop-up full versions of images in articles!

Currently, this functionality is available in only two plugins and one framework:
- BK-multithumb - for joomla 3 (plugin)
- JUImage - library for render thumbs for joomla 3 (framework, https://github.com/Joomla-Ukraine/JUImage)
- JUMultithumb - for Joomla 2.5 (plugin)

They all don't work with Joomla 4, but this feature is very useful!

It would be good to see this functionality in your template set as a plugin that can be turned on or off.

Good luck to you, you are one of the best!
S
ssnobben
3 years ago
There is a bug for php 8 and multilanguage selector J 3.9.25. It doesnt work and give you 0
syntax error, unexpected token "\"
Paul Frankowski
Paul Frankowski
3 years ago
I saw that you added issue on github already, thanks a lot. We will check and fix it.
Paulo Roberto Vida
Paulo Roberto Vida
3 years ago
When are you going to implement font-size for REM?
J
Joop
3 years ago
Thanks Joomshaper Team!

I only noticed one thing:
When editing a duplicated template style the changes won't save!
Paul Frankowski
Paul Frankowski
3 years ago
Thx. Please add found issue here: https://github.com/JoomShaper/helix-ultimate/issues - with more details: used Joomla version, browser etc.
burn.hard
burn.hard
3 years ago
Hi, will there be a one click update for sites built on the "old" Helix Ultimate to Helix Ultimate 2.0 ?
H
happydancer
3 years ago
Thanks for your reply. Quoting you:

"But almost this same is with Google Fonts - just in Typography set Arial, Verdana etc. I mean set System Font for body, headers - and do not choose any Google Fonts, and they would not be loaded."

Wasn't that as before? You could choose non google fonts but still the rendered code would insist on contacting google severs despite google fonts not being required for the rendered broswer page. Thus a performace hit whether you choose google fonts or not. In this update, does non selection of google fonts mean that the rendered html does not include code for contacting google servers anymore? This was a bugwith the previous rendered code. Sorry to be so pedantic on this point but best it is clarified before a spend time testing. Thank you!

Sign up for our newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.