I’m about to modify the code for the Dawn theme and would like advice on the correct approach.
Link to quickly drafted preview site: Charlie The Vet (charlie-the-vet.myshopify.com)
Mockup of the design I want to create:
PROBLEMS WITH PREVIEW SITE
section: header
main menu font size is wrong
section: image banner
banner image section won’t work with my design.
need css rules to load different html/css for different screen widths
need way to upload multiple images to load for those different widths.
section: image-with-text
cat image stretched half page width
need new HTML/CSS
section: featured product
product image stretched
where can I find correct product image dimensions?
global
font is wrong font
need to upload a new font to be used site-wide (think I know how to do this)
QUESTIONS
If I create a new liquid section in the code editor (e.g image-banner-mycustomsite.liquid) how do I make that section appear in the theme editor, so I can add it to a page?
How can I edit the settings that appear in the theme editor for that new section?
(e.g. for ‘image-banner-mycustomsite.liquid’ I would want to be able to upload 4 or more images, not 2).
Is there a way to upload images that can be used globally rather than within a specific section?
Where I’m creating new .css rules, presumably I should create a new .css file in the assets folder, rather than modify an existing one.
How do I make sure it is included on page load?
Where can I find documentation section.settings used in liquid templates e.g this line
"{{ section.settings.image | img_url: ‘1500x’ }}
outputs a path to image with 1500 appended:
