wordPress设计网页实践
我希望能设计出世界上最美的画面!
首先进入你自己建立的网站http://localhost:8079/Frank,如上图所示。注意,编辑页面时,要可以上外网,否则wordPress的插件会下载出错!
点击左上角按钮(不知为什么在firefox浏览器中最上面一栏没有显示),在下拉列表中选择Dashboard( 仪表盘),即可进入下图网站设计界面,也可以直接登入设计界面:http://localhost:8079/Frank/wp-admin/,我从本地电脑登陆时,不用输入网站的用户名和密码,可能从外网登陆该页面时需要密码。
图一
进入 Learn more about getting started链接,里面有一官方的教程!
设计了一些元素之后,如果想返回页面看效果,点击左上角的主页按钮“FrankWP”即可返回。
网站元素理解: 网页(Page)和主题(Theme):
建立的网站有很多个Page,每个page即一个网页页面。你可以无限添加,点击图一左侧的Pages,可以进入网页编辑界面,在这里你可以重新编辑之前建立的page,或者添加新的page,或者删除page。编辑完一个页面之后,点击右侧栏中的update按钮即可保存更新。 编辑页面时,在右下角有一个Set featured image ,点击后可以为当前你正在编辑的页面添加一个图片。
假设你建立了10个page,但是这些page如何布局呢,登陆你的网站之后首先会看到那个page,每个page的风格时什么样子的呢,这些都是由网站的主题(Theme)决定的。 在wordPress官网上可以下载很多个不同的主题,不同的主题有不同的风格!例如,虽然你在编辑某个page时为其添加了featured image,但是在某些主题写,这些图片是不予显示的。因此,网站的风格跟主题的相关度很大。
你的网站的主题可以随便切换,但是你已经建立好的各个页面,还有已经写的Post, 添加过的widgets是不会变少的,只是他们的组织方式变了。 对于不同的主题下载之后,需要你对它进行customize,不同的主题可以让你customize的项不一样,例如如果你激活的某个主题不显示图片,那么你customize这个主题的时候就会少一些项目。
图一左侧工具栏介绍:
1)home按钮:点击后,进入的即是图一的DashBoard页面,该页面是一个概览性质的页面吧,而且有一些快捷键,例如可以直接进入customize your site, 编辑添加Page等!
2)Post按钮:进入后,可以查看和管理发布过的post,可以添加新的post.
3)Media: 管理你给网站添加的图片等资源,可以加资源。
4)Comments:管理别人的评论。
5)Apperance -- Theme: 为网站选择主题,可以用你已经下载过的,或者 通过AddNew按钮下载新的哦。
Apperance -- Customize: 该页面下也可以通过change按钮重新选择主题。不同的主题,对应的下图列表不 一样。
其他的点进去即可知道功能。对于menus,可能只有某些主题才有这个选项,其用来控制在网站的最上方和最下方显示什么链接。
Apperance -- Widgets: 左侧显示各个可以被添加的控件,例如日历,视频等。右侧显示你当前的网站可以接受放置Widgets的区域。
Apperance -- Menus: 控制网站的最上方menu栏(Primary Menu) 和最下方的menu栏(foot Menu)显示的东西。感觉在foot menu中一般显示一些友情链接吧. 界面上Menu structure对应的各个item,就是将要显示的东西,你可以随便添加删除,当然也可以将你自己建立的page,写的某一篇post作为一个item.
Apperance -- Header: 设置网站最上方的Header(显示网站名字,Primary Menu的那一小部分)的背景图片等。
Apperance -- Header: 设置网站的整个背景。
Apperance -- Install Plugins: 安装plugins,具体作用还没有体会到
Apperance -- Editor: 还未知。
6)plugins: easy!
7)users: 账户管理
8)Tools: 里面有导出/导入网站数据的功能!
9)Setting: easy!
Free WordPress Theme 下载:(可以直接谷歌where to download free ...)
https://colorlib.com/wp/free-wordpress-themes/
https://themeforest.net/free/wordpress-themes
下载后,一般为zip格式,直接进入Apperance -- Theme 用upload按键上传zip文件,然后点击install,这是可能会提示The uploaded file exceeds the upload_max_filesize directive in php.ini. 因为你限制了大小,方法:打开php.ini 文件,搜索 upload_max_filesize 和 post_max_size,改一下文件上传最大限制,比如都改为 32M,比你要上传的文件大。如果你用的是xampp建站,直接点击Apach的config按钮,找到php.ini文件。如果不是则自己安找吧,参考:https://www.vpsss.net/2679.html
wordPress设计网页实践的更多相关文章
- RESTful API 设计最佳实践
背景 目前互联网上充斥着大量的关于RESTful API(为了方便,以后API和RESTful API 一个意思)如何设计的文章,然而却没有一个"万能"的设计标准:如何鉴权?API ...
- Atitit 词法分析器的设计最佳实践说明attilax总结
Atitit 词法分析器的设计最佳实践说明attilax总结 1.1. 手写的优点:代码可读,对源代码中的各种错误给出友好的提示信息,用户体验高,1 1.2. 使用状态表比较简单,dfa比较麻烦1 1 ...
- atitit.基于http json api 接口设计 最佳实践 总结o7
atitit.基于http json api 接口设计 最佳实践 总结o7 1. 需求:::服务器and android 端接口通讯 2 2. 接口开发的要点 2 2.1. 普通参数 meth,p ...
- ****RESTful API 设计最佳实践(APP后端API设计参考典范)
http://blog.jobbole.com/41233/ 背景 目前互联网上充斥着大量的关于RESTful API(为方便,下文中“RESTful API ”简写为“API”)如何设计的文章,然而 ...
- RESTful API 设计最佳实践(转)
摘要:目前互联网上充斥着大量的关于RESTful API(为了方便,以后API和RESTful API 一个意思)如何设计的文章,然而却没有一个”万能“的设计标准:如何鉴权?API格式如何?你的API ...
- RESTful API 设计最佳实践(转)
背景 目前互联网上充斥着大量的关于RESTful API(为方便,下文中“RESTful API ”简写为“API”)如何设计的文章,然而却没有一个”万能“的设计标准:如何鉴权?API 格式如何?你的 ...
- Slickflow.NET 开源工作流引擎基础介绍(六)--模块化架构设计和实践
前言:在集成Slickflow.NET 引擎组件过程中,引擎组件需要将用户,角色等资源数据读取进来,供引擎内部调用:而企业客户都是有自己的组织架构模型,在引入模块化架构设计后,引擎组件的集成性更加友好 ...
- 异步化DAO的设计和实践
目前,公司技术规划要求未来所有的服务要全面实现异步化接口,使得每个服务能达到1万/秒的单机性能.我们知道,在一个服务请求中,可能会调用其他服务,还会使用memcache.kv以及mysql等.目前,大 ...
- loadrunner 场景设计-设计与实践
场景设计-设计与实践 by:授客 QQ:1033553122 以lr 11.0 自带Web Tours为例,进行以下测试 说明:以下测试仅供演示,学习设计思路 A.确定系统组件 简单B/S架构:Cli ...
随机推荐
- 三个方法(apply、call、bind)
一.apply()和call() 方法中如果没传入参数,或者是null,那么调用该方法的函数对象中的this就是默认的window <script> function f1(x,y){ c ...
- 第一章 初识Linux shell
Linux 由内核.GNU.桌面环境.应用软件四部分组成 内核基本功能: (1). 管理内存 (2). 管理硬件设备 (3). 管理文件系统 (4). 管理软件程序 GNU:操作系统需要一些工具来执行 ...
- linux系列(十三):less命令
1.命令格式: less [参数] 文件 2.命令功能: less 与 more 类似,但使用 less 可以随意浏览文件,而 more 的功能不如less,而且 less 在查看之前不会加载整个文 ...
- nginx + keepalived双活配置
一.安装nginx 我们这边默认安装的nginx的是1.12.2的版本,所以我们需要安装1.16.1版本的nginx的,才好,所以我们这边先更新yum源,步骤如下: 1.添加yum源: [root@s ...
- nodeJs 初学案例摘要
在学习nodeJs的时候,照着文档做的,但是到最后的上传文件显示图片总是报错, 所用的fs.renameSync出错:Error: EXDEV, cross-device link not permi ...
- vue 路由传参的三种方法
API在这里 https://router.vuejs.org/guide/essentials/navigation.html 第一种传参 通过路由属性中的name来确定匹配的路由,通过param ...
- java实现哈夫曼树进行文件加解压
目录 1.哈夫曼树简述 2.构造树的节点 3.构造哈夫曼树的类(压缩) 4.构造哈夫曼树的类(解压) 5.整体工程文件(包括测试类) 6.结果 7.参考链接 1.哈夫曼树简述 给定n个权值作为n个叶子 ...
- Docs-.NET-C#-指南-语言参考-预处理器指令:#warning(C# 参考)
ylbtech-Docs-.NET-C#-指南-语言参考-预处理器指令:#warning(C# 参考) 1.返回顶部 1. #warning(C# 参考) 2015/07/20 #warning 允许 ...
- vue 实现返回上一页不请求数据keep-alive
常规操作: 我们通常会将通过接口请求数据的方法放在==created== 或者 ==mounted==这两个生命周期中的一个里面调用. 但是我们知道,不管是我们刚进入这个页面还是从其他页面返回这个页面 ...
- udf提权小结
00x1 首先判断mysql版本, mysql版本 < 5.2 , UDF导出到系统目录c:/windows/system32/ mysql版本 > 5.2 ,UDF导出到安装路径MySQ ...