Skip to content

Instantly share code, notes, and snippets.

@heardk
Last active December 11, 2016 14:49
Show Gist options
  • Save heardk/cd4452b167fdd06fb374 to your computer and use it in GitHub Desktop.
Save heardk/cd4452b167fdd06fb374 to your computer and use it in GitHub Desktop.
Resume for Tumblr Customizations
<div id="restarget">Loading…</div>
<script id="restemplate" type="x-tmpl-mustache">
<h1>{{ header.name }}
<h2>{{ header.title }}
<h3> {{ header.email }}
<p>{{ overview.text }}
</script>
$(document).ready(function() {
//$("#restarget").ready( function() {
$.ajax({
url: "https://api.github.com/gists/f66ab1397c9b45c7f694",
dataType: "jsonp",
success: function(returndata) {
var template = $('#restemplate').html();
var rendered = Mustache.render(template, JSON.parse(returndata.data.files.resumejson.content));
$('#restarget').html(rendered);
},
error: function(error) {
$('#restarget').html("Error getting data");
console.log(error);
}
});
//});
});
<!-- Add the following tag to the top of the theme html, with the others. Under Edit Theme add full url to the data -->
<!-- http://full/url/path/to/raw/json -->
<meta name='text:Data URL' content=''/>
<!-- Insert reference to mustache and the mustache template. All script includes are at the bottom of the theme html -->
{block:IfDataURL}
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.1.2/mustache.min.js"></script>
<script id="template" type="x-tmpl-mustache">
<h1>{{ header.name }}</h1>
<h2>{{ header.title }}</h2>
<div class="overview">
<p> {{ overview.text }} </p>
<div class="overview-left">
<h3>Technology-focused Skills</h3>
<ul>
{{ #overview.technology-expertise }}
<li>{{ . }}</li>
{{ /overview.technology-expertise }}
</ul>
</div>
<div class="overview-right">
<h3>Business-focused Skills</h3>
<ul>
{{ #overview.business-focused-expertise }}
<li>{{ . }}</li>
{{ /overview.business-focused-expertise }}
</ul>
</div>
</div>
<div class="experience">
<h2>Experience</h2>
{{ #experience }}
<div class="co-title">{{ company.title }}</div>
<div class="co-name">{{ company.company }}</div>
<div class="co-location">{{ company.location }}</div>
<div class="co-overview">{{ company.overview }}</div>
<div class="co-highlights">
<ul>
{{ #company.highlights }}
<li>{{ . }}</li>
{{ /company.highlights }}
</ul>
</div>
{{ /experience }}
</div>
<div class="education">
<h2>Education</h2>
<div class="ed-name">{{ education.college.name }}</div>
<div class="ed-location">{{ education.college.location }}</div>
<div class="ed-program">{{ education.college.program }}</div>
<h2>Coursework</h2>
<ul>
{{ #education.coursework }}
<li>{{ . }}
{{ /education.coursework }}
</ul>
<h2>Certifications</h2>
<ul>
{{ #education.certifications }}
<li>{{ . }}
{{ /education.certifications }}
</ul>
</div>
</script>
{/block:IfDataURL}
<!-- Add a target div to display the content on a new page -->
<div id="target">Loading…</div>
<!-- Add the JS to load the data and render the template. Add to the existing $(document).ready function -->
{block:IfDataURL}
$("#target").ready( function() {
$.ajax({
url: "{text: Data URL}",
dataType: "text",
success: function(returndata) {
var template = $('#template').html();
var rendered = Mustache.render(template, JSON.parse(returndata));
$('#target').html(rendered);
},
error: function(error) {
console.log(error);
$('#target').html("Error fetching Data");
}
});
});
{/block:IfDataURL}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment