Shopify Minimog主题如何实现在导航菜单项右上角上增加🔥✨Hot-Sale等图标效果?
想实现的导航菜单右上角图标效果下:
非常简单,步骤如下:
1.打开“Shopify后台”-》“内容”-》“菜单”-》“Main Menu”;
2.选择你要修改或增加的菜单项,比如”New Arrival”,将原来的文本”New Arrival”改成Html代码:New Arrival<span class=”menuitem-c-icon”>✨</span>
3.打开“在线商店”-》“模板”-》选择当前主题模板-》“自定义”,进入主题自定义界面;
4.在“主题自定义”界面左上角选择“设置图标”-》选择“自定义CSS”,为上面添加的菜单项图标<span>元素增加css效果和定位,如下:
.menuitem-c-icon {
color: red;
position: absolute;
top: -0.2em;
right: -0.2em;
font-size: 1.3em;/*放大图标*/
}
5.保存,刷新前台页面就看到我们想要的效果了
editor's pick
latest video
news via inbox
Nulla turp dis cursus. Integer liberos euismod pretium faucibua