Shopify作为建站工具，它确实能够让我们非常便捷的建立网站并实现网站的各种功能。但是这样的便捷也牺牲了一定的可自定义的空间。通俗的说，Shopify把各个功能都模块化了，对于一些高级用户来说，如果它需要一些特殊的功能，想修改代码的话，就比较麻烦了。
在本小节中，我们以“去除详情页面上的社会化媒体分享按钮”为例。学习在Shopify的框架内的一些基本常用的前台的HTML代码和CSS代码的修改。
第一步：在左侧工具栏的“Online Store”中选择“Themes”
第二步：在action里面找到“Edit code”，点击进入。
在这里我们能够看到各种页面的前台的HTML代码
第三步：假如我们要看一种页面类型的HTML代码，我们只需要点击这个页面模板的名称即可。
这里我们以page（也就是Shopify里面的静态页面模板）为例，我们点击page.liquid进入。
接下来我们大致了解下这些HTML代码，
<h1 class=”tu mb__10 cw”>{{ page.title }}</h1>
这段代码的意思是静态页面所有的title都被设置为了H1标签。
<li class=”fl home”><a href=”/” title=”{{ ‘general.breadcrumbs.home’ | t }}”>
{{ ‘general.breadcrumbs.home’ | t }}</a></li>
这段代码的意思是页面上显示面包屑导航。
这里不详细说，我们只是对Shopify的页面模板，也就是liquid以及HTML代码有个初步了解。有进一步想了解代码的朋友们可以咨询网站小哥（QQ：3298600936）。
第四步：我们进入product.liquid，也就是产品页面模板，去除产品页面上的社会化媒体分享按钮。
为了快速定位社会化分享媒体按钮的位置，我们查找下“share”这个字，能够发现如下代码：
{%- if settings.show_share_btn and settings.share_type == ‘1’ -%}
{%- assign gl_follow_social = false -%}
{%- elsif settings.show_share_btn and settings.share_type == ‘2’ -%}
{%- assign gl_follow_social = true -%}
这段代码就是关于社会化媒体分享按钮的，如果你实在不想要这些按钮，就删除这段代码就好了。
如果你安装了不同的Theme的话，会对你的代码产生不同程度的改动。你在修改代码的时候就更应该小心谨慎。本节只是为了让有一定HTML和CSS基础的同学指导应该在哪里如何自定义一些HTML和CSS，千万不要自己不懂的情况下乱改，以免网站出问题。
关于Shopify基础建站教程，小编近期将不断推送，大家敬请期待！在建站过程中，有任何疑问都可以联系网站小哥（QQ：3298600936）！
你是否在为以下问题而烦恼：
如何建立独立站？
独立站如何选品？
如何解决独立站没访客没销量？
如何通过Google、Facebook等渠道获取流量？
如何进行红人营销？
ES电商学院针对大家的疑惑现推出《独立站实操课程》线下培训，
以实战打法为教学内容，以效果导向为课程目标，通过课程实操讲解亲授获取独立站流量的打法和技巧。
点击下图了解更多哦
Shopify基础建站教程 | 2.6 设置导航栏
Shopify基础建站教程 | 2.5 添加静态页面
Shopify基础建站教程 | 2.4 设置产品集合（Collections）
扫码关注获得更多跨境电商资讯！
