UXD带你全面解锁Squarespace，经过我们实测这是最好用的个人网站建站神器没有之

时间：2023-08-02 16:42:01 | 来源：网站运营

时间：2023-08-02 16:42:01 来源：网站运营

UXD带你全面解锁Squarespace，经过我们实测这是最好用的个人网站建站神器没有之一：

同学们在制作作品集的时候，为了有更丰富的展现个人设计的方式，搭建个人作品集网站绝对是一个不二的选择，但是如何快速搭建个人网站成为了很多同学挠头的事情。

建站工具有很多，比如WordPress，Wix……但是经过UXD导师们的长期实测，可以很负责地告诉同学们：“Squarespace荣升为最好用的建站工具没有之一”。

注：UXD为所有内部学员提供免费的建站一对一辅导，有需要的同学可以直接联系教务老师获取课程排期和技术支持。

本文，UXD将从如何注册、如何编辑内容、如何改变字体和颜色、如何加分栏颜色和如何制作轮播图，这五个方面介绍Squarespace的使用方法。

01 注册账户

在Squarespace主界面的左上角有LOG IN的登入口，可以用邮箱创建一个新用户，注册你的Squarespace账号。

注册完之后，你就可以根据自己的意愿选择你想制作的网站类型了，例如下图选择Portfolios之后，就会有对应的模板供你制作。

02 添加/编辑内容

进入模板后，左侧为菜单栏。菜单栏中的选项主要用来调整网页的组织架构，设计网页的配色、字体等参数。

点击Pages进入下图所示的两个板块。Main Navigation可以调整顶部的导航栏；Home选项可以调整首页。

接着，选中Home页面，点击Edit对页面进行编辑。

点击页面上有修改标记的地方即可对相应内容进行调整。

点击页面间的加号可以添加内容。

添加内容可以包含图片、视频、文字、链接等。

同时还可以在模板内部继续添加内容。


可添加内容如图所示，包含文字、图片、视频、引用、链接等，形式非常丰富。下图所示就是可以添加材料的所有形式。

当我们需要对整个面板进行调节的时候，可以选择右侧的浮标对面板进行编辑、复制、上下移动的操作。

03 改变字体和颜色

在Squarespace中更改字体风格、大小、颜色都是通过代码进行操作的。双击模板中的文字可以修改内容。右击会出现Inspect字样，如下图所示，打开代码面板。

进入到代码模板后，需要点击下图中圈出来的按钮，才可以获取网页代码，选择元素并查看和复制代码。

当我们的鼠标移动到想要查看的文字，就会有对应的信息显示在屏幕上。

比如，这里的字体是h3，颜色是黑色。同样的，在右边的代码框中也会有相应的信息显示出来。

记住这里显示的信息，然后回到Design面板，点击CSS面板，对你需要修改的字体进行代码的编辑。

点击CSS面板后，下方就会有一个代码框，在这里，我们可以将相应的代码进行粘贴或者编写。

比如，我们想把自己已经编辑好的文字代码信息转移到Squarespace中。以Figma为例，在Figma页面的右侧也有相应的代码。点选相应的文字，点击Inspect，就可以查看代码。

然后，直接复制这一段代码到Squarespace的代码填写框中。

font-family: PingFang SC;

font-style: normal;

font-weight: normal;

font-size: 72px;

line-height: 101px;

color: #000000;

但是需要注意的是，我们复制到Squarespace中的时候，一定要记得之前文字的标号，比如：h3{这里插入刚才复制的内容}。

下面有一个小动画展示代码改变字体的效果。将代码输入到左边的代码框中，右边的文字就发生了相应的改变。

04 添加分栏底色

下面介绍一下如何加分栏底色。我们在Design栏中点开Colors选项，然后再对颜色进行修改。在修改分栏底色之前，我们需要对网站的配色方案进行修改，在Custom Colors中加入或改变你想要的颜色。

在右侧浮窗的Edit Section中有Colors的选项，然后就可以在你编辑好的色彩模板中选择你想要的分栏设计版式。

05 如何加轮播图

点击下图所示的标志，可以添加更多新的内容，轮播图的插入也是通过这样的方式。

点击段落后，可以插入Carousel轮播图模板。

在轮播图模板中，需要先将资源上传blog才可以加载自己的图片。第一步在Home栏中的Not Linked创建新的Blog，然后就新增一个你自己的Blog可以添加内容。

点击Blog 1中的Settings更改其中的图片。

在Options选项中，先移除预设的图片，再上传自己的图片。

之后，就可以在相应的Carousel轮播图中添加相应的Blog 1了。

---

更多知识干货以及其他海外留学的资讯可以关注UXD交互工业产品设计分享或者添加小助手，还可获取讲座直播哦~

|福利大放送 | WELFARE 对于设计初学者，完成从0开始创作几乎是不可能的，就像学习过程中书读百遍其义自见一样。有了大量的积累，才能在脑海里建立素材库，这些素材库能帮助同学们完成最初的设计想法积累，基于这样的基础再进行个性化的创作，最终才能做出高质量的作品集。全球院校最新作品集免费拿！添加小助手即可获取：

UXD交互工业产品设计学院是尤克斯国际旗下的一家专注于交互、服务、工业、产品设计专业的顶级设计学院。除了一对一设计课、基础技能课程、小组课题、设计评图、联合教学外，我们提供不定主题的公开课和内部小组课，教学计划课程由三大部分组成，包括基础软件技能教学、设计理论系统讲座、申请必备知识解析等。

本文版权归UXD尤克斯所有，部分图片来自于网络，如有侵权请与我们联系！