https://yacinemehadji.github.io/tags/academic/AcademicHugo Blox Builder (https://hugoblox.com)en-usFri, 27 Oct 2023 00:00:00 +0000https://yacinemehadji.github.io/media/icon_hu_982c5d63a71b2961.pnghttps://yacinemehadji.github.io/tags/academic/https://yacinemehadji.github.io/blog/get-started/Fri, 27 Oct 2023 00:00:00 +0000https://yacinemehadji.github.io/blog/get-started/<p>Welcome 👋</p> <details class="print:hidden xl:hidden" open> <summary>Table of Contents</summary> <div class="text-sm"> <nav id="TableOfContents"> <ul> <li><a href="#overview">Overview</a> <ul> <li><a href="#get-started">Get Started</a></li> </ul> </li> <li><a href="#crowd-funded-open-source-software">Crowd-funded open-source software</a> <ul> <li><a href="#-click-here-to-become-a-sponsor-and-help-support-hugo-blox">❤️ Click here to become a sponsor and help support Hugo Blox’s future ❤️</a></li> </ul> </li> <li><a href="#ecosystem">Ecosystem</a></li> <li><a href="#inspiration">Inspiration</a></li> <li><a href="#features">Features</a></li> <li><a href="#themes">Themes</a></li> <li><a href="#license">License</a></li> </ul> </nav> </div> </details> <h2 id="overview">Overview</h2> <ol> <li>The Hugo Blox website builder for Hugo, along with its starter templates, is designed for professional creators, educators, and teams/organizations - although it can be used to create any kind of site</li> <li>The template can be modified and customised to suit your needs. It&rsquo;s a good platform for anyone looking to take control of their data and online identity whilst having the convenience to start off with a <strong>no-code solution (write in Markdown and customize with YAML parameters)</strong> and having <strong>flexibility to later add even deeper personalization with HTML and CSS</strong></li> <li>You can work with all your favourite tools and apps with hundreds of plugins and integrations to speed up your workflows, interact with your readers, and much more</li> </ol> <h3 id="get-started">Get Started</h3> <div class="callout flex px-4 py-3 mb-6 rounded-md border-l-4 bg-emerald-100 dark:bg-emerald-900 border-emerald-500" data-callout="tip" data-callout-metadata=""> <span class="callout-icon pr-3 pt-1 text-emerald-600 dark:text-emerald-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 18v-5.25m0 0a6.01 6.01 0 0 0 1.5-.189m-1.5.189a6.01 6.01 0 0 1-1.5-.189m3.75 7.478a12.06 12.06 0 0 1-4.5 0m3.75 2.383a14.406 14.406 0 0 1-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 1 0-7.517 0c.85.493 1.509 1.333 1.509 2.316V18"/></svg> </span> <div class="callout-content dark:text-neutral-300"> <div class="callout-title font-semibold mb-1">Quick Start Guide</div> <div class="callout-body"><p>New to Hugo Blox? Follow these steps to get your site up and running in minutes!</p></div> </div> </div> <ul> <li>👉 </li> <li>📚 </li> <li>💬 or </li> <li>🐦 Twitter: #MadeWithHugoBlox</li> <li>💡 </li> <li>⬆️ <strong>Updating Hugo Blox?</strong> View the and </li> </ul> <div class="callout flex px-4 py-3 mb-6 rounded-md border-l-4 bg-purple-100 dark:bg-purple-900 border-purple-500" data-callout="important" data-callout-metadata=""> <span class="callout-icon pr-3 pt-1 text-purple-600 dark:text-purple-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 9v3.75m9-.75a9 9 0 1 1-18 0a9 9 0 0 1 18 0m-9 3.75h.008v.008H12z"/></svg> </span> <div class="callout-content dark:text-neutral-300"> <div class="callout-title font-semibold mb-1">Important</div> <div class="callout-body"><p>Remember to backup your site before making major updates!</p></div> </div> </div> <h2 id="crowd-funded-open-source-software">Crowd-funded open-source software</h2> <p>To help us develop this template and software sustainably under the MIT license, we ask all individuals and businesses that use it to help support its ongoing maintenance and development via sponsorship.</p> <h3 id="-click-here-to-become-a-sponsor-and-help-support-hugo-blox"> </h3> <p>As a token of appreciation for sponsoring, you can <strong>unlock awesome rewards and extra features 🦄✨</strong></p> <h2 id="ecosystem">Ecosystem</h2> <ul> <li><strong> :</strong> Automatically import publications from BibTeX</li> </ul> <h2 id="inspiration">Inspiration</h2> <p> are building with this template.</p> <h2 id="features">Features</h2> <div class="callout flex px-4 py-3 mb-6 rounded-md border-l-4 bg-blue-100 dark:bg-blue-900 border-blue-500" data-callout="note" data-callout-metadata=""> <span class="callout-icon pr-3 pt-1 text-blue-600 dark:text-blue-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m16.862 4.487l1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8l.8-2.685a4.5 4.5 0 0 1 1.13-1.897zm0 0L19.5 7.125"/></svg> </span> <div class="callout-content dark:text-neutral-300"> <div class="callout-title font-semibold mb-1">Enhanced Markdown Support<br></div> <div class="callout-body"><p>Hugo Blox now supports GitHub and Obsidian-style callouts! Use standard Markdown alert syntax like <code>&gt; [!NOTE]</code> for better portability.</p></div> </div> </div> <ul> <li><strong>Page builder</strong> - Create <em>anything</em> with no-code and </li> <li><strong>Edit any type of content</strong> - Blog posts, publications, talks, slides, projects, and more!</li> <li><strong>Create content</strong> in , , or </li> <li><strong>Plugin System</strong> - Fully customizable </li> <li><strong>Display Code and Math</strong> - Code syntax highlighting and LaTeX math supported</li> <li><strong>Integrations</strong> - , , Maps, Contact Forms, and more!</li> <li><strong>Beautiful Site</strong> - Simple and refreshing one-page design</li> <li><strong>Industry-Leading SEO</strong> - Help get your website found on search engines and social media</li> <li><strong>Media Galleries</strong> - Display your images and videos with captions in a customizable gallery</li> <li><strong>Mobile Friendly</strong> - Look amazing on every screen with a mobile friendly version of your site</li> <li><strong>Multi-language</strong> - 35+ language packs including English, 中文, and Português</li> <li><strong>Multi-user</strong> - Each author gets their own profile page</li> <li><strong>Privacy Pack</strong> - Assists with GDPR</li> <li><strong>Stand Out</strong> - Bring your site to life with animation, parallax backgrounds, and scroll effects</li> <li><strong>One-Click Deployment</strong> - No servers. No databases. Only files.</li> </ul> <div class="callout flex px-4 py-3 mb-6 rounded-md border-l-4 bg-orange-100 dark:bg-orange-900 border-orange-500" data-callout="warning" data-callout-metadata=""> <span class="callout-icon pr-3 pt-1 text-orange-600 dark:text-orange-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0zM12 15.75h.007v.008H12z"/></svg> </span> <div class="callout-content dark:text-neutral-300"> <div class="callout-title font-semibold mb-1">Version Requirements<br></div> <div class="callout-body"><p>The new Markdown alert syntax requires Hugo v0.132.0 or later. Make sure you&rsquo;re using a compatible version!</p></div> </div> </div> <h2 id="themes">Themes</h2> <p>Hugo Blox and its templates come with <strong>automatic day (light) and night (dark) mode</strong> built-in. Visitors can choose their preferred mode by clicking the sun/moon icon in the header.</p> <p> for your site. Themes are fully customizable.</p> <h2 id="license">License</h2> <p>Copyright 2016-present .</p> <p>Released under the license.</p>