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 ...
随机推荐
- Unity与Android之间的交互之AndroidManifest
https://blog.csdn.net/qq_15003505/article/details/70231975 AndroidManifest,中文名一般称之为清单文件.它描述了应用程序的组件的 ...
- zabbix (一) 初识
1.什么是zabbix? Zabbix由Alexei Vladishev创建,目前由Zabbix SIA积极开发和支持. Zabbix是一种企业级开源分布式监控解决方案. Zabbix是监控底层存储( ...
- 【spring源码分析】IOC容器初始化——查漏补缺(五)
前言:我们知道在Spring中经常使用配置文件的形式对进行属性的赋值,那配置文件的值是怎么赋值到属性上的呢,本文将对其进行分析. 首先了解一个类:PropertySourcesPlaceholderC ...
- [Ubuntu] sudo apt-get update指令执行失败
系统:Ubuntu 16.04 LTS 安装软件前执行 sudo apt-get update 更新,但是提示失败如下: 网上搜索后,因为连接不到 US 的服务器,所以更新失败,需要在系统设置中将源服 ...
- Windows使用Latex
目录 安装Texlive 安装TeXstudio 编写简单的文章 教程 安装Texlive 到清华大学开源软件镜像站下载Texlive2019.iso文件 下载之后,如果有光驱就装载,没有的话就解压. ...
- 【译】Solr in Action 第二章
2.1 2.2 2.3 基本废话 2.4 基本废话
- nodejs取参四种方法 req.body, req.params, req.param, req.body
获取请求很中的参数是每个web后台处理的必经之路,nodejs的 express框架 提供了四种方法来实现. req.body req.query req.params req.param() 首先介 ...
- pgpool 的配置文件详解
listen_addresses = 'localhost' # Host name or IP address to listen on: # '*' for all, '' for no TCP/ ...
- http-proxy-middleware及express实现反向代理
$ npm install --save-dev http-proxy-middleware npm install express // 引用依赖 var express = require('ex ...
- Docs-.NET-C#-指南-语言参考-预处理器指令:#line(C# 参考)
ylbtech-Docs-.NET-C#-指南-语言参考-预处理器指令:#line(C# 参考) 1.返回顶部 1. #line(C# 参考) 2015/07/20 借助 #line,可修改编译器的行 ...