Update bootstrap version 5..

[Alex-e107nl]

Is it possible to change the bootstrap version that e107 uses from 5.2.3 to 5.3.3? Then I don't have to change the new admin theme I'm building later!

[rica-carv]

You can always force your theme to use a bootstrap specific version from cdn...

But i agree with you, it should be a easy way to switch bs versions INSIDE e107....

[Alex-e107nl]

Ola, when you work in a admin theme it is not possible to use another BS version, i have tried it sideloading but it does not work as it should... i know how to change the BS version with the theme_library function config_alter(&$libraries) but it only works for the front theme maybe there's a option for the admin part also, who knows?

`/**
* Alters library information before detection and caching takes place.
/
function config_alter(&$libraries)
{
// Bootstrap (CDN).
//$libraries['cdn.bootstrap5']['library_path'] = 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.2';
$libraries['cdn.bootstrap5']['library_path'] = 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.3';
$libraries['cdn.bootstrap5']['path'] = '';
$libraries['cdn.bootstrap5']['version_arguments']['pattern'] = '/(\d.\d.\d-[a-z])/';

	// Bootstrap (local).
	$libraries['bootstrap5']['library_path'] = '{THEME}';
	$libraries['bootstrap5']['path'] = '';
	$libraries['bootstrap5']['theme'] = '';
	$libraries['bootstrap5']['version']	= '5.3.3';		
	$libraries['bootstrap5']['version_arguments']['pattern'] = '/(\d\.\d\.\d\-[a-z]*)/';
}

`

[rica-carv]

Added you to my rep with the theme as it is on https://e107.nl/ you can see how i did it..

@Alex-e107nl Thanks, but it still no go... Still have to use brute force....

My theme_library:
theme_library.zip

[Alex-e107nl]

You have to make sure that bootstrap.bundle.min.js is in your theme /js folder and the bootstrap.min.css in the /css folder... well it works in the classic theme... you can try it and see in the page code how what en where... i do not understand why...

<script src="/e107_themes/bootstrap_5_classic/js/bootstrap.bundle.min.js" defer></script> and
<link rel="stylesheet" media="all" property="stylesheet" type="text/css" href="/e107_themes/bootstrap_5_classic/css/bootstrap.min.css?1736444727" />

[rica-carv]

You have to make sure that bootstrap.bundle.min.js is in your theme /js folder and the bootstrap.min.css in the /css folder... well it works in the classic theme... you can try it and see in the page code how what en where... i do not understand why...

<script src="/e107_themes/bootstrap_5_classic/js/bootstrap.bundle.min.js" defer></script> and <link rel="stylesheet" media="all" property="stylesheet" type="text/css" href="/e107_themes/bootstrap_5_classic/css/bootstrap.min.css?1736444727" />

Err, sorry, but probably i'm having a big headache, but what's the point on having the theme_library file with all those bells and whistles if it ends up to inserting the css and the js that are in the theme? Why doesn't it grab from the CDN, as it was suppossed to do? Or from the core? Force those libs to be bundled on the theme is a bit weird....
I simply don't get it.... or i'm nuts for sure!

[Alex-e107nl]

CDN is not what i want to use but u are right, it should work and it is with my theme, <link rel="stylesheet" media="all" property="stylesheet" type="text/css" href="[https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css](view-source:https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css)" /> and<script src="[https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js](view-source:https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js)" defer></script>e107 before the 5.3.3 change from Cameron... so i do not know whats happening with you, but it is solved when u use the latest git now.. :-)

[rica-carv]

but it is solved when u use the latest git now..

Err, i don't used it yet! 😁

[PH5HP]

It would be nice they upgraded the whole E107 to Bootstrap 5 or am I saying something stupid now?

[Alex-e107nl]

Yes because sometimes you want to build something that does not use BS, for example themes from https://pixelarity.com/ But e107 is a bootstrap cms, it is mentioned everywhere so when you do not want to use BS you must find a way to overcome some difficulties... Done a test a while ago but even checkboxes are giving problems.. https://www.fysiowebdesign.nl/demo06/ Themes from wrapbootstrap also have navigation problems... But you can build very nice things with e107 so i will stick with it :-) https://fysiowebdesign.nl/demo12/

[Jimmi08]

You can have bootstrap admin for e107 but the frontend theme should work without bootstrap.

@Alex-e107nl checkboxes are already fixed - I run into this issue some years ago. You can completely override HTML code for them with snippets. I think that Artemis uses this... If not, I can look for an example.

The main problem is not whether to use Bootstrap or not but how this is managed by core - libraries versus constants, forcing you by the core to use some stuff... I prefer a constant way under theme developer control.

[Jimmi08]

It would be nice they upgraded the whole E107 to Bootstrap 5 or am I saying something stupid now?

But it should also give the option to not use it, if someone decides to not use BS! Right now there's no chance to "unload" BS...

There is a chance not to unload BS on the front end... you just need to use the correct scope in theme.xml. I haven't use core bootstrap libraries for years now - the main reason is that you can compile bootstrap with your own variables or customize the sass version to use just some elements (for example grids) so you end with 2x loading of bootstrap framework if you use bootstrap from core two.

[rica-carv]

Is there any good reason to use BS not at all?

12 Best Bootstrap Alternatives

[Jimmi08]

My 2 cents ... last one...

If you need with new boostrap5 theme to rewrite most of the templates, something is wrong and it is not CSS framework. There are tons of HTML bootstrap5 themes, why it is not possible to use them without much effort?

Nowadays, with CSS variables, sass and @extend functionality it should be easy to implement any CSS kit if classes are written correctly.

e107 needed its own class system and rules for it. Before it was fborder, button, forumheader... something like that. Now bootstrap classes are everywhere, and those names are not unique, other CSS framework can use them differently and you will end with rewriting almost each template.

Why e107 can't have all classes with prefix e_button or e-- like bs-- prefix is.
Then you would just use e_button extending f.e. btn class from the framework and you have your needed styling.

I think it is too late for this now. All of us who left here, have our own sites and customized themes already. Alex is working on bootstrap5 and nobody will spend months with creating a universal theme for another framework.

Moving from bootstrap-based CMS is a dead end. The same topic could be about JQuery, bootstrap 5 doesn't need it. e107 is not loading javascript in footer by default either, you need to use workaround for it. This worry me more than css framework.