生活或许总有遗憾,但未来依旧美好。
欢迎访问...
Tag

Tag: css

遇到的问题有很多,我一一写出来,免得以后犯傻想不起。 1、提示没开启WP缓存的。 wp-config.php里没有 define('WP_DEBUG',false); 。直接通过FTP编辑网站根目录的wp-config.php,复制添加进去。并且要在require_once(ABSPATH.'wp-settings.php');之前。千万别用本地的去替换,不然呵呵哒。 2、wp-content文件夹不可写的。 确认wp-content是否可写,如果不可写,linux主机下,将属性调为777即可。 3、提示wp-content/目录下没有wp-cache-config.php和advanced-cache.php的。 将wp-super-cache/wp-cache-config-sample.php 复制到 wp-content/中,并重命名为 wp-cache-config.php; 到wp-super-cache/advanced-cache.php 中,将advanced-cache.php 复制到 wp-content/ 中; 4、提示无法加载wp-cache-phase1.php的。 错误提示:Warning! WP Super Cache caching broken! The script advanced-cache.php could not load wp-cache-phase1.php. Please edit /var/www/public_html/ and make sure the path to /var/www/public_html/wp-content/plugins/wp-super-cache/wp-cache-phase1.php is correct. 这个是因为之前重装过插件,或者服务器搬迁直接把文件复制过来,导致路径出错的。打开wp-content/advanced-cache.php,找到下面13、14那两行代码,修改为你实际的路径即可。 <?php # WP SUPER CACHE 0.8.9.1 function wpcache_broken_message() { if ( false == strpos( $_SERVER[ ‘REQUEST_URI’ ], ‘wp-admin’ ) ) echo “<!– WP Super Cache is installed but broken. The path to wp-cache-phase1.php in wp-content/advanced-cache.php must be fixed! –>”; } if ( !include_once( ‘/home/ab100v/html/wp-content/plugins/wp-super-cache/’ . ‘wp-cache-phase1.php’ ) ) { if ( !@is_file( ‘/home/ab100v/html/wp-content/plugins/wp-super-cache/’ . ‘wp-cache-phase1.php’ ) ) { define( ‘ADVANCEDCACHEPROBLEM’, 1 ); register_shutdown_function( ‘wpcache_broken_message’ ); } } ?> 最后,终于成功了。也祝大家顺利解决这个问题。

WPGO主题为了适应电脑端和移动端,对菜单做了CSS隐藏。如果是电脑端访问,则显示.menu-navigation,隐藏.mobile-nav,反之同理。 而移动端为了适应宽度,作者是把导航链接全部缩入到“菜单”一栏中的,很难突出我们想要访客点击的栏目。于是我对它进行了修改。 首先给它添加一个菜单,打开functions.php,找到 // 自定义菜单。修改为: // 自定义菜单 register_nav_menus ( array ( 'header-menu' => __ ( '导航自定义菜单' ) ) ); register_nav_menus ( array ( 'mobile-menu' => __ ( '导航手机端菜单' ) ) ); 这样后台—外观—菜单,就多了一个导航位置选项。 我们可以新建一个新的菜单给移动端去显示了。还需要修改header.php。 把<div class="mobile-nav%20nav-menu">里的内容改为 <div class="mobile-nav%20nav-menu"> <?php wp_nav_menu( array( 'theme_location' => 'mobile-menu'));?> </div> 这样就可以随便自定义电脑端的菜单,又不用担心不适应移动端了。最终效果:

用户体验设计已经渗透到产品的各个部分,无论是对于产品大方向的把握,还是对产品各种细节的掌控,产品设计师能够越来越轻易地设计出好用的产品。 但是产品设计师是不会甘于现状的——字体研究完了,就去优化配色,配色已被穷尽?那就捣鼓布局去!“自强不息”的设计师总会找到更优秀的设计方法。 会呼吸的文字 在使用某些网站的过程中,发现了一个很有趣的交互:鼠标悬停(mouseover、hover 事件,以下统称 hover)于文字链接后,文字颜色是“逐渐”变亮的,虽然只有那短短的 0.x 秒,但也足以引起我思考。 一淘的 transition 效果。每秒33帧,录得有点偏快 这个效果有啥好? Macbook 关上盖子的时候,呼吸灯的效果就像一个人在睡眠时候的呼吸频率,多么安逸舒适的感觉啊。 hover 加入 transition,就像一盏呼吸灯 —— 温柔不突兀的把状态反馈给用户。 实现方法 W3C标准中对css3的transition这是样描述的: CSS 的 transition 允许 CSS 的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发,并圆滑地以动画效果改变 CSS 的属性值。 后来在捣鼓一个 WordPress 主题的时候,被我发现了这个效果的实现方法,代码例子如下: a { color: #49aca5; text-decoration: none; transition: all 0.4s linear; -moz-transition: all 0.4s linear; -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; } a:hover { color: inherit; transition: all 0.4s linear; -moz-transition: all 0.4s linear; -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; } 渐变的意义 代码里面的 0.4s 是代表 transition-duration,是用来指定元素转换过程的持续时间。一般持续时间不需要太长,大概只需0.2-0.3s,为了避免出现「粘滞感」,最好不超 0.5s。 至于我博客设置的是 0.4s,则因为博客是提供阅读的媒介,需要缓和的气氛与场景,慢节奏的呼吸效果更贴合这个使用场景。 一淘没设置鼠标移移出效果,后来发现大部分使用了这效果的网站都这样,可能是因为用户 hover 链接后,都会点击,而不会专心看到鼠标移开后的效果吧。 而我就决定在自己博客代码里面加上了鼠标移开效果(代码如上),其实就是复制多一次而已。 为啥呢?我不希望只有「吸」而没有「呼」,想让这个过程更柔和,更合理;而且我本身就是一个喜欢鼠标跟随阅读视线走的人,因此鼠标在链接上游走时会有蜻蜓点水般的效果,比生硬地「闪走」不知优雅多少倍。 会跳舞的图片 了解文字链的 transition 效果后,紧接着就是 transform,因此很自然就想到了另外一个 hover 效果——上浮效果,我真不知该怎么起名,请原谅……反正很难用言语来表达,请看图 感觉如何?这样做有很好的隐喻效果:在现实世界中,当一个物体能够被凌空提起,它的下方必定会有阴影,悬停图片后就有一个上浮效果,说明这个图片可以点击并“提起来”放大观看。 当然「被提起」的幅度(阴影值)可以再优化。 代码如下: article.post .content-inner img { -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; } article.post .content-inner img:hover {…

默认网页选中文字那些都是蓝色的,今天我给它换了种非常骚的黄色。 代码非常简单: ::selection {background:#FFFF00}::-moz-selection {background:#DFFFF00} CSS3 ::selection 选择器: 使被选中的文本变色,一般改底色或者字体颜色。 IE9+、Opera、Google Chrome 以及 Safari 中支持 ::selection 选择器。 Firefox 支持替代的 ::-moz-selection。 这是求助帖!!! 为毛我这样会有蓝色乱入呢?别人家的不会。。   这个是别人家的。。。同样简单的两句CSS,实在想不出哪里出问题?

短微博、状态,以及QQ空间那样的说说,以其简短的风格形式受到很多网友欢迎,在wordpress上如何实现这种形式呢?微博主题应运而生,但是为了实现这一功能就去换个主题不太划算,而且大部分文章还是以正常形式展现的,那么使用wordpress的用户如何在自己的网站中制作一个类似的展示页呢?下文将作详细介绍。 效果预览:http://kouss.com/suisui/ 给文章添加一个分类目录 添加一个文章分类,所有的类似文章都放入这个分类,例如分类名可以设为“吐槽”,别名为“tucao”,具体名字你可以根据自己喜好设置。 指定不同文章分类使用不同模版 一般情况下,wordpress首页模板就是展示所以文章,这和我们要求的模板功能类似,但是如何为“吐槽”分类目录调用单独的模板呢?Wordpress有一个功能,分类目录的模板会自动搜寻“category-分类英文别名.php”模板,所以请复制首页模板index.php文件一份,重命名为category-t.php,注意t为之前设置的分类别名,如果你设置了别的,请相应改成你所设置的。打开category-t.php作样式编辑,去掉不需要的内容组件,例如文章分类模块就不要显示了,发布时间模板也可以改成更类似微博的风格,如果你要去更高,可以添加一些css样式。 2015年6月19日补充:如果上述方式没办法成功调用模版,请继续百度:WordPress不同分类设置不同模版! 首页优化不显示“吐槽”的文章 这个仅仅需要修改首页index.php模板即可,百度看看《WordPress首页不显示特定分类文章》就行了。 在多梦主题中,后台可以直接设置不显示。先看看你用的主题支不支持,免得折腾。 至此,基本功能已经实现,接下来,请在发布文章时一定要选择“吐槽”作为分类,更好的页面的样式则根据自身需求作调整。 如果经常发这种短微博文章,还可以在WordPress-设置-撰写设置,把“默认文章分类目录”改为“吐槽”。这样不用每次发布都选分类了。 使用WordPress手机端 平时发微博,大多数都是即兴和随手拍的,而在WordPress上一样可以用手机随时随地发文章。 下载地址:http://pan.baidu.com/s/1hq7vtqs(已经很旧了,自己去找新的吧!) 词穷了,来几张截图结束吧。    

WordPress模板的定义非常方便,但是在定制模板之前,我们有必要知道WordPress的模板层次,了解WordPress是如何加载模板文件的,这将有利于开发模板时合理利用资源及提高工作效率。 万能的index.php 通过“WordPress主题构成”这篇文章,我们已知道一个最简单的WordPress主题只需要 style.css 和 index.php 文件即可。这代表着 index.php 可以是任何一个页面的模板,无论是首页,还是文章页,或是分类页,再或者是搜索结果页面,它都能完美胜任。 也就是说,当对应的模板不存在时, index.php 将是WordPress最后的底牌。 模板加载顺序 下面让我们来了解一下WordPress都是怎么加载模板的 首页 首先WordPress会先检查是否有静态首页,如果有静态首页,就会加载这个页面内容并通过 front-page.php 模板文件展示,如果没有这个模板文件,就会通过页面模板展示 如果没有静态首页,就会加载 home.php  最新文章模板 如果没有 home.php 则加载 index.php 模板 文章页 首先被考虑的是 single-{post_type}.php 这样一个模板文件(如文章类型是 product 那么对应的文件名就是 single-product.php ) 如果找不到,那么就会加载 single.php 模板 如果连 single.php 模板都没有则加载 index.php 模板。 页面 首先被考虑的是自定义模板,也就是编辑页面时所选择的模板 如果没有自定义模板,则查找 page-{slug}.php 别名模板(如页面别名是 about 对应的文件名就是page-about.php ) 如果别名模板也没有就查找 page-{id}.php ID模板(如页面ID是 2 对应的文件名就是 page-2.php) 如果ID模板也没有那就是 page.php 模板了 如果连 page.php 模板都没有则加载 index.php 模板 分类页 首先被考虑的是 category-{slug}.php 别名模板(如分类别名是 news 对应的文件名就是 category-news.php ) 如果没有别名模板则查找 category-{id}.php ID模板(如分类ID是 1 对应的文件名就是 category-1.php ) 如果ID模板也没有那就是 category.php 分类模板了 如果 category.php 分类模板也没有则加载 archive.php 通用归档模板 如果连 archive.php 通用归档模板都没有则加载 index.php 模板 标签页 标签页模板加载顺序和分类页一样,只不过前缀不过 category 而是 tag (如 tag-{slug}.php)。 自定义分类法 有时候除了WordPress默认的分类目录和标签我们还需要其他的分类方法,这时候我们就会注册一个新的分类法,那么在此之前知道分类法的模板加载顺序也是十分必要的。以下说明假设自定义分类法是 people 这个名字: 分类法分类页首先被考虑的是 taxonomy-{taxonomy}-{term}.php 别名模板(如分类别名 teacher 对应的文件名就是 taxonomy-people-teacher.php ) 如果没有别名模板,则加载该分类法归档页(如 taxonomy-people.php ) 如果分类法归档页模板也没有则加载 archive.php 通用归档模板 如果连 archive.php 通用归档模板都没有则加载 index.php 模板 自定义文章类型 除了自定义分类法,有时候我们也需要自定义文章类型 自定义文章类型归档页首先被考虑的是 archive-{post_type}.php 别名模板(如文章类型是 product那么对应的文件名就是 archive-product.php ) 如果没有别名模板则加载 archive.php 通用归档模板 如果连 archive.php 通用归档模板都没有则加载 index.php 模板 作者归档页 首先被考虑的是 author-{nicename}.php 别名模板(如作者用户名是 steven 那么对应的文件名就是author-steven.php ) 如果没有别名模板则加载 author-{id}.php ID模板(如作者ID是 1 对应的文件名就是 author-1.php)…