First-time setup

What you will build

Your header will show your logo and two menu links, Shop and About us. Your homepage will have a real product section called Everyday essentials. Add larger menus, more sections, and product-specific content afterwards as needed.

First follow Before you start to prepare Store main menu, Everyday essentials, and three products. Replace these example names with existing resources if you prefer.

Open the correct theme and template

1. In Online Store → Themes, find Pawglade and click Edit theme. Some interfaces still say Customize; both open the theme editor.
2. Check the theme name at the top to confirm you are editing the intended theme. Save or preserve any existing unsaved changes before starting.
3. Choose Home page in the top template selector and switch the sidebar to Sections. Theme settings controls shared settings; it is not where homepage content blocks live.

The starting page, content included when adding a section, and saved demo-store configuration can differ. Find items by their function names below, rather than their position in the list.

Step 1: Connect the header menu and logo

1. In Header group, click Header.
2. Select or upload your Logo, then adjust Logo width using the preview. You can use your actual store name until an image is ready.
3. Find Menu. If empty, open its selector. If a menu is already selected, click it and choose Replace. Select Store main menu, return to the settings, and check the menu name.
4. Check Show header button. To use the button, replace Header button label and select a real destination for Link. Otherwise, turn it off.
5. Click Save. Open the wider preview and click Shop and About us to confirm that they reach the collection and page, then return home.

Header’s Menu controls the top navigation. Content blocks inside larger menus can have their own Menu selections. Panels match top-level items by name or link, rather than their sidebar position. Follow the full Header guide when you are ready for image-rich menus.

Step 2: Replace the starting homepage content

Open each existing homepage section and check its heading, images, button destinations, and resource selections. Visible text does not mean a product or collection has been selected. Replace demo people, store names, descriptions, size data, and promotional wording with content that matches your store.

1. Find and click Featured collection. If absent, use Add section → Featured collection in the homepage template area, outside Header group and Footer group.
2. Enter Everyday essentials in Heading.
3. Select your prepared Everyday essentials in Collection. Replace any previous selection and check the collection name when you return.
4. Set Number of products to show = 4, Columns on desktop = 3, Product image ratio = Square (1:1), Card background tint = Cycle through all tints, and Top float offset = 0 px. Keep Show “View all” link on.
5. Save. The preview should show your three collection products. The number is a maximum; the theme does not invent a fourth product. View all should open the selected collection.
6. To move the section, return to the section list, drag the whole Featured collection to its new position, and save. Take care not to drag a different content block above it.

For a homepage with many sections, hide unused ones first and keep a small usable page. If Add section is unavailable, check the template’s section limit. Do not delete configured content just to add this example.

Step 3: Check other resource selections

Content you see	Selection to check	If it is not ready
Homepage banner or image-and-text content	Image, button destination, heading, and body	Replace your assets or temporarily hide the section
Collection list and Collection tabs	Each card or content block’s collection	Select every real collection; changing headings alone is insufficient
Featured product and Shop the scene	Products selected in the section or content blocks	Connect real products; personalized products also need their product page configured
Header’s larger menus	Top-level name/link and each region’s menus and products	Start with a simple main menu, then follow the Header guide
Footer	Logo, Brand description, menus, and contact content	Replace with store information and remove or hide inapplicable wording

Check the actual page after saving. Featured collection shows illustrative product cards when no collection is selected or the collection has no displayable products. These do not create real products or prove that the connection succeeded. Other invalid resources follow their feature’s hiding or fallback rules, shared by the editor and storefront.

Step 4: Check product templates and mobile

1. Open Products in the top template selector, choose the product template to configure, and select a real preview product. Changing the preview product does not assign that template to it.
2. Ordinary products can start with the default product template. To assign a dedicated template, open Products → product → Theme template in Shopify admin, select it, and save. Available templates depend on the currently published theme; a new template in an unpublished theme may not yet appear in the assignment list.
3. Return home and enable mobile preview. Check the logo, menu, product-name wrapping, and buttons, including the route to a product page.
4. Repeat on a real phone or in a browser around 375 px wide. The editor’s mobile icon does not guarantee an exact 375 px width.
5. Save and reopen the preview to check the resource selections. The preview and storefront should display the same valid content.

Continue with Product for product content and personalization, or Footer for the footer.

Common questions

I changed the collection heading, but the products stayed the same. Heading changes text only. Replace the real collection in Collection.

Editing one product changed others too. Static settings in a shared template apply to its other products. Check template assignments first and use the relevant product-data settings for individual content.

A menu label appears, but the link does not work. Check its destination in Content → Menus, then Header’s selected menu. For larger panels, also check name or link matching.

Next: Colors, fonts, and layout. Platform reference: theme editor and templates.