Home > Developer > Web Develop
Added the resume type to Hexo under the Pacman topic, pacmanhexo
Original http://blog.13kbook.com/2015/01/02/add-resume-type-to-hexo-under-pacman-theme/
BackgroundAlthough I am not looking for a job for the moment, thinking about my resume is also a good thing to sell myself to others. Then I thought about something new, so I thought about writing a resume.
The format is not limited, but must be online, preferably very concise.
Since it is online, you can simply use the blog directly and put it on it.
Since Markdown is used for blog writing, you can directly use Markdown for your resume. One is online rendering, and the other is a lot of tools for generating PDF files. There are several good tools for searching Github.
Because the topic used is Pacman, it should be changed directly based on it. Although the webpage is only known, it does not prevent modification.
Let's take a look at the final effect. Resume effect. Is it concise, achieving the expected results. Hey.
Hexo topics are stored in the themes directory. Download the Pacman topic from Pacman. After the download is complete, refer to the official instructions to set the topic as it.
Then we started construction.
Since it is a resume, I don't want it to appear on the homepage list. That is, do not place the md file in the/source/_ posts folder. Create an about folder and put it in/source/about.
Create a New resume. md file.
Note: I encountered a pitfall in this place. Because md is self-written and not automatically generated by hexo, "--" (three-) of the line after date is not written, then the back end will be pitted, and the normal page cannot be generated. At the same time, the top key value should be added with a space between the colon, many such pitfalls.
Then, follow the normal process and write your resume.
Title: Resume layout: post date: 23:23:59 --- # Wang xiao'er (wangxiaoer # gmail.com) # personal information-undergraduate/XXX University (20XX. 9-20xx.7)/Computer Science and Technology-working life: 2 years-Technical blog: http://xxxxx.com-location: beijing # Work Experience ### wudaokou cosmic center ### XXXX Project (2013.10-to date)-XXXXXXXXXXXXXXXXX-XXXXXXXXXXXXXXXXXXXXXX-xxxxxxxxxxxxxxxxxxxx # skills list: android/Java: C #/WP, Python, HTML, Markdown, etc.It now looks like any common blog style under the Pacman topic.
<% } else if(page.layout=='search'){ %> <%- partial('_partial/head') %> <body>
I think that php may also be mixed before. html code and php code should be mixed together, which is similar here. For the time being, I think this is true.
Since pacman can customize the search attribute, we can also customize a resume attribute. What should I put in it? Same as search nodes?
View the hexo topic attribute layout-related documents at http://hexo.io/docs/themes.html. The content can be displayed only when "<%-body %>" is included.
The commonly used layout value is post or page. Let's take a look at the page and check that there is "<%-body %>", so we can directly copy it and use it again. The difference between post and page can be found through testing that there is a Sidebar on the right side of the post, and there are also some differences in style. In view of the actual situation, the page content is used here.
After the change, you can directly run it to see the effect. Nima, the background is gray, and it cannot be tolerated. It's too ugly. The page type is white, and then the Chrome review element is used. The class id of the content is resume, and the page is page. It should be related to this, and then search, /pacman/source/css/_ partial/article is found. styl. Add. resume in the first line.
Next, we will figure out how to fix the header and tail. The layout file contains a page. copy an ejs file as resume. ejs (processing page data), the/_ partial folder is similar (this is used to process the summary to the home page list ). The/_ partial/post/article. ejs file used in this file is also copied as resume. js. Modify the point in the/layout/resume. ejs file.
The final code is as follows:
<div id="main" class="<%= item.layout %>" itemscope itemprop="blogPost"> <article itemprop="articleBody"> <%- partial('header') %> <div class="article-content"> <%- partial('gallery') %> <% if( table&&(item.toc !== false) && theme.toc.article){ %> <div id="toc" class="toc-article"> <strong class="toc-title"><%= __('contents') %></strong> <%- toc(item.content) %> </div> <% } %> <%- item.content %> </div> </article></div>
Then return to/_ partial/post/article. the resume branch in ejs previously copied the page code. We need to delete some data and consider leaving only "<%-body %>". Run the command and run it in a slot. How can there be garbled characters. It should be because the header has encoding information, which should be considered to be retained. Because there is statistical information at the end, it should also be considered to be retained. In the end, "delete-> View results-> restore" should be taken into consideration ", determine the part to be deleted and keep the Code as follows:
<% } else if(page.layout=='resume'){ %> <% if(page.source.match(/\.md$/)){ %> <%- partial('_partial/head') %> <body> <div id="container"> <%- body %> </div> <div id="footer"><br/></div> <%- partial('_partial/after_footer') %> </body>
The last run is the previous result. Perfect!
At last, set layout to resume when writing a resume. At the same time, it is best not to put the md of the resume under the _ posts directory. If it is put in the directory, it will be included in the homepage list, and there is a certain style problem. The last generated path of/about/resume. md is http: // yourwebsite/about/resume.html. Then add this path to the top navigation bar of the homepage.
Summary
You can not only add the resume attribute, but also add others to expand more custom pages, for example, 404 pages.
It took a night to study, although it was quite interesting to have delayed a lot of time at the three points.
If you have any questions, please feel free to contact me.
I have put the source code on Github (https://github.com/waylife/pacman_with_resume), welcome to star and fork.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
