Skip Navigation

[Resolved] Speed up the page loading without unnecessary toolset plugins

This support ticket is created 5 years, 4 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 -
- 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 -

Supporter timezone: Europe/London (GMT+01:00)

This topic contains 9 replies, has 4 voices.

Last updated by Nigel 5 years, 3 months ago.

Assisted by: Nigel.

Author
Posts
#1249799
Screenshot 2019-05-25 at 12.09.43 AM.png

Dear Sir/Madam,

As I don't know how Toolset manage the loading of necessary stylesheet and javascript if the page has no Toolset plugins need. Refer to the https://toolset.com/documentation/recommended-themes/, I purchase the GeneratePress and install with Toolset plugins. Refer to screenshot, no matter how I change the content to the page, the padding-left and right are always be declared. I want to make the section with full page background image but 15px always be declared to the padding-left and right.

Finally, I find the padding is added by the Toolset plugins. I remove the padding by deactivating the Toolset plugins type-access > wp-views > types > cred-frontend-editor > layouts one by one and it remove the padding declaration. The page does not include the function from all above Toolset plugins, is it possible not to load the stylesheet from the plugins that are not required to the page? I think it can help to reduce the unexpected problem and also improve the page speed.

Does Toolset have such a setting or you can recommend me how to fix it within a short period? I urgently need to remove the padding but don't want to override the plugins' default stylesheet when used on different pages.

Best regards,

Kelvin.

#1249837

Toolset Layouts offers settings to remove/keep the paddings when you manipulate the Rows in Toolset > Layouts > your_layout > Row > Edit
But I'm not sure you use Layouts there, it seems the HTML does not feature Layouts markup, so then it would be native Bootstrap as delivered by Toolset.

I can't tell precisely as your site is not reachable:
hidden link
(DNS_PROBE_FINISHED_NXDOMAIN)

Eventually, you have to whitelist my IP or similar, please let me know.

#1249889

Dear Beda,

Sorry the site is under development, not yet launched but I duplicated it to hidden link

Yes I didn't use the Layouts but once I removed all Toolset plugins type-access > wp-views > types > cred-frontend-editor > layouts, then it resumes normal.

Best regards,

Kelvin.

#1251839

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+01:00)

Hi Kelvin

Beda is off, let me step in.

The padding is added because your div with id="page" adds a "container" class, and Bootstrap adds the padding to the .container class (see screenshot).

I think it is your theme that outputs that div#page.container, so one solution would be in a child theme to remove the container class from the div.

Another would be to add your own styles to override the container class style rules for padding.

Another would be to go to Toolset > Settings and say that the site is not using Bootstrap, but this could have side effects elsewhere on your site that you would need to be on the lookout for. Notably, Toolset Forms and Views both use Bootstrap for layout purposes and default styles for form controls.

Finally, while building pages on the server, when constructing the page header Toolset doesn't know if its assets might be needed later on the page, which is relevant to CSS in particular because stylesheets are normally linked to in the head, and so it tends to load them wherever they might be needed.

We have an internal ticket about improving this, and—in particular—giving more control to developers about which pages what resources should appear on. It is not being actively worked on right now; you are welcome to give it a nudge by submitting this form: https://toolset.com/home/contact-us/suggest-a-new-feature-for-toolset/

#1251995
Screenshot 2019-05-28 at 11.03.00 PM.png

Dear Nigel,

Thanks for your reply. I confirm the padding is from Toolset plugins. Please refer to screenshot.

For most one page theme, we usually expect the background image is full-width display.

Best regards,

Kelvin.

#1252643

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+01:00)

Yes, I saw the same, it is as I described in my earlier reply with the padding declarations coming from Bootstrap because the div with id of page has a "container" class.

So the options are the same as I described in my last reply.

#1256189
Screenshot 2019-06-02 at 8.22.32 PM.png
Screenshot 2019-06-02 at 8.17.12 PM.png
1249799-Screenshot_2019_05_25_at_12.09.43_AM.png

Dear Nigel,

As the Toolset will use the Bootstrap to build the Bootstrap grid from View loop output, I need this function but I find the Bootstrap 3.0 will also override the padding of the container and disturb the outlook of the GeneratePress theme (see attached screenshot) when setting the container in full width. I purchase the GeneratePress because it is one of the Toolset recommended theme and it is light-weight theme compare with others.

I research and find a good isolated-bootstrap ( hidden link ), it allows me deciding whether I want to use Bootstrap or not, is it possible to replace the Bootstrap 3.0 with this from the Toolset settings > General > Bootstrap loading?

Best regards,

Kelvin.

#1257331

Hi Kelvin,

Thanks for writing back.

Nigel is on vacation and will be back tomorrow and I'll be following up, while he is away.

When I checked your web site's homepage ( hidden link ), I noticed the right and left padding values have been overridden using the following custom CSS code:
( from the file: hidden link )


body.home .container {
	padding-left: 0px;
	padding-right: 0px;
}

This approach of overriding the default theme styles is indeed the right way to go, in case the theme uses any common classes which are used by other plugins or styles library like Bootstrap.

However, if you're still interested in loading isolated-bootstrap files ( hidden link ), you can:

1. Go to WP Admin -> Toolset -> Settings -> General and select "The theme or another plugin is already loading Bootstrap 3.0" for the "Bootstrap loading" option, which will stop Toolset plugins from loading internal Bootstrap files ( styles and scripts).

2. After that, you can load the Bootstrap files from any third-party source ( e.g. isolated-bootstrap ) manually from the theme.

regards,
Waqar

#1257333

Dear Waqar,

Yes, I need to change the padding for every full width, for me, I am fine to find the element and add the style but it is difficult for an editor to do so. Except for the View > Bootstrap grid, is there any other requires the bootstrap for Toolset?

Best regards,

Kelvin.

#1258355

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+01:00)

Hi Kelvin

Bootstrap is used for the Bootstrap grid output format of Views, and it is also used for Layouts, and for default form element styles. If you use the drag and drop builder for forms and add fields inside columns, Bootstrap would also be needed for that.

It is very much necessary for Layouts, but with form styling you may find that your theme already includes default styles for forms and the Bootstrap styles are not required.

This ticket is now closed. If you're a Toolset client and need related help, please open a new support ticket.