在上一章中我们以及安装好了网站的Demo,今天我们就开始对这个Demo站点就行修改,让它成为我们自己内容的网站。
首先我们登录网站后台:cnc.vnlee.com/wp-admin/(cnc.vnlee.com需要修改成你们自己的域名),网站后台如下图。
1.修改网站Logo
点击左侧菜单栏的Enfold Child进入主题设置选项,找到Logo和Favicon选项。Favicon是网站的小图标,在标签栏有有显示。
点击Upload进入媒体上传页面,我们可以直接将电脑的图片拖入当前网站页面即可,也可以点击Upload Files打开本地文件进行上传。这里我已经上传好了Logo和Favicon,点击图片进行勾选,将右侧的Size调整成Full Size,最后点击右下角的Use image as logo。Logo建议尺寸340×156像素的透明底PNG图片,上下要留一定空白,Favicon则需要1:1的方形图片,尺寸建议144×144像素。
接下来我们再把Favicon用同样的方式进行修改,完成后如下图。这两个都修改好了之后点击右上角的 Save all changes来对修改进行保存。
ok, 我们现在先进入网站看看效果。
我们可以看到网站的小图标和Logo已经修改成功。
2.修改首页banner
接下来我们对首页的Banner进行修改,在登录的状态下打开网站的首页可以看到上面有一条工具栏。这里我们点击Edit Frontpage来进入首页编辑界面。
这里我们点击Edit Frontpage来进入首页编辑界面,点击Dismiss关闭提示。在页面内容区里面可以找到首页中的除去顶部和底部的所有内容,我们要修改的Banner就是其中的Fullwidth Ease Slider。
点击Fullwidth Ease Slider进入编辑界面可以看到当前网站的三张Banner和其中的文案。
首先我们修改图片,点击change image。同样的,我们将制作好的Banner图片上传到网站,然后勾选要使用的图片之后点击右下角的Change Image,这里的图片我们可以做成跟原来一样的1500×630像素。
这样图片的修改就完成来,接下来我们修改图片上的文字。点击上面的Caption选项进入文字及按钮编辑。
这里我们可以看到有两个文字输入框,Caption Title和Caption Text。直接将鼠标点到文字上即可对其进行编辑,这里我的已经修改好了。完成修改后点击右下方的Save进行保存,这里Banner上的按钮链接我们可以根据自定义修改成不同的文字和跳转的页面,这里我暂时按原有链接和文字。这样一张Banner就已经修改完成了,接下来我们用同样的方式来修改另外两张即可,记得每次完成编辑需要点击右下角的Save。
完成Save操作后我们会回到Home的编辑页面,这时候可以点击右上角的Preview Page来对页面进行预览。
点击Preview Changes后我们可以看到修改后的结果如下,确认ok后回到编辑页面点击Update对修改进行更新。
3.其他图文编辑
接下来我们对首页的其他内容进行编辑,网站后台的布局和前端显示的是一一对应的,只需要点击对应的元素然后进行修改和保存即可,这里就不一一介绍了,需要注意的是图片的尺寸尽量和原图一致,或者使用同样尺寸的图片。在上传图片之前最好对图片进行压缩,这里介绍个工具可以快速批量的压缩图片大小:图像批量压缩加水印剪裁调整工具
下图为修改后的页面,也可以直接访问cnc.vnlee.com来查看这个网站案例。
由于产品和服务内容还没上传,这里图片和文字的链接暂时先不管,到后面完善产品后进行修改即可。到这里我们首页的修改就暂时搞一段落,接下来我们开始做产品页面。点击进入下一章: