2017-11-13 9 views
0

これで、クライアントのBigcommerceテーマを編集しています。私はBigcommerceの経験が少なく、PHPはほんの少しです。現在のテーマヘッダーが設定されているため、ロゴを左、中央、右のいずれかに合わせることができます。次に、ロゴがどこにあるかに応じて、検索バーとソーシャルリンクが他の2つのスペースを占めます。Bigcommerceテーマで2つのコンポーネントを組み合わせるにはどうすればいいですか?

I.E.左にロゴがあり、検索バーが中央に移動し、ソーシャルリンクが右側に移動していますか?

クライアントはヘッダーに別の「ロゴ」を追加し、検索バーとソーシャルリンクを結合したいと考えています。私は、ヘッダーのためのマークアップを見てい

、それは私が、私はちょうど私がちょうどによって取得しようとしていレイアウトを設定するために{#if theme_settings.logo-position '==' 'left'}を使用することができます考えています。この

{{#if theme_settings.logo-position '==' 'left'}} 
    <div class="header-logo header-logo--{{theme_settings.logo-position}} container"> 
     {{> components/common/store-logo}} 
     {{> components/common/quick-search}} 
     {{> components/common/social-links-header}} 
    </div> 
{{/if}} 

{{#if theme_settings.logo-position '==' 'center'}} 
    <div class="header-logo header-logo--{{theme_settings.logo-position}} container"> 
     {{> components/common/social-links-header}} 
     {{> components/common/store-logo}} 
     {{> components/common/quick-search}} 
    </div> 
{{/if}} 

{{#if theme_settings.logo-position '==' 'right'}} 
    <div class="header-logo header-logo--{{theme_settings.logo-position}} container"> 
     {{> components/common/social-links-header}} 
     {{> components/common/quick-search}} 
     {{> components/common/store-logo}} 
    </div> 
{{/if}} 

のように設定されています追加のロゴを追加し、クイック検索とソーシャルリンクヘッダーコンポーネントを組み合わせることができます。これらのコンポーネントをどのように組み合わせることができますか?

答えて

1

各コンポーネントには別々のテンプレートファイルがありますので、2つ目のロゴをstore-logo.htmlに追加し、quick-search.htmlのコンテンツをコピーしてsocial-links-header.htmlに貼り付けて結合しますそれらの要素。 CSSを使ってレイアウトを調整することもできます。これは本当に達成しようとしている位置に依存します。

関連する問題