[Resolved] I try to pass to Astra theme but it won't load the bootstrap classes

[Author]

Posts

[charlie]

I am trying to: to change the theme using Astra , passing from Toolset Starter Theme.

Link to a page where the issue can be seen: hidden link

I expected to see: the same layout with the same colors (classes of Boostrap)

Instead, I got: the same layout but without the colors. I just only see the colors of my css rules of the theme not of css of Bootstrap

[Shane]

Hi Charlie,

Thank you for contacting our support forum.

In the case where a theme does not natively load bootstrap then you will need to manually loading it using toolset.

To do this go to Tooslet->Settings-> Bootstrap Loading and then enable the loading of Bootstrap 3.

Please try this and let me know if the issue is resolved.

Thanks,
Shane

[charlie]

I tried to do as you said to me but it loads the bootstrap but not the css. I do really donot understand. Tanks

[Christian Cox]

Hi, the contextual background color classes are not included in the version of Bootstrap loaded by Toolset. Instead they are added directly to the Toolset Starter Theme's Bootstrap files. If you want to use the Astra theme and the contextual background classes, you should go to Appearance > Customize > Additional CSS and add the following code:

.bg-primary {
    color: #fff
}

.bg-primary {
    background-color: #3CBEFE
}

a.bg-primary:hover,a.bg-primary:focus {
    background-color: #09adfe
}

.bg-success {
    background-color: #dff0d8
}

a.bg-success:hover,a.bg-success:focus {
    background-color: #c1e2b3
}

.bg-info {
    background-color: #d9edf7
}

a.bg-info:hover,a.bg-info:focus {
    background-color: #afd9ee
}

.bg-warning {
    background-color: #fcf8e3
}

a.bg-warning:hover,a.bg-warning:focus {
    background-color: #f7ecb5
}

.bg-danger {
    background-color: #f2dede
}

a.bg-danger:hover,a.bg-danger:focus {
    background-color: #e4b9b9
}

[charlie]

I think it was easier put in the head tags the link to boostrap. Thanks,. Carletto