Step 3 - Modify the website

The website project templates can be a base for your demo. You can modify each page, add and remove other pages to make your demonstration as real as possible.

We will modify the retail home page for this exercise, but the same steps can be applied to any other website project.



A different thumbnail represents each page. Click on some of them to see what they look like. As an example, we will first open the "Home" Page. Click on it and click "Edit content" from the panel on the right:



After clicking, you will be redirected to the Visual UI screen, where you can select and edit different components.

Click on the "Banner" just like above.

Using the panel on the right, you can modify the image, text, buttons, alignment, links, etc. Let's change the picture and the title. New image URL: https://s7d1.scene7.com/is/image/TitanProd/homepage.loggedin.EC.desktop.pod0.1440x650@2x?jpegSize=300&wid=1920

New title: Find your Experience Cloud solutions, learning resources, and admin contact info.

Pretitle: Welcome Back



Expand the button appearance section and remove the button label



Expand the Alignment section. Change the alignment from right to left.



All changes are saved automatically. There is no need to click any "Save" button. Everything you do will be visible in your project right after a refresh

Refresh your project in the browser. It should now look like this:



Similarly, you can modify the rest of the pages.

You can change the page branding, e.g., logo, header, footer colors, and fonts. Switch to the branding page of your project to make the changes.



You can add or remove products by switching to the Products tab.



Click on the +Add to add a new product.



Click on the newly added row to make changes to the product.



Provide product details as below:

Name: Velocity DryFit Tee

Description: The Velocity DryFit Tee is an ultra-light, breathable running top designed to wick sweat, keep you cool, and move with your body for peak performance.

Category: Men / Tops

Price:29

Property:

sku:MST07

thumbnail: https://demo-system-next.s3.amazonaws.com/assets/luma/Velocity-DryFit-Tee.png

Image: https://demo-system-next.s3.amazonaws.com/assets/luma/Velocity-DryFit-Tee.png

It will look like below:



Go to the website and open the Men tab. Scroll down and click on All Men’s Products. The newly added product will be visible there.





You can use the Export to File option to download all products and reuse them in another project.