分类目录归档:Wordpress

有关Wordpress的一切。主题、插件、代码等

WordPress 插件:WordPress 同步微博

banner-1544x500

插件说明

wp2wb 将你的 WordPress 网站与新浪微博关联,在发布文章时自动将文章同步发布到新浪微博,并且可以选择以普通微博方式发布或者头条文章方式发布。

使用 wp2wb 需要先在 新浪开放平台 创建网站网页应用。

插件下载

安装插件

  1. 下载插件 zip 压缩包,解压并上传到网站 /wp-content/plugins 目录,或者通过在 插件中心 在线下载安装
  2. 插件->已安装的插件 中激活插件
  3. 设置->同步微博设置 中按相关提示设置插件。

阅读全文

TypeNow: Just Type Now

typenow-screenshot

主题说明

TypeNow 根据 WordPress 官方主题 TwentySeventeen 框架结构修改。

主题安装

Clone 或者 下载 Zip 文件 ,上传到 wp-content/themes 文件夹。

仅在以下环境测试可行,其他环境下请自行测试:

  • WordPress 4.7 及以上版本
  • PHP 7.1
  • Chrome 62.0 or Safari 11.0

主题预览

iiiryan.com

主题亮点

  • 更丰富的主题自定义设置选项
  • HighlightJS 代码高亮
  • 文章目录
  • 相关文章
  • 评论验证码
  • 自定义文章样式:aside、status、quotes
  • 自定义页面模板:archive、search
  • 更多精彩期待着你的发现……

第三方资源

HTML5 Shiv, Copyright 2014 Alexander Farkas
Licenses: MIT/GPL2
Source: https://github.com/aFarkas/html5shiv

jQuery scrollTo, Copyright 2007-2015 Ariel Flesler
License: MIT
Source: https://github.com/flesler/jquery.scrollTo

normalize.css, Copyright 2012-2016 Nicolas Gallagher and Jonathan Neal
License: MIT
Source: https://necolas.github.io/normalize.css/

Site title font: Aaargh
License: Creative Commons attribution license
Source: https://www.fontsquirrel.com/fonts/aaargh

Font Awesome icons, Copyright Dave Gandy
License: SIL Open Font License, version 1.1
Source: http://fontawesome.io/

Bundled header image:
– Header Image 1: Photo by Mathieu Barrette on Unsplash
– Header Image 3: Photo by Simon Matzinger on Unsplash
– Header Image 2: Photo by dan carlson on Unsplash
– Archive Page Header Image: Photo by Rob Bates on Unsplash
– About Page Header Image: Photo by Max Langelott on Unsplash
– Search Page Header Image: Photo by Hedi Alija on Unsplash
– Aside Post Featured Image: Photo by Anete Lūsiņa on Unsplash
– Related Post Default Image: Photo by Breather on Unsplash

部分 CSS 样式参考:Pinghsu, A Typecho Theme
License: MIT
Source: https://github.com/chakhsu/pinghsu

WordPress breadcrumbs function
License: MIT
Source: http://dimox.net/wordpress-breadcrumbs-without-a-plugin/

Get copyright time
Source: https://www.gznotes.com/wp-copyrighttime/

Display Metaboxes According to the Current Post Format
Source: https://code.tutsplus.com/tutorials/how-to-display-metaboxes-according-to-the-current-post-format–wp-27970

就这样吧….


原文链接:https://iiiryan.com/wordpress/typenow-just-type-now.html

链接

为WordPress添加一个切换标签插件

create-tabber-widget-splash

如果你的 WordPress 博客中有使用侧边栏(Sidebar),并且你的侧边栏模块又不只一个,那么我想你一定会想到使用可切换的标签将侧边栏中同类的模块整合在一起,这样可以使侧边栏的空间得到最有效的利用,同时也可以让你的主题更加高端、大气。

下面这篇文章中就介绍来实现切换标签的方法,跟着它一步一步来做吧!

教程链接:How To Create A Tab Widget In WordPress

WordPress技巧:实现像Dribbble一样的分页样式

paginate-wordpress-like-dribbble

相信很多人都知道 Dribbble 吧?和某8相比,这才是真正神奇的网站。

在Dribbble中查看某个作品页面时,在页面的右边栏上会以缩略图的形式显示同一作者的前一个作品和后一个作品,这样的导航方式是不是很赞?下面这段代码就可以将这种分页方式移植到WordPress博客中。

<?php $prev = get_previous_post(); $next = get_next_post(); ?>

<div class="float--left folio">
    <a href="<?php echo get_permalink($prev->ID); ?>" title="<?php echo esc_attr($prev->post_title); ?>">
        <?php echo get_the_post_thumbnail($prev->ID, 'thumbnail'); ?>
    </a>
</div>

<div class="float--right folio">
    <a href="<?php echo get_permalink($next->ID); ?>" title="<?php echo esc_attr($next->post_title); ?>">
        <?php echo get_the_post_thumbnail($next->ID, 'thumbnail'); ?>
    </a>
</div>

将上面的代码粘贴到主题目录下single.php文件中你希望它出现的位置,就万事大吉了!

以上代码摘自Square One

博客下一阶段主要计划

主题 MinimalismPro 1.0 已经基本完成了,但是与她相搭配的一些功能还没有完成,所以下一阶段工作将会转移至相关插件的开发上。

以下是几个计划内的插件:

  • Markdown编辑器
  • 博客文章同步到新浪微博(修改)
  • 博客连接微信
  • 结构化数据:文章评分(Post Rating)
  • 未完待续…

    Ryan’s 专用主题:MinimalismPro 1.0

    minimalismpro 1.0 designed for ryan's

    我理解的个人博客

    每个人对于自己的网站都会有一个不同的定位,在我看来,不管是哪一种,内容永远是第一位的,尤其对于个人博客而言。这就是这个主题最初的出发点,并且也会是本站一直坚持的风格。很多时候,除了文章的标题与内容,页面上再出现其他的项目总会让我觉得多余。

    我是有着很深的极简主义情怀的,对于简单、追求细节的事物总是会特别的欣赏。特别喜欢那种即使在一张白纸上,简单的几个线条也让人赏心悦目的感觉。所以,我希望的我博客:就如一张普通的白纸上面记录着我学习、生活的点滴。

    可能现在还相差很远,但这个目标不会变!

    MinimalismPro:简单体现细节

    表面如白纸一般,她却有着十分强大的内心:

    • 基于最新的 WordPress 3.6 设计,中、英文双语言版本。
    • 基于 HTML5 与 CSS3。
    • 采用了自适应网页设计的理念进行设计,在大部分设备上都可以获得十分完美的浏览体验。
    • 不同的文章形式采用不一样的展现样式,体现不一样的关注点。
    • 根据页面内容重新做了SEO优化,对搜索引擎更加友好。
    • 强大的自定义功能:自定义社交媒体链接、自定义广告位。
    • 全新的管理功能菜单。
    • 所有图标使用 web icon font。
    • 集成:自定义文章归档页面。
    • 集成:主要社交媒体分享按钮,包括Twitter、Facebook、Google+、新浪微博、人人网、印象笔记。
    • 集成:根据文章标签自动生成相关文章。
    • 集成:评论回复自动邮件通知。
    • 集成:发表评论验证码,防止垃圾评论困扰。

    阅读全文

    如何从 Google CDN 加载 jQuery

    how-to-load-jquery-from-google-cdn

    默认情况下,WordPress 在主题中会调用系统自带 jQuery 库,但是如果直接从 Google CDN 加载 jQuery 该如何做呢?下面这个简单的方法就可以轻松实现。

    将下面的代码粘贴到主题的 functions.php 文件中:

    function jquery_cdn() {
       if (!is_admin()) {
          wp_deregister_script('jquery');
          wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js', false, '1.8.3');
          wp_enqueue_script('jquery');
       }
    }
    add_action('init', 'jquery_cdn');
    

    OK!搞定,就是这样简单:)!

    代码摘自 wptips.ru

    WordPress技巧:非插件实现高效SEO

    efficient-seo-without-a-plugin

    很多时候为了博客能够更好地被搜索引擎抓取,我们需要做一些SEO方面的优化。当然,有很多插件可以帮助我们来实现,但是如果不想使用插件,这里有一个简单的代码实现的方式,可以使你的博客对搜索引擎更加友好。

    首先,将下面的代码粘贴到主题 functions.php 文件中。

    function basic_wp_seo() {
        global $page, $paged, $post;
        $default_keywords = 'wordpress, plugins, themes, design, dev, development, security, htaccess, apache, php, sql, html, css, jquery, javascript, tutorials'; // customize
        $output = '';
    
        // description
        $seo_desc = get_post_meta($post->ID, 'mm_seo_desc', true);
        $description = get_bloginfo('description', 'display');
        $pagedata = get_post($post->ID);
        if (is_singular()) {
            if (!empty($seo_desc)) {
                $content = $seo_desc;
            } else if (!empty($pagedata)) {
                $content = apply_filters('the_excerpt_rss', $pagedata->post_content);
                $content = substr(trim(strip_tags($content)), 0, 155);
                $content = preg_replace('#\n#', ' ', $content);
                $content = preg_replace('#\s{2,}#', ' ', $content);
                $content = trim($content);
            } 
        } else {
            $content = $description;    
        }
        $output .= '<meta name="description" content="' . esc_attr($content) . '">' . "\n";
    
        // keywords
        $keys = get_post_meta($post->ID, 'mm_seo_keywords', true);
        $cats = get_the_category();
        $tags = get_the_tags();
        if (empty($keys)) {
            if (!empty($cats)) foreach($cats as $cat) $keys .= $cat->name . ', ';
            if (!empty($tags)) foreach($tags as $tag) $keys .= $tag->name . ', ';
            $keys .= $default_keywords;
        }
        $output .= "\t\t" . '<meta name="keywords" content="' . esc_attr($keys) . '">' . "\n";
    
        // robots
        if (is_category() || is_tag()) {
            $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
            if ($paged > 1) {
                $output .=  "\t\t" . '<meta name="robots" content="noindex,follow">' . "\n";
            } else {
                $output .=  "\t\t" . '<meta name="robots" content="index,follow">' . "\n";
            }
        } else if (is_home() || is_singular()) {
            $output .=  "\t\t" . '<meta name="robots" content="index,follow">' . "\n";
        } else {
            $output .= "\t\t" . '<meta name="robots" content="noindex,follow">' . "\n";
        }
    
        // title
        $title_custom = get_post_meta($post->ID, 'mm_seo_title', true);
        $url = ltrim(esc_url($_SERVER['REQUEST_URI']), '/');
        $name = get_bloginfo('name', 'display');
        $title = trim(wp_title('', false));
        $cat = single_cat_title('', false);
        $tag = single_tag_title('', false);
        $search = get_search_query();
    
        if (!empty($title_custom)) $title = $title_custom;
        if ($paged >= 2 || $page >= 2) $page_number = ' | ' . sprintf('Page %s', max($paged, $page));
        else $page_number = '';
    
        if (is_home() || is_front_page()) $seo_title = $name . ' | ' . $description;
        elseif (is_singular())            $seo_title = $title . ' | ' . $name;
        elseif (is_tag())                 $seo_title = 'Tag Archive: ' . $tag . ' | ' . $name;
        elseif (is_category())            $seo_title = 'Category Archive: ' . $cat . ' | ' . $name;
        elseif (is_archive())             $seo_title = 'Archive: ' . $title . ' | ' . $name;
        elseif (is_search())              $seo_title = 'Search: ' . $search . ' | ' . $name;
        elseif (is_404())                 $seo_title = '404 - Not Found: ' . $url . ' | ' . $name;
        else                              $seo_title = $name . ' | ' . $description;
    
        $output .= "\t\t" . '<title>' . esc_attr($seo_title . $page_number) . '</title>' . "\n";
    
        return $output;
    }
    

    完成之后,在上述代码的第三行中 $default_keywords 的值替换为你自己博客的关键词。

    然后,在 header.php 中添加以下代码调用函数:

    <?php echo basic_wp_seo(); ?>
    

    P.S. 可以根据自己的需要对上述代码进行微调,以达到最佳效果。

    以上代码摘自:digwp.com

    日志

    新增:

    1. 自定义设置:可以通过主题后台自定义设置添加社交媒体链接,包括:Facebook、Twitter、Google+、新浪微博、人人网。
    2. 管理菜单:隐藏默认的管理工具条(wp_admin_bar),取而代之的是全新的功能菜单,保留了最有用的。
    3. 文章分享按钮:文章页面添加常用的分享按钮,包括:Facebook、Twitter、Google+、新浪微博、人人网与 Evernote。
    4. 相关文章:文章末尾添加相关文章列表,相关文章依据文章标签产生。

    修改:

    1. 调整评论框样式。
    2. 修改、添加部分 icon 图标。
    3. 调整优化主导航菜单链接样式。
    4. 删除了 Beta 2.0 中添加的像素相对大小单位(rem)。为什么删除?我也不知道,随心吧!
    5. 其他细节优化。

    日志
    wordpress theme minimalismpro screenshot

    The Screenshot of WordPress theme MinimalismPro.

    1. 相册样式:文章页面不再只是显示那小小的缩略图了。(Bassd Bootstrap Carousel
    2. CSS Style:删除了一些重复的样式,代码结构更趋合理。
    3. CSS Style:设置像素相对大小(rem)。
    4. CSS Style:链接增加背景过渡动画。
    5. CSS Style:按钮(submit)、分页导航(page-links)、页面导航(post-nav/paging-nav)及文章形式角标(entry-format-badge)增加 2px 圆角。
    6. CSS Style:增加打印样式。
    7. 颜色微调:#4affff => #00eeff
    8. 增加webicons(Fontello)。
    9. 日志(Aside)类文章末尾添加日期。
    10. 除日志(Aside)类文章外,其余文章页面(Single)文章底部增加一个EOF标记。
    11. 文章页面(Single)增加版权声明:BY-NC-SA