有许多方法来创 WordPress 建网站，Photoshop 是其中之一。本文说说如何制作 WooCommerce 独立站网页设计？如何使用 Photoshop 设计网站。
1 、下载并安装 Photoshop
2 、在您的个人计算机上开启您的 Photoshop 版本，并建立一个新的文件，其高度和宽度设置为您选择的（正常宽度为 800px-900px，正常高度为 1200px-1500px）。您可以命名资料夹（可选）。
3 、为您的网站（从现有图片或从头开始）建立标题，并在其中嵌入您的网站徽标。
4 、建立您网站的选单按钮（形状和颜色，它们之间的空间，作为上选单，底部选单，右侧或左侧选单或两组或三组选单的组合等）
5 、建立内容区域，页尾区域，放置横幅的地方，照片库的地方等等，直到您完成了您的网站的一般外观。
6 、现在的困难的部分：在 Photoshop，切片和汇出您完成的网站，通过在汇出之前给所有切片命名（例如：用切片工具标记该标题的区域，并将其命名为 “标题”，标记区域 的主页按钮，并将其命名为 “主页按钮”，以此类推到网站的每个单独的部分）。
7 、建议将内容区域保留为空，因为您只将其储存为影像切片，文字将显示为影像的一部分，当为空时，可以单独新增每个页面的内容。
8 、将其汇出到桌面上的新档案中，汇出将建立一个 HTML 档案（它将是您的互联网页面，尚未居中且没有内容），一个 CSS 档案以及一个包含所有不同切片和影像的 Images 资料夹 。
9 、使用 OneNote 或记事本开启 HTML 档案，并在 HTML 中进行更改（将整个页面居中，将整个页面设置为背景颜色，将内容放在内容图片所在的 div 标签中，或者使用 div 标签中的 P 标签，建立关键字，内容等的后设资料…）。
10 、复制并贴上与您所拥有的网页数量相同的 HTML 网页，但请务必将其重新命名为相关网页（即 Home.html，aboutUs.html，ContactUs.html 等）。）。
11 、为 HTML 档案中的页面建立内部链接（或者在建立更多页面之前进行建立，以便不必重复），其中按钮影像代码是通过建立 div 并提供按钮链接地址。
12 、将完成的网站档案上传到主机。