144 lines
5.0 KiB
HTML
144 lines
5.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>
|
|
Sans ligne éditoriale fixe • Le thème du blog
|
|
</title>
|
|
|
|
<!-- CSS -->
|
|
<link rel="stylesheet" href="/assets/fonts.css">
|
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
|
|
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
|
|
<link rel="stylesheet" href="/assets/tale.css">
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon.png">
|
|
<link rel="feed" href="/rss.xml" type="application/rss+xml" title="Sans ligne éditoriale fixe" />
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="nav">
|
|
<div class="nav-container">
|
|
<a href="/">
|
|
<h2 class="nav-title">Sans ligne éditoriale fixe</h2>
|
|
</a>
|
|
|
|
<ul>
|
|
<li><a href="/pages/uhl">UHL</a></li>
|
|
<li><a href="/pages/about">À propos</a></li>
|
|
<li><a href="/archives/">Archives</a></li>
|
|
<li><a href="/tags/">Tags</a></li>
|
|
<li><a href="/rss.xml"><i class="fa fa-rss-square"></i></a></li>
|
|
</ul>
|
|
<div class="site-description"></div>
|
|
|
|
</div>
|
|
</nav>
|
|
<main class="content">
|
|
|
|
<div class="post">
|
|
<h1 class="post-title">Le thème du blog</h1>
|
|
<div class="post-line"></div>
|
|
<div class="post-info">
|
|
<div class="date">
|
|
<time datetime="
|
|
|
|
|
|
Jeudi
|
|
|
|
15
|
|
|
|
septembre
|
|
|
|
2022
|
|
|
|
">
|
|
|
|
|
|
Jeudi
|
|
|
|
15
|
|
|
|
septembre
|
|
|
|
2022
|
|
|
|
</time>
|
|
<span class="fas fa-clock eta"></span>
|
|
|
|
|
|
≈ 2 min
|
|
|
|
|
|
</div>
|
|
<div class="tags">
|
|
<span class="fa fa-tags"></span>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a href="/tags/blog" class="tag">Blog</a>
|
|
|
|
|
|
</div>
|
|
<br />
|
|
|
|
</div>
|
|
<article>
|
|
<p>J'ai un peu cherché un thème qui me plairait pour ce blog, mais sans trouver mon bonheur. J'ai donc fait le mien avec mes faibles, très faibles, connaissances en design.</p>
|
|
<h2 id="le-plan-etait-simple">Le plan était simple</h2>
|
|
<ul>
|
|
<li>Un petit menu pour le lien vers le flux <a href="/rss.xml">RSS</a> et une page pour la collection <a href="coincoin/pages/uhl/">UHL</a>.</li>
|
|
<li>Pas d'images pour le thème.</li>
|
|
<li>Des couleurs pas trop classiques. </li>
|
|
<li>Les cinq derniers <em>posts</em> sur la première page. </li>
|
|
</ul>
|
|
<h2 id="preparation-de-l-environnement-de-developpement">Préparation de l'environnement de développement</h2>
|
|
<p>En prérequis, il faut au moins la version 14 de nodejs et Debian 11 ne propose que la version 12 pour le moment.</p>
|
|
<p>Donc pour avoir la bonne version, j'ai ajouté un dépôt :</p>
|
|
<pre data-lang="bash" style="background-color:#2b303b;color:#c0c5ce;" class="language-bash "><code class="language-bash" data-lang="bash"><span style="color:#bf616a;">su -c </span><span>'</span><span style="color:#a3be8c;">curl -sL https://deb.nodesource.com/setup_14.x | bash -</span><span>'
|
|
</span><span style="color:#bf616a;">apt</span><span> update
|
|
</span><span style="color:#bf616a;">apt</span><span> install nodejs
|
|
</span></code></pre>
|
|
<p>Maintenant qu'on a la base, il faut installer <em>Ghost</em> localement. J'ai suivi la <a href="https://ghost.org/docs/install/local/">documentation officielle</a>.</p>
|
|
<p>Une fois tout ça installer, on accède à <em>Ghost</em> à l'adresse suivante : http://localhost:2368/</p>
|
|
<h2 id="le-developpement-en-lui-meme">Le développement en lui-même</h2>
|
|
<p>Je me suis appuyé sur ces deux tutoriels : <a href="https://ryanfeigenbaum.com/ghost-theme-starter/">1</a> et <a href="https://www.christhefreelancer.com/ghost-theme-development-guide/">2</a>.</p>
|
|
<p>J'ai téléchargé un *template *avec une structure de base que j'ai adaptée selon mes besoins. Le moteur de <em>template</em> utilisé est <a href="https://handlebarsjs.com/guide/">handlebar</a> qui se modifie très bien. </p>
|
|
<p>Une fois arrivé au résultat escompté, il suffit d'exporter le <em>template</em> en format zip pour l'importer sur le blog en production.</p>
|
|
<p>Le résultat est trouvable <a href="https://gitea.fery.me/king/slef-theme">ici</a>.</p>
|
|
|
|
</article>
|
|
</div>
|
|
<div class="pagination">
|
|
|
|
|
|
</div>
|
|
|
|
</main>
|
|
<footer>
|
|
<!-- <p><span class="external-icons"> -->
|
|
<!-- <a href="https://twitter.com/geobomatic"><i class="fab fa-twitter"></i></a> · -->
|
|
<!-- <a href="https://github.com/Geobert"><i class="fab fa-github"></i></a> · -->
|
|
<!-- <a href="https://www.flickr.com/photos/geobmcfly/"><i class="fab fa-flickr"></i></a> -->
|
|
<!-- </span></p> -->
|
|
<span>
|
|
© 2022 Yann Fery •
|
|
<a href="/pages/mentions-legales">Mentions légales</a> •
|
|
|
|
Propulsé par
|
|
|
|
<a href="https://getzola.org/">Zola</a> avec un template de <a href="https://github.com/Geobert/blog/">Geobert</a>.
|
|
</span>
|
|
</footer>
|
|
</body>
|
|
|
|
</html>
|