当前位置： 文江博客话题详情

如何为Shopify主题创建预设（主题样式）？

发布于 2025-02-07 14:48:01 字数 10562 浏览 2 评论 0原文

我通过使用DAWN作为参考主题来创建自定义主题。我想创建2个预设，以更改标头，页脚，公告栏，移动纳维尔栏，部分和一般设置的所有默认颜色。 现在，我通过在settings_data.json中设置预设名称和常规设置变量来更改一般设置的颜色，但似乎无法弄清楚如何更改截面颜色。在那里尝试了很多东西，但没有用。这是我的代码

 {
  "current": "Beige",
  "presets": {
    "Beige": {
      "placeholder_color": "#F8E6DA",
      "pagination_tab_bg_color": "#FFF8F2",
      "pagination_number_color": "#000000",
      "pagination_current_page_color": "#F8E6DA",
      "pagination_arrow_tab_color": "#F8E6DA",
      "button_hover": "#EFF6FF",
      "customer_pages_bg_colors": "#ffffff",
      "container_bg_color": "#FFF8F2",
      "border_color": "#F8E6DA",
      "primary_button_color": "#000000",
      "predictive_search_bg_color": "#F8E6DA",
      "predictive_search_button_color": "#FABF9D",
      "predictive_search_button_text_color": "#000000",
      "cart_notify_bg_color": "#FFF8F2",
      "cart_notify_border_color": "#F8E6DA",
      "cart_notify_primary_button_color": "#FABF9D",
      "cart_notify_primary_button_text_color": "#000000",
      "cart_notify_secondary_button_color": "#000000",
      "cart_count_bubble_color": "#303036",
      "gift_card_bg_color": "linear-gradient(#FFF1E8, #EFD1B8)",
      "gift_card_badge_color": "#F8E6DA",
      "gift_card_badge_text_color": "#000000",
      "gift_card_primary_button_color": "#fabf9d",
      "gift_card_secondary_button_color": "#000000",
      "sections": {
        "announcement-bar": {
          "type": "announcement-bar",
          "blocks": {
            "announcement-bar-0": {
              "type": "announcement",
              "settings": {
                "show_announce_home_page": false,
                "text": "Welcome to our store",
                "announce_font_size": 15,
                "announce_text_align": "center",
                "announce_bold": false,
                "link": "",
                "announce_text_color": "#E22120",
                "announce_bg_color": "#ffffff"
              }
            }
          },
          "block_order": [
            "announcement-bar-0"
          ],
          "settings": {
          }
        },
        "mobile-navigation": {
          "type": "mobile-navigation",
          "settings": {
            "nav-menu": "main-menu",
            "mobile_nav_text_color": "#000000",
            "icon_color": "#000000",
            "border_bottom": "#f8e6da",
            "mobile_nav_bg_color": "#ffffff"
          }
        },
        "header": {
          "type": "header",
          "settings": {
            "logo_width": 100,
            "menu": "main-menu",
            "enable_sticky_header": true,
            "show_search_box": true,
            "enable_predictive_search": true,
            "header_text_color": "#000000",
            "icon_color": "#000000",
            "header_bg_color": "#f8e6da",
            "dropdown_hover_color": "#ebd3c3",
            "dropdown_hover_text_color": "#000000"
          }
        },
        "footer": {
          "type": "footer",
          "blocks": {
            "footer-0": {
              "type": "text",
              "settings": {
                "address": "<p>(218) 463-0260 36979 300th St<br\/>Roseau, Minnesota(MN), 56751<\/p>",
                "contact": "<p>+1 (234) 567-89-90 <br\/>+1 (234) 567-89-90<\/p>",
                "email": "[email protected]"
              }
            },
            "footer-1": {
              "type": "menu",
              "settings": {
                "menu_heading": "Links",
                "menu": "footer",
                "menu_collapse": true
              }
            },
            "88236e16-1b6c-438e-8543-f6fe494e04fb": {
              "type": "menu",
              "settings": {
                "menu_heading": "Quick Links",
                "menu": "footer-menu2",
                "menu_collapse": true
              }
            },
            "footer-2": {
              "type": "info",
              "settings": {
                "additional_info": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis risus mi. Ut placerat quam lectus. Curabitur dictum velit non lacus<\/p>"
              }
            },
            "footer-3": {
              "type": "newsletter",
              "settings": {
                "newsletter_heading": "Subscribe to our emails",
                "newsletter_btn_text": "Sign Up",
                "newsletter_caption": "Phasellus dignissim, tellus in pellentesque mollis, mauris",
                "newsletter_btn_color": "#fabf9d",
                "newsletter_btn_text_color": "#000000"
              }
            }
          },
          "block_order": [
            "footer-0",
            "footer-1",
            "88236e16-1b6c-438e-8543-f6fe494e04fb",
            "footer-2",
            "footer-3"
          ],
          "settings": {
            "footer_logo_width": 100,
            "footer_top_bg_color": "#f8e6da",
            "footer_top_text_color": "#000000",
            "footer_bottom_bg_color": "#303036",
            "footer_bottom_text_color": "#ffffff",
            "show_social": true,
            "payment_enable": true
          }
        }
      },
      "content_for_index": [
  
      ] 
    },
    "Electronic": {
      "placeholder_color": "#7DABE0",
      "pagination_tab_bg_color": "#F8FBFF",
      "pagination_current_page_color": "#EFF6FF",
      "pagination_arrow_tab_color": "#EFF6FF",
      "button_hover": "#EBD3C3",
      "customer_pages_bg_colors": "#FCFEFF",
      "container_bg_color": "#EFF6FF",
      "border_color": "#134074",
      "primary_button_color": "#E0691E",
      "predictive_search_bg_color": "#C6D8ED",
      "predictive_search_button_color": "#E0691E",
      "predictive_search_button_text_color": "#ffffff",
      "cart_notify_bg_color": "#EFF6FF",
      "cart_notify_border_color": "#134074",
      "cart_notify_primary_button_color": "#ED6F1E",
      "cart_notify_primary_button_text_color": "#ffffff",
      "cart_notify_secondary_button_color": "#134074",
      "cart_count_bubble_color": "#ED6F1E",
      "gift_card_bg_color": "linear-gradient(#EFF6FF, #7DABE0)",
      "gift_card_badge_color": "#000000",
      "gift_card_badge_text_color": "#ffffff",
      "gift_card_primary_button_color": "#ED6F1E",
      "gift_card_primary_text_button_color": "#ffffff",
      "gift_card_secondary_button_color": "#134074",
      "sections": {
        "announcement-bar": {
          "type": "announcement-bar",
          "blocks": {
            "announcement-bar-0": {
              "type": "announcement",
              "settings": {
                "show_announce_home_page": false,
                "text": "Welcome to our store",
                "announce_font_size": 15,
                "announce_text_align": "center",
                "announce_bold": false,
                "link": "",
                "announce_text_color": "#E22120",
                "announce_bg_color": "#ffffcf"
              }
            }
          },
          "block_order": [
            "announcement-bar-0"
          ],
          "settings": {
          }
        },
        "mobile-navigation": {
          "type": "mobile-navigation",
          "settings": {
            "nav-menu": "main-menu",
            "mobile_nav_text_color": "#000000",
            "icon_color": "#000000",
            "border_bottom": "#f8e6da",
            "mobile_nav_bg_color": "#fff7f2"
          }
        },
        "header": {
          "type": "header",
          "settings": {
            "logo_width": 100,
            "menu": "main-menu",
            "enable_sticky_header": true,
            "show_search_box": true,
            "enable_predictive_search": true,
            "header_text_color": "#000000",
            "icon_color": "#000000",
            "header_bg_color": "#f8e6da",
            "dropdown_hover_color": "#ebd3c3",
            "dropdown_hover_text_color": "#000000"
          }
        },
        "footer": {
          "type": "footer",
          "blocks": {
            "footer-0": {
              "type": "text",
              "settings": {
                "address": "<p>(218) 463-0260 36979 300th St<br\/>Roseau, Minnesota(MN), 56751<\/p>",
                "contact": "<p>+1 (234) 567-89-90 <br\/>+1 (234) 567-89-90<\/p>",
                "email": "[email protected]"
              }
            },
            "footer-1": {
              "type": "menu",
              "settings": {
                "menu_heading": "Links",
                "menu": "footer",
                "menu_collapse": true
              }
            },
            "88236e16-1b6c-438e-8543-f6fe494e04fb": {
              "type": "menu",
              "settings": {
                "menu_heading": "Quick Links",
                "menu": "footer-menu2",
                "menu_collapse": true
              }
            },
            "footer-2": {
              "type": "info",
              "settings": {
                "additional_info": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis risus mi. Ut placerat quam lectus. Curabitur dictum velit non lacus<\/p>"
              }
            },
            "footer-3": {
              "type": "newsletter",
              "settings": {
                "newsletter_heading": "Subscribe to our emails",
                "newsletter_btn_text": "Sign Up",
                "newsletter_caption": "Phasellus dignissim, tellus in pellentesque mollis, mauris",
                "newsletter_btn_color": "#fabf9d",
                "newsletter_btn_text_color": "#000000"
              }
            }
          },
          "block_order": [
            "footer-0",
            "footer-1",
            "88236e16-1b6c-438e-8543-f6fe494e04fb",
            "footer-2",
            "footer-3"
          ],
          "settings": {
            "footer_logo_width": 100,
            "footer_top_bg_color": "#f8e6da",
            "footer_top_text_color": "#000000",
            "footer_bottom_bg_color": "#303036",
            "footer_bottom_text_color": "#ffffff",
            "show_social": true,
            "payment_enable": true
          }
        }
      },
      "content_for_index": [
  
      ]
    }
  }
}

一般设置变量可与样式变化一起使用，但其他诸如公告栏，移动设备，标题，页脚不起作用。我的索引文件以JSON格式使用。 我们可以做任何解决此问题的事情吗？

原文

I'm creating a custom theme by using dawn as reference theme. I want to create 2 presets which changes all the default colors of my header, footer, announcement bar, mobile navbar, sections and the general settings.
Now i managed to change the colors of the general settings by setting the preset name and general setting variables in settings_data.json but can't seem to figure out how to change section colors. Tried alot of stuff there but it didn't work. Here's my code

 {
  "current": "Beige",
  "presets": {
    "Beige": {
      "placeholder_color": "#F8E6DA",
      "pagination_tab_bg_color": "#FFF8F2",
      "pagination_number_color": "#000000",
      "pagination_current_page_color": "#F8E6DA",
      "pagination_arrow_tab_color": "#F8E6DA",
      "button_hover": "#EFF6FF",
      "customer_pages_bg_colors": "#ffffff",
      "container_bg_color": "#FFF8F2",
      "border_color": "#F8E6DA",
      "primary_button_color": "#000000",
      "predictive_search_bg_color": "#F8E6DA",
      "predictive_search_button_color": "#FABF9D",
      "predictive_search_button_text_color": "#000000",
      "cart_notify_bg_color": "#FFF8F2",
      "cart_notify_border_color": "#F8E6DA",
      "cart_notify_primary_button_color": "#FABF9D",
      "cart_notify_primary_button_text_color": "#000000",
      "cart_notify_secondary_button_color": "#000000",
      "cart_count_bubble_color": "#303036",
      "gift_card_bg_color": "linear-gradient(#FFF1E8, #EFD1B8)",
      "gift_card_badge_color": "#F8E6DA",
      "gift_card_badge_text_color": "#000000",
      "gift_card_primary_button_color": "#fabf9d",
      "gift_card_secondary_button_color": "#000000",
      "sections": {
        "announcement-bar": {
          "type": "announcement-bar",
          "blocks": {
            "announcement-bar-0": {
              "type": "announcement",
              "settings": {
                "show_announce_home_page": false,
                "text": "Welcome to our store",
                "announce_font_size": 15,
                "announce_text_align": "center",
                "announce_bold": false,
                "link": "",
                "announce_text_color": "#E22120",
                "announce_bg_color": "#ffffff"
              }
            }
          },
          "block_order": [
            "announcement-bar-0"
          ],
          "settings": {
          }
        },
        "mobile-navigation": {
          "type": "mobile-navigation",
          "settings": {
            "nav-menu": "main-menu",
            "mobile_nav_text_color": "#000000",
            "icon_color": "#000000",
            "border_bottom": "#f8e6da",
            "mobile_nav_bg_color": "#ffffff"
          }
        },
        "header": {
          "type": "header",
          "settings": {
            "logo_width": 100,
            "menu": "main-menu",
            "enable_sticky_header": true,
            "show_search_box": true,
            "enable_predictive_search": true,
            "header_text_color": "#000000",
            "icon_color": "#000000",
            "header_bg_color": "#f8e6da",
            "dropdown_hover_color": "#ebd3c3",
            "dropdown_hover_text_color": "#000000"
          }
        },
        "footer": {
          "type": "footer",
          "blocks": {
            "footer-0": {
              "type": "text",
              "settings": {
                "address": "<p>(218) 463-0260 36979 300th St<br\/>Roseau, Minnesota(MN), 56751<\/p>",
                "contact": "<p>+1 (234) 567-89-90 <br\/>+1 (234) 567-89-90<\/p>",
                "email": "[email protected]"
              }
            },
            "footer-1": {
              "type": "menu",
              "settings": {
                "menu_heading": "Links",
                "menu": "footer",
                "menu_collapse": true
              }
            },
            "88236e16-1b6c-438e-8543-f6fe494e04fb": {
              "type": "menu",
              "settings": {
                "menu_heading": "Quick Links",
                "menu": "footer-menu2",
                "menu_collapse": true
              }
            },
            "footer-2": {
              "type": "info",
              "settings": {
                "additional_info": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis risus mi. Ut placerat quam lectus. Curabitur dictum velit non lacus<\/p>"
              }
            },
            "footer-3": {
              "type": "newsletter",
              "settings": {
                "newsletter_heading": "Subscribe to our emails",
                "newsletter_btn_text": "Sign Up",
                "newsletter_caption": "Phasellus dignissim, tellus in pellentesque mollis, mauris",
                "newsletter_btn_color": "#fabf9d",
                "newsletter_btn_text_color": "#000000"
              }
            }
          },
          "block_order": [
            "footer-0",
            "footer-1",
            "88236e16-1b6c-438e-8543-f6fe494e04fb",
            "footer-2",
            "footer-3"
          ],
          "settings": {
            "footer_logo_width": 100,
            "footer_top_bg_color": "#f8e6da",
            "footer_top_text_color": "#000000",
            "footer_bottom_bg_color": "#303036",
            "footer_bottom_text_color": "#ffffff",
            "show_social": true,
            "payment_enable": true
          }
        }
      },
      "content_for_index": [
  
      ] 
    },
    "Electronic": {
      "placeholder_color": "#7DABE0",
      "pagination_tab_bg_color": "#F8FBFF",
      "pagination_current_page_color": "#EFF6FF",
      "pagination_arrow_tab_color": "#EFF6FF",
      "button_hover": "#EBD3C3",
      "customer_pages_bg_colors": "#FCFEFF",
      "container_bg_color": "#EFF6FF",
      "border_color": "#134074",
      "primary_button_color": "#E0691E",
      "predictive_search_bg_color": "#C6D8ED",
      "predictive_search_button_color": "#E0691E",
      "predictive_search_button_text_color": "#ffffff",
      "cart_notify_bg_color": "#EFF6FF",
      "cart_notify_border_color": "#134074",
      "cart_notify_primary_button_color": "#ED6F1E",
      "cart_notify_primary_button_text_color": "#ffffff",
      "cart_notify_secondary_button_color": "#134074",
      "cart_count_bubble_color": "#ED6F1E",
      "gift_card_bg_color": "linear-gradient(#EFF6FF, #7DABE0)",
      "gift_card_badge_color": "#000000",
      "gift_card_badge_text_color": "#ffffff",
      "gift_card_primary_button_color": "#ED6F1E",
      "gift_card_primary_text_button_color": "#ffffff",
      "gift_card_secondary_button_color": "#134074",
      "sections": {
        "announcement-bar": {
          "type": "announcement-bar",
          "blocks": {
            "announcement-bar-0": {
              "type": "announcement",
              "settings": {
                "show_announce_home_page": false,
                "text": "Welcome to our store",
                "announce_font_size": 15,
                "announce_text_align": "center",
                "announce_bold": false,
                "link": "",
                "announce_text_color": "#E22120",
                "announce_bg_color": "#ffffcf"
              }
            }
          },
          "block_order": [
            "announcement-bar-0"
          ],
          "settings": {
          }
        },
        "mobile-navigation": {
          "type": "mobile-navigation",
          "settings": {
            "nav-menu": "main-menu",
            "mobile_nav_text_color": "#000000",
            "icon_color": "#000000",
            "border_bottom": "#f8e6da",
            "mobile_nav_bg_color": "#fff7f2"
          }
        },
        "header": {
          "type": "header",
          "settings": {
            "logo_width": 100,
            "menu": "main-menu",
            "enable_sticky_header": true,
            "show_search_box": true,
            "enable_predictive_search": true,
            "header_text_color": "#000000",
            "icon_color": "#000000",
            "header_bg_color": "#f8e6da",
            "dropdown_hover_color": "#ebd3c3",
            "dropdown_hover_text_color": "#000000"
          }
        },
        "footer": {
          "type": "footer",
          "blocks": {
            "footer-0": {
              "type": "text",
              "settings": {
                "address": "<p>(218) 463-0260 36979 300th St<br\/>Roseau, Minnesota(MN), 56751<\/p>",
                "contact": "<p>+1 (234) 567-89-90 <br\/>+1 (234) 567-89-90<\/p>",
                "email": "[email protected]"
              }
            },
            "footer-1": {
              "type": "menu",
              "settings": {
                "menu_heading": "Links",
                "menu": "footer",
                "menu_collapse": true
              }
            },
            "88236e16-1b6c-438e-8543-f6fe494e04fb": {
              "type": "menu",
              "settings": {
                "menu_heading": "Quick Links",
                "menu": "footer-menu2",
                "menu_collapse": true
              }
            },
            "footer-2": {
              "type": "info",
              "settings": {
                "additional_info": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis risus mi. Ut placerat quam lectus. Curabitur dictum velit non lacus<\/p>"
              }
            },
            "footer-3": {
              "type": "newsletter",
              "settings": {
                "newsletter_heading": "Subscribe to our emails",
                "newsletter_btn_text": "Sign Up",
                "newsletter_caption": "Phasellus dignissim, tellus in pellentesque mollis, mauris",
                "newsletter_btn_color": "#fabf9d",
                "newsletter_btn_text_color": "#000000"
              }
            }
          },
          "block_order": [
            "footer-0",
            "footer-1",
            "88236e16-1b6c-438e-8543-f6fe494e04fb",
            "footer-2",
            "footer-3"
          ],
          "settings": {
            "footer_logo_width": 100,
            "footer_top_bg_color": "#f8e6da",
            "footer_top_text_color": "#000000",
            "footer_bottom_bg_color": "#303036",
            "footer_bottom_text_color": "#ffffff",
            "show_social": true,
            "payment_enable": true
          }
        }
      },
      "content_for_index": [
  
      ]
    }
  }
}

The general settings variables work with the change in style but others like announcement bar, mobile-nav, header, footer doesn't work.. my index file is in json format.
Is anything here we can do to fix this problem?

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。

评论（1）

陈独秀 2025-02-14 14:48:01

不幸的是，Shopify预设只是一般设置预设，例如，如果您的各节中的颜色创建两个预设的唯一方法是创建两个不同的部分预设，则此解决方案在主题编辑器中的部分选择器中创建两个部分，用于同一部分。这就是为什么不建议将颜色添加到各部分并使用配色架构的原因。 （就像黎明一样）

Unfortunately, Shopify presets are just general settings presets, if, for example, you have colors in your sections the only way to create two presets is two create two different sections presets, this solution creates two sections in the section selector in the theme editor for the same section. That's why it's not recommended to add colors to sections and use color schemas instead. (just like in Dawn)

回复 原文
~没有更多了~

关于作者

独行侠

暂无简介

文章
评论
27 人气
发私信

相关话题

更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

夢野间

文章 0 评论 0

百度③文鱼

文章 0 评论 0

小草泠泠

文章 0 评论 0

zhuwenyan

文章 0 评论 0

weirdo

文章 0 评论 0

坚持沉默

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文