me/portfolio
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update Young Reporter article generator

Browse Source
This commit is contained in:
Matthew Grove
2020-12-13 10:59:54 +00:00
parent 31eff6d382
commit b580c0e080
6 changed files with 167 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
_site/comsci/index.html
+1 -1
View File
@@ -64,7 +64,7 @@
<li><a href="/young-reporter/" >BBC Young Reporter Article Creator</a></li> <li><a href="/young-reporter/" >BBC Young Reporter Article Generator</a></li>
_site/index.html
+2 -2
View File
@@ -64,7 +64,7 @@
<li><a href="/young-reporter/" >BBC Young Reporter Article Creator</a></li> <li><a href="/young-reporter/" >BBC Young Reporter Article Generator</a></li>
@@ -116,7 +116,7 @@
<div class="content"> <div class="content">
<header> <header>
<a href="/young-reporter/" class="icon fa-comment"><span class="label"></span></a> <a href="/young-reporter/" class="icon fa-comment"><span class="label"></span></a>
<h3>BBC Young Reporter Article Creator</h3> <h3>BBC Young Reporter Article Generator</h3>
</header> </header>
<p>A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website.</p> <p>A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website.</p>
<a href="/young-reporter/" class="button small">See more</a> <a href="/young-reporter/" class="button small">See more</a>
_site/luhn-algorithm/index.html
+1 -1
View File
@@ -64,7 +64,7 @@
<li><a href="/young-reporter/" >BBC Young Reporter Article Creator</a></li> <li><a href="/young-reporter/" >BBC Young Reporter Article Generator</a></li>
_site/site-theme/index.html
+1 -1
View File
@@ -64,7 +64,7 @@
<li><a href="/young-reporter/" >BBC Young Reporter Article Creator</a></li> <li><a href="/young-reporter/" >BBC Young Reporter Article Generator</a></li>
_site/young-reporter/index.html
+81 -11
View File
@@ -15,7 +15,7 @@
<!-- add to homescreen for Safari on iOS --> <!-- add to homescreen for Safari on iOS -->
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="BBC Young Reporter Article Creator"> <meta name="apple-mobile-web-app-title" content="BBC Young Reporter Article Generator">
<link rel="apple-touch-icon-precomposed" href="https://mgrove.uk/logo.png"> <link rel="apple-touch-icon-precomposed" href="https://mgrove.uk/logo.png">
<!-- tile icon & colour for Windows 8 --> <!-- tile icon & colour for Windows 8 -->
@@ -23,7 +23,7 @@
<meta name="msapplication-TileColor" content="#26174e"> <meta name="msapplication-TileColor" content="#26174e">
<!-- page info --> <!-- page info -->
<title>BBC Young Reporter Article Creator | Matthew Grove</title> <title>BBC Young Reporter Article Generator | Matthew Grove</title>
<meta name="description" content="A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website. | by Matthew Grove"> <meta name="description" content="A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website. | by Matthew Grove">
<meta name="keywords" content="" /> <meta name="keywords" content="" />
@@ -65,7 +65,7 @@
<li><a href="/young-reporter/" class="current-page-link" <li><a href="/young-reporter/" class="current-page-link"
>BBC Young Reporter Article Creator</a></li> >BBC Young Reporter Article Generator</a></li>
@@ -92,16 +92,18 @@
<!-- Heading --> <!-- Heading -->
<div id="heading"> <div id="heading">
<h1>BBC Young Reporter Article Creator</h1> <h1>BBC Young Reporter Article Generator</h1>
</div> </div>
<!-- Main --> <!-- Main -->
<section id="main" class="wrapper"> <section id="main" class="wrapper">
<div class="inner"> <div class="inner">
<div class="content"> <div class="content">
<p>Fill in the fields below, and then click the <em>download</em> button to create a file to be uploaded to Reading School’s BBC Young Reporter website.</p> <h3 id="instructions">Instructions</h3>
<p>Give the authors’ names in the format <code class="language-plaintext highlighter-rouge">First_Name Last_Initial</code>, and separate multiple authors with a comma - e.g. <code class="language-plaintext highlighter-rouge">John D, Emma S</code></p> <p>Fill in the fields below, and then click the <em>download</em> button to generate a file to be uploaded to Reading School’s BBC Young Reporter website.</p>
<p>Give the authors’ names in the format <code class="language-plaintext highlighter-rouge">First_Name Last_Initial</code>, and separate multiple authors with a comma - e.g. <code class="language-plaintext highlighter-rouge">John D, Emma S</code>.</p>
<ul> <ul>
<li>If there are any headings inside your article, please place <code class="language-plaintext highlighter-rouge"># </code> in front of them.</li> <li>If there are any headings inside your article, please place <code class="language-plaintext highlighter-rouge"># </code> in front of them.</li>
@@ -130,11 +132,11 @@
<p>Other formatting can be done with the following:</p> <p>Other formatting can be done with the following:</p>
<ul> <ul>
<li>For italics, use <code class="language-plaintext highlighter-rouge">*my italic text*</code></li> <li>For italics, use <code class="language-plaintext highlighter-rouge">*my italic text*</code>.</li>
<li>For bold, use <code class="language-plaintext highlighter-rouge">**my bold text**</code></li> <li>For bold, use <code class="language-plaintext highlighter-rouge">**my bold text**</code>.</li>
<li>For bold and italics, use <code class="language-plaintext highlighter-rouge">***my bold, italic text***</code></li> <li>For bold and italics, use <code class="language-plaintext highlighter-rouge">***my bold, italic text***</code>.</li>
<li>For links, use <code class="language-plaintext highlighter-rouge">[text to show in article](URL)</code></li> <li>For links, use <code class="language-plaintext highlighter-rouge">[text to show in article](URL)</code>.</li>
<li>To include an extra image (besides the cover image), use</li> <li>To include an extra image (besides the cover image), use:</li>
</ul> </ul>
<pre><code>{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}</code></pre> <pre><code>{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}</code></pre>
<p>replacing <code class="language-plaintext highlighter-rouge">ID_OF_IMAGE</code> with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image).</p> <p>replacing <code class="language-plaintext highlighter-rouge">ID_OF_IMAGE</code> with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image).</p>
@@ -143,6 +145,68 @@
<p>Any extra images for your article must be in the format: <code class="language-plaintext highlighter-rouge">ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg</code>, where you replace <code class="language-plaintext highlighter-rouge">ARTICLE_FILE_NAME</code> with the file name you used for the cover image, and <code class="language-plaintext highlighter-rouge">IMAGE_ID</code> with the ID you gave the image when you inserted it into your article’s body, as seen above. E.g.: <code class="language-plaintext highlighter-rouge">news-article--extra-1.jpg</code>.</p> <p>Any extra images for your article must be in the format: <code class="language-plaintext highlighter-rouge">ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg</code>, where you replace <code class="language-plaintext highlighter-rouge">ARTICLE_FILE_NAME</code> with the file name you used for the cover image, and <code class="language-plaintext highlighter-rouge">IMAGE_ID</code> with the ID you gave the image when you inserted it into your article’s body, as seen above. E.g.: <code class="language-plaintext highlighter-rouge">news-article--extra-1.jpg</code>.</p>
<hr />
<h3 id="example">Example</h3>
<pre><code># Headline
## Heading2
### Heading3
#### Heading4
##### Heading5
###### Heading6
Some text.
1. Numbered item 1
2. **Numbered item 2**
* *Bullet 1*
* Bullet 2
***Bold &amp; italics***
A link to [Google](https://google.com).</code></pre>
<p>Will produce:</p>
<blockquote>
<h1>Headline</h1>
<h2>Heading2</h2>
<h3>Heading3</h3>
<h4>Heading4</h4>
<h5>Heading5</h5>
<h6>Heading6</h6>
<p>Some text.</p>
<ol>
<li>Numbered item 1</li>
<li><b>Numbered item 2</b></li>
</ol>
<ul>
<li><i>Bullet 1</i></li>
<li>Bullet 2</li>
</ul>
<p><b><i>Bold &amp; italics</i></b></p>
A link to <a href="https://google.com">Google</a>.
</blockquote>
<hr />
<h3 id="generator">Generator</h3>
<form onreset="if (!($('form a.submit').hasClass('disabled'))) $('form a.submit').addClass('disabled');"> <form onreset="if (!($('form a.submit').hasClass('disabled'))) $('form a.submit').addClass('disabled');">
<div class="row gtr-uniform"> <div class="row gtr-uniform">
<div class="col-6 col-12-xsmall"> <div class="col-6 col-12-xsmall">
@@ -247,6 +311,12 @@ $("form input[type='text']").keypress(function(event) {
}); });
</script> </script>
<style>
blockquote {
font-style: normal;
}
</style>
</div> </div>
</div> </div>
young-reporter/index.md
+78 -8
View File
@@ -1,13 +1,15 @@
--- ---
title: BBC Young Reporter Article Creator title: BBC Young Reporter Article Generator
description: A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website. description: A tool to create markdown files from news articles and their metadata for uploading to the Reading School BBC Young Reporter website.
layout: default layout: default
icon: comment icon: comment
--- ---
Fill in the fields below, and then click the *download* button to create a file to be uploaded to Reading School's BBC Young Reporter website. ### Instructions
Give the authors' names in the format `First_Name Last_Initial`, and separate multiple authors with a comma - e.g. `John D, Emma S` Fill in the fields below, and then click the *download* button to generate a file to be uploaded to Reading School's BBC Young Reporter website.
Give the authors' names in the format `First_Name Last_Initial`, and separate multiple authors with a comma - e.g. `John D, Emma S`.
* If there are any headings inside your article, please place `# ` in front of them. * If there are any headings inside your article, please place `# ` in front of them.
* For subtitles, use `## `, as so on for smaller headings, up to and including `###### `. * For subtitles, use `## `, as so on for smaller headings, up to and including `###### `.
@@ -33,11 +35,11 @@ will produce:
Other formatting can be done with the following: Other formatting can be done with the following:
* For italics, use `*my italic text*` * For italics, use `*my italic text*`.
* For bold, use `**my bold text**` * For bold, use `**my bold text**`.
* For bold and italics, use `***my bold, italic text***` * For bold and italics, use `***my bold, italic text***`.
* For links, use `[text to show in article](URL)` * For links, use `[text to show in article](URL)`.
* To include an extra image (besides the cover image), use * To include an extra image (besides the cover image), use:
<pre><code>{% raw %}{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}{% endraw %}</code></pre> <pre><code>{% raw %}{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}{% endraw %}</code></pre>
replacing `ID_OF_IMAGE` with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image). replacing `ID_OF_IMAGE` with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image).
@@ -45,6 +47,68 @@ The cover image for your article must be a JPEG image, and have the `jpg` file e
Any extra images for your article must be in the format: `ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg`, where you replace `ARTICLE_FILE_NAME` with the file name you used for the cover image, and `IMAGE_ID` with the ID you gave the image when you inserted it into your article's body, as seen above. E.g.: `news-article--extra-1.jpg`. Any extra images for your article must be in the format: `ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg`, where you replace `ARTICLE_FILE_NAME` with the file name you used for the cover image, and `IMAGE_ID` with the ID you gave the image when you inserted it into your article's body, as seen above. E.g.: `news-article--extra-1.jpg`.
<hr>
### Example
<pre><code># Headline
## Heading2
### Heading3
#### Heading4
##### Heading5
###### Heading6
Some text.
1. Numbered item 1
2. **Numbered item 2**
* *Bullet 1*
* Bullet 2
***Bold & italics***
A link to [Google](https://google.com).</code></pre>
Will produce:
<blockquote>
<h1>Headline</h1>
<h2>Heading2</h2>
<h3>Heading3</h3>
<h4>Heading4</h4>
<h5>Heading5</h5>
<h6>Heading6</h6>
<p>Some text.</p>
<ol>
<li>Numbered item 1</li>
<li><b>Numbered item 2</b></li>
</ol>
<ul>
<li><i>Bullet 1</i></li>
<li>Bullet 2</li>
</ul>
<p><b><i>Bold & italics</i></b></p>
A link to <a href="https://google.com">Google</a>.
</blockquote>
<hr>
### Generator
<form onreset="if (!($('form a.submit').hasClass('disabled'))) $('form a.submit').addClass('disabled');"> <form onreset="if (!($('form a.submit').hasClass('disabled'))) $('form a.submit').addClass('disabled');">
<div class="row gtr-uniform"> <div class="row gtr-uniform">
<div class="col-6 col-12-xsmall"> <div class="col-6 col-12-xsmall">
@@ -148,3 +212,9 @@ $("form input[type='text']").keypress(function(event) {
} }
}); });
</script> </script>
<style>
blockquote {
font-style: normal;
}
</style>