Posted inWordPress 建站 流媒体

WordPress技术：添加虾米电台与豆瓣FM功能[转载]

Posted inWordPress, 建站, 流媒体

教程：

http://jingyan.baidu.com/article/c85b7a642f94f5003bac9537.html

虾米电台：代码

[cc lang=”html”]




[/cc]
虾米FM 演示


豆瓣FM：代码

[cc lang=”html”]




[/cc]
豆瓣FM 演示




Posted inWordPress

WordPress技术：六大WordPress模板框架对比[转载]

Posted inWordPress

我们大多数人都经常会碰到赶工期的问题，为了提高工作效率节省宝贵的时间， 减少不必要的重新发明新轮子的时间，WordPress各种主题框架应运而生使得主题开发变得更加快捷。

这些标准化代码包含了一些基本的结构框架，你只需按自己的需要填补这个框架，可能的话需要调整某些配置。

不管你是使用自己设定的框架还是本文下面列出的几种预制的框架，其核心都是使你不需要一次又一次重复写相同的基本代码。就好比写乐谱一样，已经为你在纸张上画好了线条，你只需要在上面标上各种音阶。

本文列出的所有框架都是完全免费的，可供个人或者商业用户使用。

Child Themes

使用框架的一个好处之一就是可以创建子主题。 WordPress子主题继承了你所选择父框架的所有功能。它们一般只包含两个文件： style.css、 functions.php以及其它图形文件夹、脚本文件夹、子主题其它必要的文件夹。

要创建一个子主题只要上传父框架到wp-content/themes 目录下，然后用下面的代码开始创建你的css 文件。注意：“框架名称（Framework Name）”必须跟父框架文件夹的名称保持一致。

[cc lang=”php”]

/*
Theme Name: Name
Theme URI: http://themesite.com
Description: A description of your theme goes here
Author: Author Name
Author URI: http://authorsite.com/
Template: Framework Name
Version: 1.0
*/

[/cc]

Posted inCSS2/3 WordPress

使用 WordPress 的子主题（Child Themes）功能快速制作自己的主题

Posted inCSS2/3, WordPress

转载自：http://blog.wpjam.com/article/child-themes/

在了解子主题功能之前，先来看一下你在使用 WordPress 的时候是否是这样：不会自己制作主题，只好从网上下载一个，这个主题整体风格比较适合，但是有些小地方不太好，自己只是有一点 CSS 基础，可以修改一些简单的样式。修改的时候，却发现主题文件这么多，里面掺杂各种 PHP、HTML 代码，让人不知道在哪里修改。

太好了，那么我们开始学习子主题吧，子主题就是来解决这个问题的。它可以基于某个主题，继承它的功能和样式，然后让你自己进行简单的代码编写就可以衍生出一个新的版本。你还可以对子主题增加样式、功能等等，不仅仅是修改父主题样式那么简单。

做一个子主题非常简单，只需要用 FTP 什么的新建一个目录，然后增加几个文件就可以。你只需要了解很简单的 HTML 和 CSS 知识就可以修改父主题的样式等，当然当父主题升级之后，子主题样式、功能不会被覆盖失效。所以从这个角度来说，如果你想修改一个主题，你应该用子主题这个功能，而不是直接修改原主题文件。

下面就来具体实践看一下，我们就以 Twenty Twelve 这个主题为例吧，其他的主题都是一样的。

Posted inCSS2/3 HTML/HTML5

资源：Adobe Edge Animate

Posted inCSS2/3, HTML/HTML5

Adobe Edge Animate是adobe公司的一款新型网页互动工具。允许设计师通过HTML5、CSS和JavaScript制作网页动画。无需Flash。Adobe Edge Animate并不会替代Flash。该软件只是为网页设计人员提供了一种工具，帮助他们在不支持Flash的设备（比如苹果iOS设备）上制作网络动画。

Posted inHTML/HTML5 云计算 建站 而立

新技术：SoundCloud前端技术团队分享开发经验

Posted inHTML/HTML5, 云计算, 建站, 而立

转载自：http://www.infoq.com/cn/articles/soundcloud-development-sharing

PS: http://www.infoq.com 是个好网站

 

SoundCloud是世界领先的基于声音分享的社交平台，每个人可以录制并上传自己的声音，同时分享给社区的好友。SoundCloud前端技术团队，不断通过技术的创新来提升用户体验，打造下一代单页面应用，并分享了技术实现的心得体会。

下一代SoundCloud应用（已经在公测状态），尝试使用HTML5 widget实现声音播放器，未来会根据浏览器的兼容性，将老的flash player切换为HTML5 widget。前端技术实现不仅仅是HTML5，构建一个坚实的底层JavaScript框架式是很重要的。

构建单页面应用之JavaScript选型

下一代SoundCloud应用最重要的一个特性是在不打断用户通过导航寻找其他声音的前提下，可以回放之前播放的track（声音片段），这相当于，界面右上方总会悬浮一个迷你播放面板，每当用户想回放上一个track，一次不刷新页面的点击就可以解决问题。这势必会鼓励用户根据当前的页面导航，不断寻求新的内容，此类行为会通过点击完成，每次点击应该保证又快又平滑。在系统层面保证又快又平滑是将下一代应用定位为单页面应用的重要原因（数据通过统一的API获取，前端的展现和用户点击行为，通过前端技术处理以获取更好的体验）。

press button
图1：悬浮按钮[1]

在前端JavaScript技术框架的选型上，SoundCloud推崇Backbone.js，原因除了在手机站点的实践经验外，Backbone.js会对前端进行分层：Views（视图），Data Model（数据）以及Collection（集合）等。剩下的业务逻辑以及组件的具体实现，会留给应用端自己处理，这就意味着应用端有非常大的灵活性。

以生成视图Rendering Views为例，SoundCloud选择Handlebars作为页面模板库，Handlebars与其他模版库相比有以下优势：

  • 模版内部没有具体的逻辑，便于解耦
  • 模版可以通过预编译，获取在浏览器更快的渲染性能（运行时库只有3.3kb大小）
  • 支持自定义custom helpers