Partage

Bootstrap ne s'affiche pas

Sujet résolu
10 août 2017 à 14:19:24

Bonjour à tous, je suis en plein développement pour ma mission en alternance. J'ai intégré bootstrap au framework que je vais utilisé par la suite qui est codeIgniter. J'ai suivis plusieurs tutoriel rien de bien compliqué dans l'ensemble.

Et pourtant lors de mon test d'utilisation de bootstrap (la barre de navigation par exemple) voila comment cela s'affiche :

Je vous montre mon code qui est très simple  dans un premier temps mon contrôler home : 

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends CI_Controller {

    /**
     * Index Page for this controller.
     *
     * Maps to the following URL
     * 		http://example.com/index.php/Home
     *	- or -
     * 		http://example.com/index.php/Home/homeP
     *	- or -
     * Since this controller is set as the default controller in
     * config/routes.php, it's displayed at http://example.com/
     *
     * So any other public methods not prefixed with an underscore will
     * map to /index.php/welcome/<method_name>
     * @see https://codeigniter.com/user_guide/general/urls.html
     */
    public function homeP()
    {
     $data['title'] = 'infraadm';

        $this->load->view('template/header',$data);
        $this->load->view('template/navigation');
        $this->load->view('homeP');
        $this->load->view('template/footer');
    }

}

Voici mon code html pour la navigation (copié collé de bootstrap) :

<nav class="navbar navbar-default">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">Brand</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
                    <li><a href="#">Link</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">One more separated link</a></li>
                        </ul>
                    </li>
                </ul>
                <form class="navbar-form navbar-left">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search">
                    </div>
                    <button type="submit" class="btn btn-default">Submit</button>
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">Link</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                        </ul>
                    </li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>

Je ne met pas les codes header et footer car je m'explique j'ai demandé à un ami de tester ce code pour moi et me dire ou était mon erreur, seulement voila chez lui tout fonctionne. Je précise au cas ou je travail sur un MacBook Pro 2016 et mamp. 

Si vous avez besoin de plus de détail je pourrai vous les fournir. 



10 août 2017 à 14:54:49

Salut =)

Je pose la question au cas ou, ne le prend pas mal ;) : tu as bien importé le css et le js de bootstrap comme il se doit? Via un cdn ou en téléchargent les fichiers?

J'ai aussi trouvé ça je ne sait pas si ça peux t'aider http://forum.codeigniter.com/thread-1146.html

Ton pote n'a rien modifier lors de sont test?

-
Edité par HadockB 10 août 2017 à 14:58:13

Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
10 août 2017 à 15:10:55

Oui j'ai bien importé le css comme il se doit :)

J'ai trouvé la solution à mon erreur il faut modifier cette ligne dans le fichier config.php :

$config['base_url'] = '';

Par : 

$config['base_url'] = 'http://localhost:8888/nomRepertoireProjet';

Merci pour ta réponse le lien que tu m'as fournis va peut être m'aider pour la suite.

bonne journée :)


10 août 2017 à 15:15:27

Pas de soucie bonne journée et bon courage :magicien:
Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode

Bootstrap ne s'affiche pas

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown