Shopify themes, liquid, logos, and UX
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:
cdn.shopify.com/s/files/1/0605/1069/9751/files/catupleft_1500x.png?v=1634468695
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024