钉子の次元

Dimpurr – an artist, designer and developer from China.

某釘子のWP主題 第一季

记得在开学前夕,某钉子曾无奈地望着手上的各种大坑,对着日益临近的初三昼夜叹息。于是就在那时想起了一直想给博客写个主题,于是……这里就是一篇关于某钉子的第一个 WordPress 试水作的回顾。

Clearison Theme

Clearison Theme

草率的基调大概是一开始就定好的。在只剩下寥寥数天暑假而且作业没写完(活该)的情况下,主题的大致样式在英语课间的十分钟内迅速定下。刚回到家,在本地PHP环境中安上 WordPress ,然后直接在 wp-content 目录开始了代码。

在此之前还稍微回顾了一下自己过往作品的所谓设计风格,直到端详自己个人页的时候看到那个「交互/前端」……交互前端你妹啊!某人顿时掀桌。没错,直到今天才发现,作为自己选择的两个方向,正常开发过程中还要经过的一步视觉,某人完全没有研究……虽说当年还是以平面设计起家的,但是最后一次开PS貌似只是为了P一张同学的恶搞图片,难怪自己的页面都是所谓「简洁平面化」风格。眼前的道路霎时迷茫起来……

咳咳跑题了。说起来当年好不容易觉得能手写出个页面来时就已经有意要做,曾经下载的 WordPress 主题教程仍静静的呆在硬盘里,当然因为那时菜鸟级的技术没看多少就只能放弃。只是重新翻出来时发现里面引用的大量资源已经失效,于是最后还是在官方模版和官方文档之间各种参考完成的模版。

代码自然使用了某人一贯的 HTML5 + CSS3 ,不过很幸运在 IE6 上并不会导致大的错位,只是样式相对难看不少。在此再次向 CSS3 致以崇高的敬意,让某渣渣得以接近没有使用 js ,完全不需要做视觉……

Clearison with IE6

Clearison with IE6

从 AZone 遗留下来的没救的CSS风格被评论说「这应该是代码压缩器的风格」……可是总感觉这样写比规范模式还方便阅读怎么破。况且因为抱着自用模版的想法各种代码都预先写死,还有不少 CSS Hack 是完全忽视可移植性的直接测量像素。就是在这种心不在焉极其遗憾的心态还有螺丝菊苣的不断吐槽下,某钉子把代码完成了。

成功的把主题挂到博客上第二天,初三也开始了。意识到自己还能够勉强摸到电脑之后,某钉子又诞生了要将这个主题发布出去的想法。于是又在数个晚上给主题完善了移动版响应式、后台设置和语言包支持等等之后,以「熟悉使用方法」这样的理由挂在 Github 的项目 Release 了 v1.0 版本。

其中要吐槽的几点,某人在用安卓原生浏览器测试响应式网页时发现网页宽度固定在 max-width 而不能自适应。经过一番查找,被现代浏览器惯坏的某人终于知道了 viewport 这个 meta 的作用……另外后台也因为赶进度无心调试后端,使用方法各种不人性化。在最后某人还试图要提交到 WordPress 的官方主题库,最后看到各种复杂的审核直接放弃……

最后回头看看,大概是因为各种草率和赶进度,实在不甚让人满意。特别是评论框让人觉得略有败笔,其幕后是某钉子对于调试自适应的回避……不过无论如何,这个主题的诞生,宣告了初三的开始,也宣告了某人终于有了可以拿的出台面的勉强算是作品的东西。

  1. 千与琥珀说道:

    一眼看上去,这款主题还是不错的说
    不兼容也罢了,反正现在ie6也没什么人用了

    1. dimpurr说道:

      唔 …… 至少以博客的主要受众来说是木有问题的
      只是偶尔在学校电脑室看到 IE6 时总有种蛋蛋的哀伤啊 ……
      谢谢夸奖喵w

  2. Xloger说道:

    显示不了版本号?

    1. dimpurr说道:

      已经修复了顺序错误的问题 …… 另外貌似你的 8.1 没识别出来,就写的是 Windows NT ……

      妈蛋 感觉 Show-UserAgent 对各种平台的支持性不够好 明天试试 WP-UserAgent 吧 ……

      1. Xloger说道:

        现在这是属于压根看不到浏览器跟平台啊。我这是在安全模式所以是NT吧

        1. dimpurr说道:

          噗 刚才我正在调试所以把插件关了

          我发现还是 WP-UserAgent 支持的多一些,不过后来为了一个小小的移动版兼容问题干脆把整个插件照着重写然后内置到主题里了 ……

          话说刚才为了满足自己奇葩的好奇心增加了爪机端点击查看详细的功能

  3. Muno说道:

    发现热衷于ACG的孩纸真是能说会道的…

    1. dimpurr说道:

      诶诶 是这样子的么 =w=

  4. Ameho说道:

    修改得心都碎了。

    1. Dimpurr说道:

      不好意思,因为赶工和第一次写模板代码实在是乱的可以…… 后来也不怎么想改了
      下次找个时间重写一遍吧,不然实在连自己都写不下去了 ……

      1. Ameho说道:

        不过好歹改完了,期待下次的HTML结构能规范点 = =、

  5. Mr.童说道:

    主题不错,首页怎么做的?

    1. Dimpurr说道:

      唔?首页指的是这个博客的首页么?还是个人页呢

      1. Mr.童说道:

        个人首页

        1. Dimpurr说道:

          啊啊,当初学 JS 时写的,大部分是 CSS 特效,用 jQuery 写了点简单的折叠动画。

  6. 千寻说道:

    给菊苣跪了
    请收好我这个小时的膝盖Orz

    1. Dimpurr说道:

      才不是菊苣呢 趴 ……

  7. 神楽坂雅詩说道:

    这个主题真是超棒呢~
    菊苣加油的说~!

    1. Dimpurr说道:

      谢谢雅诗菊苣肯定w 钉子会加倍努力的个说!
      PS: 来换个友链吧 > <

  8. Thiece说道:

    给初三党跪,同学网页前端设计的,至今我还没拿出一款自己的主题。加油,很不错了的样子。

    1. G's说道:

      嘛,慢慢来~

    2. Dimpurr说道:

      唔 …… 我觉得菊苣乃更厉害耶 Orz
      PS: 也来换个友链吧 > <

      1. Thiece说道:

        好啊,一起交换个友链吧。

  9. Suming说道:

    mark 已收录

    1. Dimpurr说道:

      嗯,谢谢支持~

  10. ILOFI说道:

    ORZ初三党就做的这么神。。。高二蒟蒻来膜拜了。。。

  11. Miiser说道:

    我来看看那个回复有系统和浏览器的是什么插件

    1. Dimpurr说道:

      Clearision 内置的修改版 WP-UserAgent

      1. Miiser说道:

        谢谢

  12. love4taylor说道:

    一直提示更新怎么回事啊

  13. 牧泽说道:

    这款模板确实有趣,但是,已经被我看到了,我要模仿这个创意啦。

  14. 一只丸子入说道:

    。。。赶来学习