2016-07-22 11 views
0

Ich arbeite gerade an einer Website, die von jemand anderem mit Wordpress erstellt wurde, und ich muss einige Webseiten darin einfügen. Ich habe bereits alle funktionalen Teile in PHP gemacht und jetzt muss ich den Designteil machen. Dafür möchte ich Bootstrap verwenden, aber wenn ich Bootstrap in der Kopfzeile verbinde, die bereits existieren, ändern sich auch einige Teile der Webseite.Bootstrap selektiv auf einer bereits bestehenden Website verwenden

Ich denke, sie haben einige Klassen- und ID-Namen gemeinsam, also möchte ich wissen, ob es irgendeine Methode gibt, wo ich Bootstrap nur für meine Webseiten verwenden kann. Zusammenfassend, ich schließe die Kopf- und Fußzeile, die bereits existieren, und ich möchte Bootstrap auf den Körper verwenden, ist das möglich?

Antwort

0

Link-Bootstrap im header.php Dokument:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 

Optional, wenn Sie zu dem JavaScript mögen:

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 

Beide werden direkt aus den Bootstrap guide kopiert. Sie können nun diese in Ihrem HTML verwenden:

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-sm-6"><p>Oh hey</p></div> 
     <div class="col-sm-6"><p>Oh hey</p></div> 
    </div> 
</div> 
+0

Vielleicht sagte ich es in die falsche Art und Weise, aber wenn ich einen Link Bootstrap mit dieser Zeile, der Header chan ges (auch die Marge und andere Dinge ändern sich). Ich möchte Bootstrap verwenden, ohne den Header zu ändern. – Zhang

0

Es wird schwierig sein Bootstrap zu verwenden nur im Körper, weil Bootstrap natürlich seine CSS auf Ihre gesamte Webseite gilt. Sie könnten einige Teile des LESS-Codes ausschließen, aber ich bezweifle, dass Sie den Text vollständig von der Fußzeile und dem Header trennen können. Bootstrap gilt für alle Arten von HTML-Tags für Listen, Absätze, Überschriften usw.

Es würde vielleicht helfen, wenn Sie uns genau sagen würden, welche Elemente sich ändern, aber nicht sollten.

Wenn Sie nur ein einheitliches UX möchten und keine Designspezifikationen haben, können Sie versuchen, eines der vielen WordPress-Designs zu verwenden, auf denen Bootstrap vorinstalliert ist.

0

Ich weiß, es ist nicht perfekt, aber wenn Sie bestimmte URL zu Seiten, wo Sie Sie verwenden boothstrap könnte tun, um diese

<?php 
    $uri = $_SERVER['REQUEST_URI']; 
    if (strpos($uri,'/contains-this-in-url/') !== false){ 
     echo '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">' 
    } 
?> 

Um zu erklären, wird $ uri den Teil der URL enthalten, die nach dem Domain-Namen (www.example.com) die if-Anweisung prüft, ob $uri gewünschten Teil enthält Sie === für bestimmte Pfad verwenden können und mehr Kontrollen haben jedoch das Hinzufügen oder mit ||

Verwandte Themen