如何将代码添加到shopify页面

Question

如何在不破坏现有主题的情况下，在shopify商店中的多个shopify页面中只添加以下https://codepen.io/fjenpen/pen/pROPov之类的代码？

<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

导航至Online Store > theme & edit HTML/CSS of current active theme 从您链接的笔中，您需要添加HTML，CSS＆amp; JS。

1. HTML

   • for html查看所需的区域液体模板，您可以添加HTML。您可能想要创建片段并包含。使用语言翻译而不是裸文本。

2. CSS

   • 寻找主题css文件，它通常是＆＃39; xxxxx.scss.css`文件。您可以在那里添加css部分或创建另一个css文件，并包含在theme.liquid模板中。

3. JS

   • 与CSS类似，要么创建一个新的js文件，要么添加主题js。使用js，最好创建新的js并包含来自theme.liquid。

我建议您首先熟悉主题文件，然后您将了解事情是如何协同工作的。祝你好运。