Coder Social home page Coder Social logo

hexo-renderer-org's Introduction

https://travis-ci.org/CodeFalling/hexo-renderer-org.svg https://badge.fury.io/js/hexo-renderer-org.svg

Table of Contents

hexo-renderer-org

Hexo renderer plugin for emacs org-mode

中文动态:标签: hexo-renderer-org | M-x codefalling

Usage

Cd to your hexo blog.Run

npm install https://github.com/CodeFalling/hexo-renderer-org#emacs --save

You can also install it from npm,too.

Then restart your hexo server.

Options

You can configure this plugin in _config.yml.

org:
  emacs: '/Applications/Emacs.app/Contents/MacOS/Emacs'
  common: |
          #+OPTIONS: toc:nil
          #+BIND: org-html-postamble \"Last Updated %C.</br>Render by <a href='https://github.com/CodeFalling/hexo-renderer-org'>hexo-renderer-org</a> with %c\"
  cachedir: './hexo-org-cache/'
  1. emacs is execute file of emacs
  2. common is common org content or you want to insert before renderer every org file.This is a example to disable toc.
  3. cachedir is where your cache file located.With this option hexo-org-renderer will enable cache. Recommend for a much faster speed. Default enable.

A more functional example

org:
    emacs: '/Applications/Emacs.app/Contents/MacOS/Emacs'  
    common: |
            #+OPTIONS: toc:nil num:nil
              <script>
                function editAtGithub(isRaw){
                  var url_parts = document.location.pathname.split('/');
                  var postname = url_parts[url_parts.length - 2];
                  if(url_parts.length == 3){ // is a page(wiki about etc)
                    postname = postname + '/index.org';
                  }else{
                    postname = '_posts/' + postname + '.org';
                  }
                  var url = 'https://github.com/CodeFalling/codefalling.com/tree/source/source/' + postname;
                  if(isRaw)
                    url = 'https://raw.githubusercontent.com/CodeFalling/codefalling.com/source/source/' + postname;
                  window.open(url);
                }
              </script>
            #+BIND: org-html-postamble \"<div style='font-size: 14px;padding: 5px;line-height: 20px;border: 1px solid;'><a href='javascript: editAtGithub();'>Edit Me at Github</a> - <a href='javascript: editAtGithub(true)'>Org Source</a> - Last Updated %C.</br>Render by <a href='https://github.com/CodeFalling/hexo-renderer-org'>hexo-renderer-org</a> with %c</div>\"

This example add a Edit Me at Github - Org Source at every org page.

How to create new post

Create balbala.org in source/_posts/,there is a template:

#+TITLE: Hello,orgmode
#+DATE: <2015-11-15 Sun 17:00>
#+TAGS: emacs, orgmode, hexo
#+LAYOUT: post
#+CATEGORIES: orgmode
* Orgmode
** Why org
#+BEGIN_SRC js
console.log('hello');
#+END_SRC
我编不下去了。。

Q&A

How to add Read more button?

Place

#+BEGIN_HTML
<!--more-->
#+END_HTML

in where you would like to add a Read more

How to set caption of image?

Hexo use `alt` as title of image.

So just use

#+ATTR_HTML:  :alt caption
[[image url]]

Old pure-js version

See CodeFalling/hexo-renderer-org at old-js-version for old pure-js version.

Front-matter not work?

Orgmode has its own way to describe meta info of post,such as title,date etc.

Front-matterOrgmodeValue
layout#+LAYOUTpost/page
title#+TITLEstring
date#+DATE<2015-11-16 Mon 20:45>, you can use M-x org-time-stamp in emacs
comments#+COMMENTSyes/no
tags#+TAGStag1, tag2, tag3
categories#+CATEGORIES

How to enable line number?

Config in your _config.yml

highlight:
  enable: true
  number: false

Disable number of outline

org:
  common: |
          #+OPTIONS: num: nil

hexo-renderer-org's People

Contributors

xcodebuild avatar

Watchers

James Cloos avatar iiw avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.