[Resolved] Bootstrap buttons

Home Forums Support [Resolved] Bootstrap buttons

Home Forums Support Bootstrap buttons

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #536556

    I’d like to use Bootstrap buttons on my site.

    I am loading the CSS and JS as follows:

    function enqueue_scriptsAndCSS() {
    	wp_enqueue_script ('bootstrap.min.js','https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js',array(),'',true);
        wp_enqueue_style('bootstrap.min.css', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css');
    add_action( 'wp_enqueue_scripts', 'enqueue_scriptsAndCSS' ); 

    Here is button code:

    <button type="button" class="btn btn-outline-primary">Primary</button>
    <button type="button" class="btn btn-primary">Primary</button>

    The buttons look tiny and when clicked, they have dark grey background, which seems to come from generatepress/style.min.css file.

    Looks like loaded bootstrap and generatepress styles compete. How could I solve 2 issues:
    1. Bootstrap buttons display as normal size
    2. Do not take background color from generatepress styles?

    You can see blue buttons “Primary” on the home page.

    Thank you

    GeneratePress 2.0.2
    GP Premium 1.6.2

    I tried not loading
    wp_enqueue_style('bootstrap.min.css', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css');

    Buttons are of normal size, bootstrap 3.3 is loaded, but background is still dark, when I click the button. Looks like it is till taken from generatepress css


    Figured it out

    1. One of my plugins loaded Bootstrap 3.3, which conflicted with Bootstrap 4.0
    2. I added some CSS to fix :focus state color.

    button.btn.btn-outline-primary:focus, button.btn.btn-primary:focus
    	background:white !important;
    Lead Developer
    Lead Developer
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.