分区设定设置叙述色彩搭配
2022-05-19 13:45:37
在线商店作用
您可以应用分区向在线商店的一切网页页面加上作用。您可以挑选、加上和配备包括图片、文字、知名品牌色调等信息的分区。
一些网页页面将具备默认设置分区,例如公示栏、标头和底部。这种分区会在每一个网页页面上显示。
公示栏
您可以应用公示栏从一切页面对您的客户传递重要信息。该分区并没有自身的设定,但您可以自定高达12个不一样的公示块,便于显示重要信息。您可以加上公示栏的连接,使其可点一下并将客户正确引导至特殊网页页面。
公示块
设定叙述 文字要向您的客户显示的公示。 色彩搭配用以公示栏的色彩搭配。 连接您期待客户在点一下公示栏时要导航栏到的连接。标头
标头会显示在在线商店的全部网页上。
分区设定
设置叙述 色彩搭配挑选店铺标头的环境。应用下拉列表在“主题风格色1”、“主题色2”、“背景颜色1”、“背景色2”或“翻转色”中间挑选。 Logo图片分区的图片。点一下 挑选图片以查询文件类型库,或点一下 变更按键以变更或清除图片。 编写取代文字加上简洁明了的叙述以改善SEO,还能为应用屏幕阅读器的客户叙述文件类型。 自定logo总宽logo的宽度。可以是10的一切倍率-从50px到250px。初始值为100px。 台式一体机机器设备上的logo部位当客户在显示屏上查询网址时,logo在标头中显示的部位。logo的位置会全自动对于显示设备开展提升。
正中间居左-将logo与主菜单内联显示,在竖直角度上垂直居中并向左边两端对齐。
左上角-在主菜单上边显示logo,并将logo和下级菜单向左边两端对齐。
顶端垂直居中(默认设置)-在主菜单上边显示logo,并将logo和下级菜单垂直居中两端对齐。
菜单栏要作为主菜单的菜单栏。点一下 变更以挑选别的菜单栏。 显示分割线显示一条线,用以形象化地将标头与网页页面具体内容开展隔开。 开启黏性标头在客户往上翻转时再次显示标头。在客户往下翻转时消退。 间隔在标头下边加上间隔。应用范畴滚轮向下面距加上0px到100px中间的室内空间。底部
页脚会在您模版中的全部网页上显示。
分区设定
设置叙述 色彩搭配可在“注重色1”、“强调色2”、“环境1”、“背景2”或“翻转色”中间挑选底部的背景颜色。 显示电子邮件注册信息内容包括电子邮件注册信息内容表格,客户可应用此表格定阅您的新闻通讯和营销推广信息内容。 文章标题 显示电子邮件注册信息内容表格的文章标题。假如未开启 显示电子邮件注册信息内容,则不容易显示此具体内容。 社交媒体标志显示您在模版设定中导入了个人信息连接的任何社交媒体网站的标志。 开启我国/地域选择符加上一个选择符,供客户挑选您在支付设定中开启的国家和地区,便于客户可以运用她们选定的贷币查询您的产品报价。 开启语言转换器加上一个选择符,供客户挑选您在语言设置中开启的国家和地区,便于客户可以运用她们选定的语言访问您的店铺。 显示支付标志显示店铺中已使用的支付方式的标志。当客户浏览您的店铺时,系统软件会挑选这种标志,便于仅显示可用以现阶段客户的所属区域和常用贷币的支付方式。 间隔在底部上边加上室内空间。应用范畴滚轮向上面距加上0px到100px中间的室内空间。 分区添充向底部的上方或底端加上室内空间。应用范畴滚轮将0px到100px的室内空间加上到底部的上方或底端。菜单栏块
设定叙述 文章标题块的标题。 菜单栏要在块中显示的菜单。文字块
文本块可用以突出显示重要信息,例如店铺详细信息、营销或联络信息内容。
设定叙述 文章标题块的标题。 子文字要在块中显示的文本。图片块
设定叙述 图片要在块中显示的图片。 图片总宽设定图片的总宽。可以是5的一切倍率-从50px到200px。初始值为100px。 比较大显示屏上的图片两端对齐方法两端对齐块中的图片:
左对齐-将图片向块的左边两端对齐。
垂直居中(默认设置)-将图片在块中垂直居中两端对齐。
右对齐-将图片向块的右边两端对齐。
博客文章
假如您的Shopify店铺中有blog,则可以应用博客文章分区突出显示该blog中的文章内容。博客文章分区中的每章博客文章都是会显示文章内容摘抄的前55个词。假如一篇博客文章并没有摘抄,则改成显示这篇文章的前30个词。
分区设定
设置叙述 文章标题分区的标题。 blog要用以显示博客文章的blog。默认设置为您的 blog网页页面上按字母顺序显示的第一个blog。 博客文章要显示在该分区中的博客文章数。最高值:4篇。 色彩搭配blog分区的背景色。可在“注重色1”、“强调色2”、“环境1”、“背景2”或“翻转色”中间挑选。 显示配图图片显示博客文章的配图。提议的图片纵横比:3:2。 显示日期显示博客文章的建立日期。 显示创作者显示博客文章的作者。 假如blog中的博客文章未所有显示,请开启“查看全部”按键假如blog中的博客文章总数超过了 博客文章字段名中安装的值,则会显示“查看全部”按键,该按钮可将客户定项到新浪博客的网页页面。 分区添充将间隔加上到博客文章分区的上方或底端。应用范畴滚轮在博客文章分区上边或下边加上0px到100px中间的室内空间。挑选blog
在模版编辑软件中,点一下博客文章分区的文章标题。
在blog分区中,点一下变更。
挑选blog。
点一下挑选,随后点一下储存
拼贴
您可以建立短视频、图片、商品和系列产品的拼贴。每一个拼贴分区都包括三个块。默认设置状况下,该分区各包括一个视频、商品和系列产品块。
若要建立包括超出三个块的拼贴,请在第一个拼贴分区下边加上别的拼贴分区,而且切勿在靠下的拼贴分区中包括文章标题值。全部拼贴分区将合拼显示为一个分区。
分区设定
设置叙述 文章标题分区的标题。 台式一体机机器设备上的合理布局拼贴新闻媒体在桌面的显示方式。
左边块状(默认设置)-分区中的第一个块显示在左边,且尺寸超过一切别的块。
右边块状-分区中的最后一个块显示在右边,而且比别的全部块都大。
显示设备合理布局块在显示设备上的显示方法。
拼贴-在拼贴合理布局中显示图片:
假如在台式一体机机器设备上的合理布局中开启了左边块状,那麼该分区中的第一个块会显示在顶端,而且比别的全部块都大。
假如在台式一体机机器设备上的合理布局中开启了右边块状,那麼该分区中的最后一个块会显示在底端,而且比别的全部块都大。
列-在一列中显示所有尺寸一致的文件类型。
色彩搭配拼贴的背景色。在“主题风格色1”、“主题色2”、“背景颜色1”、“背景色2”或“翻转色”中间挑选。 分区添充将间隔加上到拼贴分区的上方或底端。应用范畴滚轮将0px到100px的室内空间加上到分区的上方或底端。短视频块
设定叙述 封面图图片客户播放歌曲以前显示的图片。 URL偏向短视频的YouTube或Vimeo连接。短视频务必公布给予。短视频将在弹出广告中播放视频。 短视频取代文字短视频取代文字。为应用屏幕阅读器的客户叙述短视频。 应用初始图片比假如您不愿图片被剪裁,请选择此选择项。商品块
设定叙述 商品要显示的产品。 在悬浮时显示第二张图片在客户将鼠标光标悬浮在商品图片处时,显示第二张商品图象(假如商品有第二张图片)。系列产品块
设定叙述 个人收藏要显示的系列产品。图片块
设定叙述 图片分区的图片。点一下 挑选图片以选择图片,或点一下 变更按键以变更或清除图片。 编写取代文字加上简洁明了的图片叙述以改善SEO,还能为应用屏幕阅读器的客户叙述图片。 应用初始图片比假如您不愿图片被剪裁,请选择此选择项。折叠式具体内容
折叠式具体内容分区适用折叠式或进行以查询在其中具体内容的行,还适用可置放在折叠式具体内容左边或右边的图片。
分区设定
设置叙述 大标题可折叠内容分区的可选择大标题。表明在分区标题上边。 标题可折叠内容分区的标题。 标题两端对齐方法挑选分区标题的两端对齐方法。选择项包括左两端对齐、垂直居中(默认设置)或右两端对齐。 合理布局为可折叠内容挑选合理布局:
无容器(默认设置)
行容器-每一个可折叠行都包括在黑影框中
分区容器-在阴影框中包括全部可折叠内容分区
色彩搭配可折叠内容分区的背景色。可在“注重色1”、“强调色2”、“环境1”、“背景2”或“翻转色”中间挑选。 容器色彩搭配可折叠内容容器的背景颜色。可在“注重色1”、“强调色2”、“环境1”、“背景2”或“翻转色”中间挑选。仅有将 合理布局选择项设定为 行或 分区容器时,选定色彩搭配才由此可见。 开启第一个可折叠行选定后,可折叠内容的第一行将默认设置进行。 图片分区的图片。点一下 挑选图片以选择图片,或点一下 变更按键以变更或清除图片。 编写取代文字加上简洁明了的图片叙述以改善SEO,还能为应用屏幕阅读器的顾客叙述图片。 图片比分区图片的图片比:融入图片(默认设置)-应用图片的纵横比。这可以避免图片被剪裁。
小
大
台式一体机机器设备上的合理布局挑选最先表明图片或是可折叠行。默认为文字优先选择。在显示设备上,自始至终最先表明图片。 分区添充将间隔加上到可折叠内容的上方或底端。应用范畴滚轮在可折叠内容分区上边或下边加上0px到100px中间的室内空间。可折叠行块
设定叙述 标题可折叠行的标题。 标志从下拉框中挑选要在可折叠内容标题以前表明的标志。复选标识标志默认设置处在选定情况。 行内容可折叠行的内容。内容可以恢复出厂设置或包括URL连接。此功用可以与 网页页面中的行内容融合应用。 网页页面中的行内容您可以将别的网页页面的目前内容插进可折叠行。点一下 变更可挑选或删除页面。此功用可以与 行内容融合应用。Shopify商家官方网站全文详细信息:
Onlinestorefeatures
Youcanaddfeaturestoanypageofyouronlinestore,usingsections.Youcanchoose,add,andconfiguresectionswithimages,text,brandcolors,andmore.
Somepageswillhavedefaultsections,suchastheannouncementbar,theheader,andthefooter.Thesesectionsappearoneverypage.
Announcementbar
Theannouncementbarletsyoucommunicateimportantinformationtoyourcustomersfromanypage.Thesectionhasnosettingsonitsown,butyoucancustomizeupto12differentannouncementblockstodisplay.Youcanaddalinktoanannouncementbartomakeitclickableandtakecustomerstoaspecificpage.
Announcementblock
SettingDescription TextTheannouncementthatyouwanttodisplaytoyourcustomers. ColorschemeThecolorschemetousefortheannouncementbar. LinkThelinkthatyouwantcustomerstonavigatetoiftheyclicktheannouncementbar.Header
Theheaderdisplaysonallpagesinyouronlinestore.
Sectionsettings
SettingDescription ColorschemeChoosethebackgroundofyourstoreheader.UsethedropdownmenutoselectbetweenAccent1,Accent2,Background1,Background2,orInverse. LogoimageTheimageforthesection.Click SelectImagetoviewyourmedialibrary,orclickthe Changebuttontochangeorremovetheimage. EditalttextAddabriefdescriptiontoimproveSEOandtodescribethemediaforcustomersusingscreenreaders. CustomlogowidthThewidthofthelogo.Canbeanymultipleof10,from50pxto250px.Thedefaultis100px. DesktoplogopositionWherethelogodisplaysintheheaderwhenacustomerviewsthesiteonalargescreen.Thepositionofthelogoisautomaticallyoptimizedformobile.
Middleleft-Displaysthelogoinlinewiththemainmenu,centeredverticallyandalignedtotheleft.
Topleft-Displaysthelogoabovethemainmenu,andalignsthelogoandmenuitemstotheleft.
Topcenter(default)-Displaysthelogoabovethemainmenu,andalignsthelogoandmenuitemsinthecenter.
MenuThemenutouseasyourmainmenu.Click Changetoselectadifferentmenu. ShowseparatorlineDisplaysalinetovisuallyseparatetheheaderfromthepagescontent. EnablestickyheaderRedisplaystheheaderwhenthecustomerscrollsbackup.Disappearswhenthecustomerscrollsdown. SpacingAddspacingbelowyourheader.Usetherangeslidertoaddbetween0pxand100pxofspacetothebottommargin.Footer
Thefooterdisplaysonallpagesinyourtheme.
Sectionsettings
SettingDescription ColorschemeThebackgroundofthefootercanbeselectedbetweenAccent1,Accent2,Background1,Background2,orInverse. ShowemailsignupIncludesanemailsignupformwherecustomerscansubscribetoyournewsletterandmarketing. HeadingThetitleforthe Showemailsignupform.If Showemailsignupisntenabled,thenthisdoesntdisplay. SocialmediaiconsDisplaysiconsforanysocialmediaplatformsthatyouveenteredaprofilelinkforinyourthemesettings. Enablecountry/regionselectorAddsaselectorwhereacustomercanchoosethecountriesandregionsthatyouveenabledinyourpaymentsettings,sothatcustomerscanviewyourproductpricesinthecurrencyoftheirchoice. EnablelanguageselectorAddsaselectorwhereacustomercanchoosethecountriesandregionsthatyouveenabledinyourlanguagesettings,sothatcustomerscanbrowseyourstoreinthelanguageoftheirchoice. ShowpaymenticonsDisplaystheiconsforpaymentmethodsthatareenabledonyourstore.Whenacustomervisitsyourstore,theseiconsarefilteredsothatonlythepaymentmethodsthataresupportedinthecurrentcustomersregionandcurrencyaredisplayed. SpacingAddspaceaboveyourfooter.Usetherangeslidertoaddbetween0pxand100pxofspacetothetopmargin. SectionpaddingAddspacetothetoporbottomofthefooter.Usetherangeslidertoaddbetween0pxand100pxofspacetothetoporthebottomofyourfooter.Menublock
SettingDescription HeadingThetitlefortheblock. MenuThemenutodisplayintheblock.Textblock
TheTextblockcanbeusedtohighlightimportantinformation,suchasstoredetails,promotions,orcontactinformation.
SettingDescription HeadingThetitlefortheblock. SubtextThetexttodisplayintheblock.Imageblock
SettingDescription ImageTheimagetodisplayintheblock. ImagewidthSetsthewidthoftheimage.Canbeanymultipleof5,from50pxto200px.Defaultis100px. ImagealignmentonlargescreenAlignstheimagewithintheblock:
Left-Alignstheimagetotheleftoftheblock.
Center(default)-Alignstheimagetothecenteroftheblock.
Right-Alignstheimagetotherightoftheblock.
Blogposts
IfyouhaveablogonyourShopifystore,thenyoucanuseaBlogpostsectiontohighlightpostsfromthatblog.EachblogpostintheBlogpostssectionshowsthefirst55wordsofapostsexcerpt.Iftheblogpostdoesnthaveanexcerpt,thenthefirst30wordsofthepostaredisplayedinstead.
Sectionsettings
SettingDescription HeadingThetitleofthesection. BlogWhichblogyouwanttodisplayblogpostsfrom.Defaultstothefirstblogalphabeticallyonyour Blogspage. BlogpostsThenumberofblogpoststhatyouwanttodisplayinthesection.Maximum:4posts. ColorschemeThebackgroundcoloroftheblogsection.ChoosebetweenAccent1,Accent2,Background1,Background2,orInverse. ShowfeaturedimageDisplaysthefeaturedimagefortheblogpost.Suggestedimageaspectratio:3:2. ShowdateDisplaysthedatetheblogpostwascreated. ShowauthorDisplaystheauthorfortheblogpost. EnableViewallbuttonifblogincludesmoreblogpoststhanshownIfthebloghasmoreblogpoststhansetinthe Blogpostfield,thenthisdisplaysaViewallbuttonthattakesthecustomerstotheblogspage. SectionpaddingAddspacingtothetoporbottomoftheblogpostsection.Usetherangeslidertoaddbetween0pxand100pxofspaceaboveorbelowtheblogpostsection.Selectablog
Inyourthemeeditor,clickthetitleoftheblogpostssection.
IntheBlogsection,clickChange.
Selecttheblog.
ClickSelect,andthenclickSave
Collage
Youcancreateacollageofvideos,images,products,andcollections.EachCollagesectioncontainsthreeblocks.Bydefault,thesectioncontainsavideo,product,andcollectionblock.
Tocreateacollageofmorethanthreeblocks,addadditionalcollagesectionsbelowthefirstanddontincludeaHeadingvaluetothelowercollagesections.Thecollagesectionswillappeartoflowtogetherasasinglesection.
Sectionsettings
SettingDescription HeadingThetitleofthesection. DesktoplayoutHowthecollagemediadisplaysondesktop.
Leftlargeblock(default)-Thefirstblockinthesectiondisplaysontheleftandlargerthananyotherblocks.
Rightlargeblock-Thelastblockinthesectiondisplaysontherightandlargerthananyotherblock.
MobilelayoutHowtheblocksdisplayonmobile.
Collage-Displaystheimagesinacollagelayout:
IfLeftlargeblockisenabledinDesktoplayout,thenthefirstblockinthesectiondisplaysonthetopandlargerthananyotherblock.
IfRightlargeblockisenabledinDesktoplayout,thenthelastblockinthesectiondisplaysonthebottomandlargerthananyotherblock.
Column-Displaysallmediathesamesizeandinacolumn.
ColorschemeThebackgroundcolorofthecollage.ChoosebetweenAccent1,Accent2,Background1,Background2,orInverse. SectionpaddingAddspacingtothetoporbottomofthecollagesection.Usetherangeslidertoaddbetween0pxand100pxofspacetothetoporthebottomofthesection.Videoblock
SettingDescription CoverimageTheimagethatdisplaysbeforeacustomerplaysthevideo. URLTheYouTubeorVimeolinktothevideo.Thevideomustbepubliclyavailable.Thevideowillplayinapop-upwindow. VideoalttextThealttextforthevideo.Describesthevideoforcustomersusingscreenreaders. UseoriginalimageratioSelectthisoptionifyoudontwantyourimagetobecropped.Productblock
SettingDescription ProductTheproductthatyouwanttodisplay. ShowsecondimageonhoverWhenacustomerhoverstheircursorovertheproductimage,displaysthesecondproductimageiftheproducthasone.Collectionblock
SettingDescription CollectionThecollectionthatyouwanttodisplay.Imageblock
SettingDescription ImageTheimageforthesection.Click SelectImagetochooseanimage,orclickthe Changebuttontochangeorremovetheimage. EditalttextAddabriefimagedescriptiontoimproveSEOandtodescribetheimageforcustomersusingscreenreaders. UseoriginalimageratioSelectthisoptionifyoudontwantyourimagetobecropped.Collapsiblecontent
Thecollapsiblecontentsectionsupportsrowsthatcanbecollapsedorexpandedtoviewthecontentwithin,andanimagethatcanbeplacedtotheleftortherightofthecollapsiblecontent.
Sectionsettings
SettingDescription CaptionAnoptionalcaptionforthecollapsiblecontentsection.Displaysabovethesectionheading. HeadingTheheadingofthecollapsiblecontentsection. HeadingalignmentChoosethealignmentofthesectionheading.Optionsareleft,center(default),orright. LayoutSelectalayoutforyourcollapsiblecontent:
Nocontainer(default)
Rowcontainer-Eachcollapsiblerowiscontainedinashadedbox
Sectioncontainer-Containstheentirecollapsiblecontentsectioninashadedbox
ColorschemeThebackgroundcolorofthecollapsiblecontentsection.ChoosebetweenAccent1,Accent2,Background1,Background2,orInverse. ContainercolorschemeThebackgroundcolorofthecollapsiblecontentcontainer.ChoosebetweenAccent1,Accent2,Background1,Background2,orInverse.Thecolorschemeselectedisvisibleonlywhenthe Layoutoptionissetto Rowor Sectioncontainer. OpenfirstcollapsiblerowWhenchecked,thefirstrowofyourcollapsiblecontentwillbeexpandedbydefault. ImageTheimageforthesection.Click SelectImagetochooseanimage,orclickthe Changebuttontochangeorremovetheimage. EditalttextAddabriefimagedescriptiontoimproveSEOandtodescribetheimageforcustomersusingscreenreaders. ImageratioTheimageratioforthesectionimage:Adapttoimage(default)-Usestheaspectratiooftheimages.Thispreventstheimagesfrombeingcropped.
Small
Large
DesktoplayoutChoosewhethertheimageorthecollapsiblerowsappearfirst.Defaultsettingistextfirst.Onmobile,theimagealwaysappearsfirst. SectionpaddingAddspacingtothetoporbottomofthecollapsiblecontent.Usetherangeslidertoaddbetween0pxand100pxofspaceaboveorbelowthecollapsiblecontentsection.Collapsiblerowblock
SettingDescription HeadingAheadingforthecollapsiblerow. IconChooseaniconfromthedrop-downlisttodisplayinfrontofthecollapsiblecontentheading.Thecheckmarkiconisselectedbydefault. RowcontentContentforthecollapsiblerow.ContentcanbeformattedorincludeURLlinks.Thisfeaturecanbeusedinconjunctionwith Rowcontentfrompage. RowcontentfrompageYoucaninsertexistingcontentfromanotherpageintoacollapsiblerow.Click Changetoselectorremoveapage.Thisfeaturecanbeusedinconjunctionwith Rowcontent.
文章内容由来:Shopify商户官方网站
部分文章来源于网络,如有侵权,请联系 caihong@youzan.com 删除。