shopifyページにコードを追加するには

Question

https://codepen.io/fjenpen/pen/pROPovのようなコードを、既存のテーマを破ることなく、shopifyストア内の複数のshopifyページの1つに追加するにはどうすればよいですか？ Online Store > theme & edit HTML/CSS of current active theme へ

<div class="top"></div> 
<div class="bg"> 
<div class="nav"> 
<ul id="menu" style="list-style-type: none;"> 
<!-- Give your href some actual meaning --> 
<li><a href="#Section1" style="text-decoration:none"><h1>Our Brands</h1></a> </li> 
    </ul> 
</div> 

<div class="main"> 
<div id="Section1" class="content"> 

<p>View our brands</p> 
</div> 

Answer 1

ナビゲートしますリンクされているペンから、あなたはHTML、CSS & JSを追加する必要があります。 HTMLのための

1. HTML

   • 所望の領域の液体のテンプレートを見て、あなたはHTMLを追加することができます。スニペットを作成して含めることができます。ベアテキストの代わりに言語翻訳を使用する。テーマのCSSファイルの

2. CSS

   • 見て、それは通常「xxxxx.scss.css`ファイルです。そこにあなたのCSSセクションを追加したり、別のCSSファイルを作成したり、theme.liquidテンプレートからインクルードすることができます。

3. JS

   • CSSのような同様の、いずれかの新しいJSファイルを作成したり、テーマJSで追加して行きます。 jsで新しいjを作成し、theme.liquidからインクルードする方が良いです。

私はあなたが最初にあなたは物事が一緒に働いているかを知るようになるだろうテーマファイルに精通していることが示唆されました。がんばろう。