FROM CACHE - en_header
Shopify Design
Shopify themes, liquid, logos, and UX
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
- Shopify Community
- :
- Shopify Discussion
- :
- Shopify Design
- :
- How to create presets(theme styles) for shopify theme?
Options
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Mute
- Printer Friendly Page
How to create presets(theme styles) for shopify theme?
How to create presets(theme styles) for shopify theme?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-18-2022
03:23 AM
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": "info@collector.com"
}
},
"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": "info@collector.com"
}
},
"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?
Replies 2 (2)
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-18-2022
06:26 AM
Hii,
example
{% schema %}
{
"name": "home-service",
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "default Section"
}
],
"blocks": [
{
"type": "service_image",
"name": "service",
"settings": [
{
"type": "image_picker",
"id": "image",
"label": "Image"
},
{
"type": "text",
"id": "service-title",
"label": "service-title",
"info": "Optional"
},
{
"type": "text",
"id": "service-subtitle",
"label": "service-subtitle",
"info": "Optional"
},
{
"id": "linktext",
"type": "text",
"label": "Button text",
"default": "Click Here"
},
{
"type": "url",
"id": "link",
"label": "Link",
"info": "Optional"
}
]
}
],
"presets": [
{
"name": "home-service",
"category": "Image",
"blocks": [
{
"type": "service_image"
},
{
"type": "service_image"
},
{
"type": "service_image"
} ]
}
]
}
{% endschema %}
please check this code,this type create preset
Hire us | Pass Core Web Vital | B2B Wholesale Experts | Claim Your Free Website Review |
Connect with Us: WhatsApp | Skype: oscprofessionals-87 | Email: pallavi@oscprofessionals.com |
Custom Shopify Solutions — Private Apps, Theme Customization & SEO | Digital Marketing |
OSCP Apps: Discount Suite | Wholesale App | Bundle & Upsell | Shipping Discount | and more...
Connect with Us: WhatsApp | Skype: oscprofessionals-87 | Email: pallavi@oscprofessionals.com |
Custom Shopify Solutions — Private Apps, Theme Customization & SEO | Digital Marketing |
OSCP Apps: Discount Suite | Wholesale App | Bundle & Upsell | Shipping Discount | and more...
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-18-2022
06:32 AM
@oscprofessional this is related to section and its schema and not theme styles...
i'm taking about this setting which is in theme settings -> theme styles
here's the screenshot
this is for now just changing the theme general settings according to styles and not changing the section setting's color
