[Resolved] bootstrap 4

[Author]

Posts

[bryan]

Hello

regarding this ticket and bootstrap 4

https://toolset.com/forums/topic/bootstrap-3-4/

for a site I am developing ..can you Please help me with either:

an ETA and/or the ' just a few tweaks here and there are required that you will need to be on the lookout for.' that Beda had used...

I am happy to test things as needed if this helps

cheers

[bryan]

Hello, just wondering if this got missed ?

[Nigel]

Hi Bryan

Sorry, I'm just catching up after returning from vacation.

I checked with the developers and we don't currently have a developer actively assigned to working on updating to BS4, and so I cannot give you an ETA of when Toolset will make the move from BS3.

From our preliminary discussions it sounds like the issues would mostly be with Layouts. If you are not using Layouts you may find you can use BS4 without issue.

Beda is off today but I will ask him to review what issues there are and any workarounds available when he is back tomorrow.

The first step to using BS4 instead of BS3 is to update Toolset > Settings to say that the theme is already loading Bootstrap (so Toolset doesn't need to).

Then you will need to manually enqueue the BS CSS and JS files yourself.

You can do that with the following code:

function tssupp_enqueue_bs4(){

	// BS CSS
	wp_enqueue_style( 'bs4-css', '<em><u>hidden link</u></em>', array(), '4.0.0' );

	// BS JS
	wp_enqueue_script( 'bs4-js', '<em><u>hidden link</u></em>' ), array( 'jquery' ), '4.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'tssupp_enqueue_bs4' );

You can add that code at Toolset > Settings > Custom code

My understanding is that Views and Forms should work without issue, while Layouts may not.

If you try and encounter specific issues, let me know.

Meanwhile I'll ask Beda to work on a list of potential issues, which we can publish.

[bryan]

Thanks Nigel,

welcome back

I am using beaver builder this time rather than layouts for this project so no worries there !

I tried your code in both toolset custom code functions.php and it seems to work fine [after I deleted the extra bracket]

 wp_enqueue_script( 'bs4-js', '<em><u>hidden link</u></em>' ), array( 'jquery' ), '4.0.0', true ); 

I have a couple of questions which I don't know if you or Beda can help with ?

• In toolset settings, I seem to have gotten the best results setting 'This site is not using Bootstrap CSS' - as I assume this only refers to bs2 and bs3 at the moment - is this the best setting ?
• I found a lot of tips that I should deregister the legacy jquery which wordpress uses... and add popper as a pre-reqs for BS4 -- and this solved a strange file upload button missing issue I previously had. I am just curious if Beda is using popper and jquery in this way
• wpastra told me they only load bs3 grid... so I might yet go with beaver builder theme which has bs4 as an option, so once again just curious what theme Beda is using

this is what my functions.php contained up until your update - having given no thought to the proper wp_enqueue_script and wp_register_script parameters.. it's just to give an idea

 <?php
/**
* izuio astra tcf testgf Theme functions and definitions
*
* @link https://developer.wordpress.org/themes/basics/theme-functions/
*
* @package izuio astra tcf testgf
* @since 1.0
*/

/**
* Define astra Constants
*/
define( 'CHILD_THEME_II_TCF_testgf_VERSION', '0.9' );


function izuio_tcf_testgf_enqueue_scripts() {

 /**
  * Enqueue styles
  */
 wp_enqueue_style( 'izuio_tcftestgf_style', get_stylesheet_directory_uri() . '/style.css', array('astra-theme-css'), CHILD_THEME_II_TCF_testgf_VERSION, 'all' );
 wp_enqueue_style( 'bootstrap', '//stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css' );

 /**
  * Enqueue Java scripts
  */
 wp_enqueue_script( 'bootstrap-js', '//stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js' );
 wp_enqueue_script( 'popper-js', '//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js' );

 /**
  * deregister wordpress legacy jquery then load 3.3.1
  */
 wp_deregister_script('jquery');
 wp_register_script('jquery', "//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js", false, null);
 wp_enqueue_script('jquery');
}
add_action('wp_enqueue_scripts', 'izuio_tcf_testgf_enqueue_scripts'); 

cheers

[Nigel]

Settings
I'm not sure that you should see any practical difference with the Bootstrap settings to specify BS3 is already being loaded by a theme/plugin vs the site is not using BS at all.

jQuery and popper
Unless you have a good reason to replace jQuery I wouldn't. Remember that WordPress is an ecosystem of themes and plugins. WordPress ships with jQuery, and so the ecosystem expects that version of jQuery to be present.

The popper.js library is required for certain BS4 features such as tooltips. The BS documentation states that popper must be loaded *before* Bootstrap's own JS. So you would need to enqueue popper and list Bootstrap as a dependency.

hidden link
https://developer.wordpress.org/reference/functions/wp_enqueue_script/

Themes
I know Beda normally works with a custom theme for his own projects. If the Beaver Theme has an option to work with BS4 then that seems like a good alternative, but the proof is in the pudding. Only by trying it will you see if there are any issues.

Do let me know what you find.

[bryan]

thanks Nigel, you are very helpful as usual, I will stick with your minimalist approach, I just wanted to be sure toolset doesn't use popper or the older/newer jquery and I mentioned the themes just in case there were/are any known issues, we will do extensive testing our side anyway.

Let me leave this open pending any tweaks Beda has... I know it will autoclose eventually.

cheers

[Nigel]

Hi Bryan

Beda has created a task for himself to do some formal testing so that we can give users specific advice rather than ad-hoc comments. Not sure how long that will take him.

I'll escalate this thread so it doesn't get closed and when he completes that I'll comment again with details of where to read his results.

[bryan]

perfect

thanks Nigel

[bryan]

Hi any update on this ?
thanks

[Nigel]

Sorry, looking at the internal tickets, much of the exploratory work has been done, but not the implementation.

As I'm sure you will appreciate there are a lot of competing demands on the developers, and it seems BS4 is the poor cousin that keeps finding itself at the back of the queue.

Not long ago we changed how we handle feature requests—the product manager wants to hear directly from clients himself to have a better understanding of what is needed—and so although you may have already upvoted BS4 as a requested feature, it wouldn't hurt for you to use this form to re-iterate your needs: https://toolset.com/home/contact-us/suggest-a-new-feature-for-toolset/

Sorry for the duplication of effort.

It seems Beda closed the internal ticket for testing BS4 because the devs are already aware of what is required and he took the View that we will use and support BS3 until we formally support BS4, and won't attempt to hack a version of BS4 that may work in the meantime, which means I think we should close here.

[diyanK]

Hi guys,

Writing just to let you know that I am also on the queue for BS4 support!
/already sent a feature request/

[Mark Sund]

Another user requesting Toolset 4! I submitted the feature request.