web-dev-qa-db-ja.com

Bootstrap 3 Navbarへの検索ブロックの追加

Twitterを使用した検索ブロック ブートストラップ3テーマ は、残りのナビゲーションバーにインラインで表示されません。これをインラインで表示させるコツは何ですか?

私はそれをpage.tpl.phpに追加しようとしましたが、成功しませんでした。

何か案は?

編集:::

これをテンプレートに追加しました:

 <div class="col-md-3 pull-right">
           <?php if (!empty($page['searchblock'])): ?>
            <?php print render($page['searchblock']); ?>
          <?php endif; ?>
          </div>

ただし、これはこのbootstrapテーマでは正しくないようです。bootstrapコードでは、検索を次のようにラップします。

<form class="navbar-form navbar-right" role="search">
  <div class="form-group">
    <input type="text" class="form-control" placeholder="Search">
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>

デフォルトの検索ブロックテンプレートを変更する必要がありますか?私がこのシステムを学ぶとき、私の無知に助けてくれてありがとう。本当に掘り下げDrupal 7今すぐ!

3
jasonflaherty

同じ機能のリクエストがありました。 mytheme/template.php 私は追加しました

/*
 *  Preprocess page.tpl.php to inject the $search_box variable.
 */
function mytheme_preprocess_page(&$variables){
  $search_form = drupal_get_form('search_form');
  $search_box = drupal_render($search_form);
  $variables['search_box'] = $search_box;
}

/*
 *  Form alter to add missing bootstrap classes and role to search form.
 */
function mytheme_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'search_form') {
    $form['#attributes']['class'][] = 'navbar-form';
    $form['#attributes']['role'][] = 'search';
  }
}

mytheme/templates/page.tpl.php 私は追加しました

<div class="col-md-3 nav nabvar-nav navbar-right">
  <?php print $search_box; ?>
</div>

後に

<div class="navbar-header"> div.

(適切なブーストラップnavbar-rightの代わりに)float:leftがセカンダリリンクメニューに適用されると、まだ問題がありました。そのため、簡単な回避策として、mytheme/css/style.css 私は追加しました:

@media(max-width:768px){
  ul.secondary{
    float:none!important;
  }
}
1
miro marchi

あなたのタグによると、あなたはD7ソリューションを探しています。 Drupal 7 page.tpl.phpには$ search_box変数はもうありませんが、template.phpのプリプロセス関数に追加できます:

<?php
/*
 *  Preprocess page.tpl.php to inject the $search_box variable back into D7.
 */
function MYTHEME_preprocess_page(&$variables){
  $search_box = drupal_render(drupal_get_form('search_form'));
  $variables['search_box'] = $search_box;
}

次に、変数をpage.tpl.phpに出力するだけです。

<?php print $search_box; ?>

Module_invokeを使用することもできますが、テンプレートファイルにphpロジックを含めることはできません。

<?php
  $block = module_invoke('search', 'block_view', 'search');
  print render($block); 
?>

最初に投稿された回答 https://drupal.stackexchange.com/a/10288

0
Chris Godwin

私はこれらの線に沿って何かをします:

<form class="navbar-form" role="search">
  <div class="input-group">
    <input type="text" class="form-control" placeholder="Search"/>
    <div class="input-group-btn">
      <button class="btn btn-default" type="submit">
        <span class="sr-only">Search</span>
        <span class="glyphicon glyphicon-search"aria-hidden="true"></span>
      </button>
    </div>
  </div>
</form>
0
Lambda

これは、page.tpl.phpのChris Godwinのコメントに続いて、私がどのように実行したかです。

<?php if (!empty($primary_nav) || !empty($secondary_nav) || !empty($page['navigation'])): ?>
  <div class="navbar-collapse collapse">
    <nav role="navigation">
      <?php if (!empty($primary_nav)): ?>
        <?php print render($primary_nav); ?>
      <?php endif; ?>
        <div class="col-md-3 nav nabvar-nav navbar-right">
            <?php print $search_box; ?>
        </div>
      <?php if (!empty($page['navigation'])): ?>
        <?php print render($page['navigation']); ?>
      <?php endif; ?>
    </nav>
  </div>
<?php endif; ?>
0
Carlos

bootstrapこの問題に関するモジュールページ( navbarの奇妙な動作の検索ブロック ))によると、これまでの最善の解決策は次のcssルールです:

#search-block-form .input-group-btn {
  width: auto;
}
0
Olivier