使用同样的WordPress主题,为什么别人的站点就看起来更赏心悦目?更高级呢?特别是买付费主题的同学,明明演示站就非常漂亮啊!到自己的站点启用就那么丑呢?啊老师来跟大家分享一些小经验,让你的WordPress付费主题不白买,至少达到演示站的效果,甚至超过演示站

这里输入内容

我子比站点用的国内服务器这影响吗?
使用同样的WordPress主题,为什么别人的站点就看起来更赏心悦目?更高级呢?特别是买付费主题的同学,明明演示站就非常漂亮啊!到自己的站点启用就那么丑呢?啊老师来跟大家分享一些小经验,让你的WordPress付费主题不白买,至少达到演示站的效果,甚至超过演示站!

这里输入内容

这里输入问题
使用同样的WordPress主题,为什么别人的站点就看起来更赏心悦目?更高级呢?特别是买付费主题的同学,明明演示站就非常漂亮啊!到自己的站点启用就那么丑呢?啊老师来跟大家分享一些小经验,让你的WordPress付费主题不白买,至少达到演示站的效果,甚至超过演示站
这里输入第一个标签页内容
这里输入第二个标签页内容
这里输入第三个标签页内容
这里输入第四个标签页内容

高亮文字

  • [x] 已完成
  • [ ] 未完成
  • [ ] 待办

一级标题(H1)

二级标题(H2)

三级标题(H3)

四级标题(H4)

五级标题(H5)
六级标题(H6)
姓名年龄性别
张三20
李四22

删除内容

标题文字

我我我我1

标题文字2

呜呜呜呜呜呜呜

标题文字

呜呜呜呜

标题文字

哇哇哇哇哇哇

第一点:菜单设置。更换主题后,要根据主题的情况来设置导航菜单。有的主题还有多个菜单。

  1. 每一处菜单的数量要调整到合理范围之内。多了或少了都不好看。
  2. 菜单加字体图标。在菜单名称前,加上字体图标会让菜单看起来更好看哟。
  3. 菜单文字字数最好统一,这样看起来更整齐。

第二点

换LOGO。一个好看的LOGO是一个站点的灵魂。一般付费主题会有推荐的LOGO尺寸,你按这个来制作LOGO一般不会错。但是啊老师建议大家按推荐尺寸的2倍来制作LOGO。然后在微调CSS,显示为一倍。这样在高分辨率的屏幕下,logo也不会发虚。下面的CSS是设置我的LOGO最大高度为32像素,而实际制作的LOGO是64像素。

第三点:主题颜色管理。

我是图片
高级付费主题可以设置高亮部分的颜色。如果你用默认的就跟别人千篇一律了。建议修改一个自己LOGO中带有的颜色。这样和LOGO搭配起来就很和谐。不知道设置什么颜色的,一般蓝色都不会LOW到哪里去。

除了高亮主色,页面中尽量少用其他亮色。素一点就更高级啦。字体颜色也可以调一下,灰色是万年经典高级颜色。文字一般都是为接近纯黑的深灰色看上去比较高级。例如这种色号:#1a1a1a 。

第四点:字体设置。

字体家族这个系统默认的就好。但是行间距,段间距这些要微调一下,稍微大一点会显得好看一些。字体大小要注意,尽量不要用太大的字。特别是汉字,一般来说字号越大就越Low。14号正文,16号小标题,18号大标题。

第五点:图片。

图片是一个站点显得高级不高级的重要因素。可以去免版权的图库下载一些图作为封面、轮播图。这个站的图都不错:点击跳转

有些高级主题可以设置默认的缩略图,一定要选一张颜色相对比较素的图片作为默认缩略图。

第六点:侧边栏小工具。

侧边栏不要加太多东西呀。简单一点就够看了。有些主题没有适配的默认小工具,不要加!最好加主题带的那些小工具。

做好这几个方面,你的WordPress站点应该看起来就不错了。希望我的经验能帮助到你!

.detail-content .info[data-v-07eda1e6] {
    font-size: 15px;
    color: #666;
    line-height: 20px;
    margin-top: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #ededed
}

.detail-content .info .author[data-v-07eda1e6] {
    float: right;
    margin: 0;
    padding: 0
}

.detail-content .info .tags[data-v-07eda1e6] {
    font-size: 15px;
    color: #666;
    line-height: 20px
}

.detail-content .info .tags[data-v-07eda1e6]:before {
    content: "#";
    display: inline-block;
    margin-right: 8px;
    border-radius: 100%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    color: #00bebe;
    background: rgba(0,190,189,.2)
}

.detail-content[data-v-07eda1e6] .content {
    width: 100%
}

.detail-content[data-v-07eda1e6] .content p {
    padding: 12px 0
}