WordPress的SitePoint基本主题新手指南

简介: WordPress的SitePoint基本主题新手指南

技术标签: javapython大数据html人工智能

If you’d like to learn more about custom theme development, check out the SitePoint Premium course WordPress Theme Development!


如果您想了解有关自定义主题开发的更多信息,请查看SitePoint Premium课程WordPress主题开发 !


Earlier this week, I introduced you to the SitePoint Base Theme for WordPress.


本周初,我向您介绍了WordPress的SitePoint基本主题 。


Sometimes, WordPress themes can visually catch your eye in the front end while behind the scenes they’re bloated and lack quality. SitePoint wanted to address this concern and focus on the development of a new base theme that could confidently provide users with a starter theme they could use for any WordPress project that is minimal, clean, simple, lightweight and responsive.


有时,WordPress主题可以在前端视觉吸引您,而在幕后它们却ated肿且缺乏质量。 SitePoint希望解决此问题,并专注于开发新的基本主题,该主题可以自信地为用户提供一个入门主题,他们可以将其用于最小,简洁,轻便且响应Swift的任何WordPress项目。



bd3840aacbc426a4be892805fe6f106c.png

The SitePoint Base Theme has been designed with a focus on the following key features:


SitePoint基本主题的设计重点是以下关键功能:


100% Free: Open Source GPL 2.0


100%免费:开源GPL 2.0


High Performance


高性能


Code Quality


代码质量


Mobile Optimization


移动优化


SEO Friendliness


SEO友好


WooCommerce Compatibility


WooCommerce兼容性


Page Builder Compatibility


页面构建器兼容性


Today we’ll take a closer look at how you can actually get started with the SitePoint Base theme on your next project, walking you through the key features and benefits this starter theme has to offer out-of-the-box.


今天,我们将仔细研究下一个项目中如何真正使用SitePoint Base主题,并带您逐步了解该入门主题提供的即开即用的主要功能和优势。


步骤1:下载并安装SitePoint基本主题 (Step 1: Download and Install the SitePoint Base Theme)


The first step is to download your copy of the SitePoint Base Theme.


第一步是下载SitePoint基本主题的副本。

38a070db802cc15e48cbed90765f23ca.png



Then, in your WordPress dashboard, go to Appearance and Themes and then upload the theme to your WordPress website. I also recommend having a copy of the documentation on hand.


然后,在WordPress仪表板中,转到“ 外观和主题” ,然后将主题上载到WordPress网站。 我还建议手头准备一份文档 。


7c15ab0f47cbbc5982256280c760caac.png


步骤2:建立您自己的主题 (Step 2: Create your Own Theme)


The SitePoint Base Theme has been designed as a starter theme so you can extend upon it with your own creation. We could edit the theme directly, but best practice is to create a copy as our own child theme.


SitePoint基本主题已设计为入门主题,因此您可以使用自己的创作对其进行扩展。 我们可以直接编辑主题,但是最佳实践是创建一个副本作为我们自己的子主题 。


Before you can do this, you need to copy the SitePoint Base Theme folder and change the name to something else. You’ll then need to do a three-step find and replace on the name in all the templates.


在执行此操作之前,您需要复制SitePoint基本主题文件夹并将名称更改为其他名称。 然后,您需要进行三步查找,并替换所有模板中的名称。


Then all you need to do is update the stylesheet header in style.css.


然后,您需要做的就是更新style.css的样式表标题。


步骤3:使用模板 (Step 3: Working with the Templates)


40a24812b0282ca2c48d178b9a3a1588.png


SitePoint have included the popular templates of full width, sidebar, tag, categories, authors, search, posts archive and 404.


SitePoint包括流行的模板,包括全角,边栏,标签,类别,作者,搜索,帖子存档和404。


They’ve also included the Page Builder Blank, Boxed and Full-Width templates which is ideal if you have chosen to work with a page builder like Visual Composer or Divi Builder.


他们还包括“页面构建器”的“空白”,“盒装”和“全角”模板,如果您选择使用诸如Visual Composer或Divi Builder的页面构建器,这是理想的选择。


步骤4:使用主题定制器 (Step 4: Using the Theme Customizer)


18c30288ef5d51752b7b9bff5b03a966.png


Out of the box you can easily add:


开箱即用,您可以轻松添加:


Custom logo


自定义徽标


Custom header


自定义标题


Custom background


自订背景


步骤5:配置窗口小部件 (Step 5: Configuring Your Widgets)


ae18ec6b02b682a0ba3773190420ddec.png


Choose how you wish to utilise the main widget areas within the base theme. There’s a main sidebar, a blog sidebar, single post sidebar and page sidebar.


选择您希望如何利用基本主题内的主要窗口小部件区域。 有一个主边栏,一个博客边栏,单个帖子边栏和页面边栏。


SitePoint have also provided up to four footer widgets that intuitively space themselves out evenly across the page depending on how many are included.


SitePoint还提供了多达四个页脚小部件,这些小部件可根据所包含的数量在整个页面上直观地均匀分布。


如果您想要更多呢? (What If You Want More?)


If you want to further customize your website, you have a couple of options:


如果您想进一步自定义您的网站,则有两种选择:


1.编辑CSS (1. Edit the CSS)


Using CSS you can change the entire look and feel of your theme, however you do need to know some basic CSS and HTML. If you’re a beginner, here’s a good starting point. For more theme customizations, adding some basic CSS will be enough for more requirements. You can also edit your page templates, these are mostly simple HTML.


使用CSS可以更改主题的整体外观,但是您确实需要了解一些基本CSS和HTML。 如果您是初学者, 这是一个很好的起点 。 对于更多主题自定义,添加一些基本CSS足以满足更多要求。 您还可以编辑页面模板,这些模板大多是简单HTML。


For custom functionality, you’re heading into plugin territory (that said, SitePoint Base Theme supports many popular plugins such as WooCommerce that enables powerful ecommerce functionality).


对于自定义功能 ,您将进入插件领域(也就是说,SitePoint Base Theme支持许多流行的插件,例如支持强大电子商务功能的WooCommerce)。


2.使用页面构建器 (2. Use a Page Builder)


SitePoint Base Theme supports all of the major page builders, including Visual Composer, Beaver Builder, Divi Builder and SiteOrigin.


SitePoint基本主题支持所有主要的页面构建器,包括Visual Composer,Beaver构建器,Divi构建器和SiteOrigin。


We’ve got a great article that explains the power of WordPress page builders, this also covers some of the pros and cons.


我们有一篇很棒的文章,解释了WordPress页面构建器的功能 ,其中还包括了一些利弊。


获得帮助 (Getting Help)


If you’ve had a chance to review or build with the SitePoint Base Theme, please share your thoughts and experiences with us below. Otherwise you can post support related queries and feedback on the community forum.


如果您有机会使用SitePoint基本主题进行审查或构建,请在下面与我们分享您的想法和经验。 否则,您可以在社区论坛上发布与支持相关的查询和反馈。

相关文章
|
7月前
|
JavaScript 搜索推荐 前端开发
WordPress主题推荐
作为网站的基础,WordPress主题对网站加载速度具有重要影响。一个设计不好,代码杂乱的WordPress主题会严重影响网站加载速度,进而影响网站排名。相反,一个设计良好,代码简洁的WP主题会加载很快,有助于提升网页排名。如果你想创建一个精美的WordPress网站,选择一个优秀的主题至关重要。然而,在追求美观的同时,绝不能忽视性能和速度。在本文中,我们已经为你整理了一些速度快且适合SEO的WordPress主题。
245 4
WordPress主题推荐
|
6月前
|
移动开发 前端开发 语音技术
WordPress轻拟物博客主题niRvana 4.5.3(自适应手机端)
WordPress轻拟物主题niRvana,设计上不再趋从于现有的扁平风,我认为是时候从极致的扁平稍微向拟物致敬了,因此采用了轻拟物的风格。niRvana 设计和样式更加新颖,一眼看上去就会被他吸引住,主题配色也非常舒服。而且它有两个功能特别有意思,一个是自动根据文章特色图片识别出图片的主色调,在首页、文章分类页用最美的方式显示滚动图片,另一个则是文章支持语音朗读。主题细腻有质感,手机端体验非常好。
95 2
|
5月前
|
前端开发
WordPress主题Rizhuti-V2广告位模块美化
WordPress主题Rizhuti-V2广告位模块美化
48 0
|
5月前
|
SEO
WordPress作品设计素材图片站资讯文章教程uigreat主题
WordPress作品设计素材图片站资讯文章教程uigreat主题
49 4
WordPress作品设计素材图片站资讯文章教程uigreat主题
|
5月前
|
存储 前端开发 定位技术
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
|
6月前
|
前端开发 数据安全/隐私保护 SEO
一款基于WordPress开发的高颜值的自适应主题Puock
支持白天与暗黑模式 全局无刷新加载 支持博客与CMS布局 内置WP优化策略 一键全站变灰 网页压缩成一行 后台防恶意登录 内置出色的SEO功能 评论Ajax加载 文章点赞、打赏 支持Twemoji集成 支持QQ登录 丰富的广告位 丰富的小工具 自动百度链接提交 众多页面模板 支持评论可见 支持密码可见 支持Dplayer播放器 简约快捷的后台配置 更多功能,等你的提议
67 2
一款基于WordPress开发的高颜值的自适应主题Puock
|
5月前
|
前端开发
wordpress主题导航菜单栏目增加角标
wordpress主题导航菜单栏目增加角标
83 1
|
6月前
|
CDN
WordPress中文网址导航栏主题风格模版HaoWa
HaoWA主题风格除行为主体导航栏目录外,对主题风格需要的小控制模块都开展了敞开式的HTML在线编辑器方式的作用配备,另外预埋出默认设置的编码构造,便捷大伙儿在目前的编码构造上开展作用调节。另外添加了字体图标FontAwesome的CDN。 HaoWa主题风格导航栏详细介绍:适用混合开发响应式网站适用网站内部及外站检索适用头顶部banner背景图案自定适用莱单自定适用归类锚链接定项适用导航栏详细介绍网页页面适用文章分类目录适用自定首页导航按键适用文章投稿网页页面适用底端四栏作用自定适用归类CMS子归类控制模块
64 1
|
6月前
WordPress软件下载主题Inpandora
Inpandora(中文名为潘多拉)是一款基于软件下载站定制的WordPress主题,帮助站长使用WordPress快速搭建一个专业的WordPress软件博客。Inpandora这款WordPress主题可以说是因软件而生,从UI设计到后台设置功能,都充分体现出这款主题的专业性。
58 2
|
6月前
|
PHP SEO
WordPress强大多功能主题模板The7 v9.16.0
The7可以与WPBakery Page Builder(原Visual Composer)和Ultimate Addons的完全无缝集成。它也与大多数流行的插件完全兼容,例如WooCommerce,WPML,Yoast SEO,All in One WP Migration,W3 Total Cache等。大多数用户均表示:The7是迄今为止与这些插件一起使用的最佳主题!
49 2