• 发表于：
  • 分类： Bitcron

虽然并没有技术可言，就当自己做个笔记吧，搞博客这么多年，前前后后也换了好多平台，模板也自己折腾了一些，并没有留下什么，实在惭愧啊。

所谓的标签云就是一堆标签链接，可能在一起看起来像一坨云？Bitcron 提供了获取网站所有标签的方法site.tags,然后在遍历生成链接就可以咯。

for tag_name, tag_count in site.tags
    a(href="/tag/{{tag_name|urlencode()}}")= tag_name

这里用urlencode()编码了一下tag_name，因为如果出现’C#’这种标签的话，不编码会链接到’C’标签。

为了体现标签下的文章多少，可以通过tag_count来设置链接字体的大小，玩得转的还可以设置颜色啊字体粗细什么的。

for tag_name, tag_count in site.tags
    a(href="/tag/{{tag_name|urlencode()}}",style="font-size: {{tag_count*1.5+12 }}px;")= tag_name

最后效果大概就是这样！
tags-cloud

来只另一个博客程序Hexo,这个模板貌似人气很高。。。名为Next，源项目在这里,感谢作者的设计。目前自己用的代码太乱，所以暂时不支持克隆，等空了复刻一个Farbox能通用的出来。

  • 发表于：
  • 分类： Farbox

案例

网站template目录下新建一个funny.html的文件，欲作为站点分类（根目录下的funny文件夹）“趣事”的所有日志合集，也就是funny.html 文件内要调用funny文件夹内的所有文章不想有其他分类文章出现，想问下代码要怎么写。

分析

实际就是获取特定路径path下的文章post。
最新的 Farbox 整合了获取数据的方法，无论是获取文章还是分类都使用get_data()这个函数。这里需要传递type和path两个参数，get_data(type='post',path='funny/')

- 阅读剩余部分 -

  • 发表于：
  • 分类： Farbox

既然折腾网站，就总想着怎样更快被收录，但简单的 Farbox 针对搜索引擎优化并没有太多的支持，例如给分类添加关键词和描述。那么 Farbox 模版里如何设置分类页面的关键词和描述呢？

官方 API 里提到有专门配置日志默认属性的文件index.txt，同时这个数据对象会作为它所在目录的扩展属性。我们知道 Farbox 的文件夹就是分类，所以我们就可以在index.txt这个文件里设置分类的一些属性啦。

- 阅读剩余部分 -

本文主要通过分析 WordPress 官方主题 twentytwelve 的中的“顶部模板”来了解 WordPress 主题顶部制作需要用到的函数。

顶部模板的代码将应用于 Wordpress 所有的页面，其他页模板需要通过 get_header() 来调用。

<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width" />
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php // Loads HTML5 JavaScript file to add support for HTML5 elements in older IE versions. ?>
<!--[if lt IE 9]>
<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<?php wp_head(); ?>
</head>

- 阅读剩余部分 -

本文主要通过分析 Wordpress 官方主题 twentytwelve 的中的“首页模板”来了解 Wordpress 主题首页制作需要用到的函数。

首页大概可以分为四个个部分，头部，主体，侧边栏，底部。

<?php get_header(); ?>

get_header()：获取头部模板(header.php)文件中的内容，头部模板主要包含的是首页中导航栏的代码，以后再详细分析。

- 阅读剩余部分 -

register_nav_menu() 用于 WordPress 中注册导航菜单。

调用

//在 function.php中 调用
<?php register_nav_menu( $location, $description ); ?>

参数

<?php register_nav_menu( 
      $location,//菜单的名称
      $description //菜单的描述
      );
?>

同时注册多个导航菜单要用到 register_nav_menus() 函数

<?php
register_nav_menus( array(
    'menu1' => '菜单一',
    'menu2' => '菜单二'
) );
?>

另外，注销导航菜单要用到 unregister_nav_menu( $location ) 函数，可以用在子主题的 function.php 中。

添加菜单

add_menu_page()：添加一个顶级菜单

<?php   
add_menu_page( $page_title, //菜单页标题
               $menu_title, //菜单标题
               $capability, //访问权限
               $menu_slug,  //菜单别名
               $function,   //执行函数
               $icon_url,   //菜单图标
               $position    //菜单位置
             );
?>

add_submenu_page()：添加一个子菜单

<?php   
add_submenu_page( $parent_slug, //父菜单别名
                  $page_title,  //菜单页标题
                  $menu_title,  //菜单标题
                  $capability,  //访问权限
                  $menu_slug,   //菜单别名
                  $function    //执行函数
                );
?>

- 阅读剩余部分 -

12