Init Commit
This commit is contained in:
@@ -0,0 +1,10 @@
|
||||
---
|
||||
title: "Articles"
|
||||
date: 2024-01-01
|
||||
draft: false
|
||||
description: "In-depth articles and tutorials"
|
||||
---
|
||||
|
||||
Welcome to the articles section. Here you'll find comprehensive articles, tutorials, and deep-dive content on various topics related to web development, technology, and best practices.
|
||||
|
||||
This section demonstrates how Hugo automatically creates sections from content folders, making it easy to organize different types of content.
|
||||
@@ -0,0 +1,40 @@
|
||||
---
|
||||
title: 'First Article'
|
||||
date: 2024-01-15T10:00:00+00:00
|
||||
draft: false
|
||||
tags:
|
||||
- tutorial
|
||||
- beginner
|
||||
---
|
||||
|
||||
This is the first article content. Hugo sections allow you to organize content into logical groups, and each section gets its own URL path.
|
||||
|
||||
## What are Hugo Sections?
|
||||
|
||||
Hugo sections are a way to organize your content into logical groups. When you create a folder under `content/`, Hugo automatically treats it as a section.
|
||||
|
||||
## Benefits of Using Sections
|
||||
|
||||
- **Organization**: Keep related content together
|
||||
- **URLs**: Automatic URL structure (`/articles/`, `/news/`, etc.)
|
||||
- **Templates**: Custom layouts for different content types
|
||||
- **RSS**: Each section gets its own RSS feed
|
||||
|
||||
## Example Structure
|
||||
|
||||
```
|
||||
content/
|
||||
├── articles/
|
||||
│ ├── _index.md
|
||||
│ ├── first-article.md
|
||||
│ └── second-article.md
|
||||
└── news/
|
||||
├── _index.md
|
||||
└── breaking-news.md
|
||||
```
|
||||
|
||||
This creates accessible URLs like:
|
||||
- `/articles/` (section list)
|
||||
- `/articles/first-article/` (individual article)
|
||||
- `/news/` (section list)
|
||||
- `/news/breaking-news/` (individual news item)
|
||||
@@ -0,0 +1,37 @@
|
||||
---
|
||||
title: 'Advanced Hugo Sections'
|
||||
date: 2024-01-20T14:30:00+00:00
|
||||
draft: false
|
||||
tags:
|
||||
- hugo
|
||||
- advanced
|
||||
- sections
|
||||
---
|
||||
|
||||
This is the second article, demonstrating how multiple articles appear in the same section.
|
||||
|
||||
## Advanced Section Features
|
||||
|
||||
Hugo sections provide powerful features for content organization:
|
||||
|
||||
### Custom Section Templates
|
||||
|
||||
You can create custom templates for each section by placing them in `layouts/SECTION/`:
|
||||
|
||||
- `layouts/articles/list.html` - for `/articles/` page
|
||||
- `layouts/articles/single.html` - for individual articles
|
||||
|
||||
### Section Variables
|
||||
|
||||
In templates, you can access section-specific data:
|
||||
|
||||
```go
|
||||
{{ .Section }} // "articles"
|
||||
{{ .Type }} // content type
|
||||
{{ .Pages }} // all pages in section
|
||||
{{ .RegularPages }} // only regular pages
|
||||
```
|
||||
|
||||
### Taxonomies per Section
|
||||
|
||||
Each section can have its own taxonomies (tags, categories) with independent organization.
|
||||
@@ -0,0 +1,9 @@
|
||||
---
|
||||
title: "Blog de Demostración"
|
||||
date: 2023-01-01
|
||||
draft: false
|
||||
---
|
||||
|
||||
Bienvenido al blog de demostración. Puedes personalizar (o eliminar) esta sección en el archivo `_index.md` de la carpeta `blog`. Puedes [leer sobre cómo organizar contenido en Hugo](https://gohugo.io/content-management/page-bundles/) en la documentación oficial.
|
||||
|
||||
Los artículos a continuación se encuentran en la misma carpeta (`blog/`) y pueden estar en [cualesquiera de los formatos que Hugo soporta](https://gohugo.io/content-management/formats/) (Markdown, HTML, Emacs Org Mode, AsciiDoc, Pandoc o reStructuredText).
|
||||
@@ -0,0 +1,11 @@
|
||||
---
|
||||
title: "Demo Blog"
|
||||
date: 2023-01-01
|
||||
draft: false
|
||||
---
|
||||
|
||||
Welcome to the demo blog. You can customize (or remove) this section in the `_index.md` file in the `blog` folder. You can [read about how to organize content in Hugo](https://gohugo.io/content-management/page-bundles/) in the official docs.
|
||||
|
||||
The posts below are in the same folder (`blog/`) and can be in the [supported formats by hugo](https://gohugo.io/content-management/formats/) (Markdown, HTML, Emacs Org Mode, AsciiDoc, Pandoc, or reStructuredText).
|
||||
|
||||
You can use translations as well.
|
||||
@@ -0,0 +1,396 @@
|
||||
---
|
||||
title: 'Create your own version of the site'
|
||||
date: 2025-02-11T14:38:33+02:00
|
||||
draft: false
|
||||
type: 'blog'
|
||||
featured: true
|
||||
weight: 10
|
||||
tags:
|
||||
- adritian
|
||||
- guide
|
||||
images:
|
||||
featured_image: '/img/blog/A minimalistic representation of creating a personal website, focusing on clean lines, subtle geometric shapes, and a modern web development aesthetic.png'
|
||||
---
|
||||
|
||||
This article is a guide to help you create your own version of the site using [Adritian](https://github.com/zetxek/adritian-free-hugo-theme). It will cover the main steps to get started with the theme, and how to customize it to your needs.
|
||||
|
||||
### Creating a site
|
||||
|
||||
This theme is for the content management system [Hugo](https://gohugo.io/), so that will be a pre-requirement.
|
||||
Make sure that you install the `extended` version of Hugo, as the theme uses SCSS for styling, as well as image optimization.
|
||||
|
||||
A very good place to start is the Quick start guide: [https://gohugo.io/getting-started/quick-start/](https://gohugo.io/getting-started/quick-start/)
|
||||
|
||||
_💡Tip:__ keep your repository clean and tidy by creating a [relevant `.gitignore` file](https://github.com/github/gitignore/blob/main/community/Golang/Hugo.gitignore) since the beginning:
|
||||
|
||||
```
|
||||
# Generated files by hugo
|
||||
/public/
|
||||
/resources/_gen/
|
||||
/assets/jsconfig.json
|
||||
hugo_stats.json
|
||||
|
||||
# Executable may be added to repository
|
||||
hugo.exe
|
||||
hugo.darwin
|
||||
hugo.linux
|
||||
|
||||
# Temporary lock file while building
|
||||
/.hugo_build.lock
|
||||
```
|
||||
|
||||
|
||||
|
||||
### Adding the theme
|
||||
|
||||
Once you have a site created, you can add the theme to your site by following the instructions in the [README](https://github.com/zetxek/adritian-free-hugo-theme?tab=readme-ov-file#as-a-hugo-module-recommended). While there are multiple ways to add the theme, the recommended way is to use the Hugo Modules, the ones listed here.
|
||||
|
||||
<details>
|
||||
<summary>Instructions to setup the theme as a hugo module</summary>
|
||||
|
||||
1. Create a new Hugo site (this will create a new folder): `hugo new site <your website's name>`
|
||||
1. Enter the newly created folder: `cd <your website's name>/`
|
||||
1. Initialize the Hugo Module system in your site if you haven't already: `hugo mod init github.com/username/your-site` (_you don't need to host your website on GitHub, you can add anything as a name_)
|
||||
1. Replace the contents of your config file (`hugo.toml`) file by these:
|
||||
|
||||
|
||||
<details>
|
||||
<summary>hugo.toml configuration</summary>
|
||||
|
||||
```
|
||||
baseURL = "<your website url>"
|
||||
languageCode = "en"
|
||||
|
||||
[module]
|
||||
[module.hugoVersion]
|
||||
# We use hugo.Deps to list dependencies, which was added in Hugo 0.92.0
|
||||
min = "0.92.0"
|
||||
|
||||
[[module.imports]]
|
||||
path="github.com/zetxek/adritian-free-hugo-theme"
|
||||
|
||||
## Base mounts - so your site's assets are available
|
||||
[[module.mounts]]
|
||||
source = "archetypes"
|
||||
target = "archetypes"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "assets"
|
||||
target = "assets"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "i18n"
|
||||
target = "i18n"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "layouts"
|
||||
target = "layouts"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "static"
|
||||
target = "static"
|
||||
|
||||
# The following mounts are required for the theme to be able to load bootstrap
|
||||
# Remember also to copy the theme's `package.json` to your site, and run `npm install`
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/scss"
|
||||
target = "assets/scss/bootstrap"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/dist/js"
|
||||
target = "assets/js/bootstrap"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"
|
||||
target = "assets/js/vendor/bootstrap.bundle.min.js"
|
||||
|
||||
## Optional, if you want print improvements (to PDF/printed)
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap-print-css/css/bootstrap-print.css"
|
||||
target = "assets/css/bootstrap-print.css"
|
||||
|
||||
[params]
|
||||
|
||||
title = 'Your website title'
|
||||
description = 'Your website description'
|
||||
sections = ["showcase", "about", "education", "experience", "client-and-work", "testimonial", "contact", "newsletter"]
|
||||
|
||||
# If you want to display an image logo in the header, you can add it here
|
||||
# logo = '/img/hugo.svg'
|
||||
homepageExperienceCount = 6
|
||||
|
||||
[params.analytics]
|
||||
## Analytics parameters.
|
||||
### Supported so far: Vercel (Page Insights, Analytics)
|
||||
### And Google (Tag Manager, Analytics)
|
||||
|
||||
# controls vercel page insights - disabled by default
|
||||
# to enable, just set to true
|
||||
vercelPageInsights = false
|
||||
vercelAnalytics = false
|
||||
|
||||
# google analytics and tag manager. to enable, set "enabled" to true
|
||||
# and add the tracking code (UA-something for analytics, GTM-something for tag manager)
|
||||
[params.analytics.googleAnalytics]
|
||||
code = "UA-XXXXX-Y"
|
||||
enabled = false
|
||||
[params.analytics.googleTagManager]
|
||||
code = "GTM-XXXXX"
|
||||
enabled = false
|
||||
|
||||
[build]
|
||||
[build.buildStats]
|
||||
disableClasses = false
|
||||
disableIDs = false
|
||||
disableTags = false
|
||||
enable = true
|
||||
|
||||
[params.languages.selector.disable]
|
||||
footer = false
|
||||
|
||||
[languages]
|
||||
[languages.en]
|
||||
disabled = false
|
||||
languageCode = 'en'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'English'
|
||||
title = ''
|
||||
weight = 0
|
||||
|
||||
[languages.en.menus]
|
||||
[[languages.en.menus.header]]
|
||||
name = 'About'
|
||||
URL = '#about'
|
||||
weight = 2
|
||||
[[languages.en.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '#portfolio'
|
||||
weight = 3
|
||||
# [[languages.en.menus.header]]
|
||||
# name = "Experience"
|
||||
# URL = "#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.en.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.en.menus.header]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "About"
|
||||
URL = "#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 4
|
||||
|
||||
|
||||
[languages.es]
|
||||
disabled = false
|
||||
languageCode = 'es'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'Español'
|
||||
title = ''
|
||||
weight = 0
|
||||
[[languages.es.menus.header]]
|
||||
name = 'Sobre mi'
|
||||
URL = '/es/#about'
|
||||
weight = 2
|
||||
[[languages.es.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '/es/#portfolio'
|
||||
weight = 3
|
||||
|
||||
# [[languages.es.menus.header]]
|
||||
# name = "Experiencia"
|
||||
# URL = "/es/#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.es.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/es/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.es.menus.header]]
|
||||
name = "Contacto"
|
||||
URL = "/es/#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Sobre mi"
|
||||
URL = "/es/#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "/es/#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "/es/#contact"
|
||||
weight = 4
|
||||
|
||||
[languages.fr]
|
||||
disabled = false
|
||||
languageCode = 'fr'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'Français'
|
||||
title = ''
|
||||
weight = 0
|
||||
|
||||
[languages.fr.menus]
|
||||
[[languages.fr.menus.header]]
|
||||
name = 'About'
|
||||
URL = '#about'
|
||||
weight = 2
|
||||
[[languages.fr.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '#portfolio'
|
||||
weight = 3
|
||||
# [[languages.fr.menus.header]]
|
||||
# name = "Experience"
|
||||
# URL = "#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.fr.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.fr.menus.header]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "About"
|
||||
URL = "#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 4
|
||||
|
||||
# Plugins
|
||||
[params.plugins]
|
||||
|
||||
# CSS Plugins
|
||||
[[params.plugins.css]]
|
||||
URL = "css/custom.css"
|
||||
[[params.plugins.css]]
|
||||
URL = "css/adritian-icons.css"
|
||||
## Optional, if you want print improvements (to PDF/printed)
|
||||
[[params.plugins.css]]
|
||||
URL = "css/bootstrap-print.css"
|
||||
|
||||
# JS Plugins
|
||||
[[params.plugins.js]]
|
||||
URL = "js/rad-animations.js"
|
||||
[[params.plugins.js]]
|
||||
URL = "js/sticky-header.js"
|
||||
[[params.plugins.js]]
|
||||
URL = "js/library/fontfaceobserver.js"
|
||||
|
||||
# SCSS Plugins
|
||||
[[params.plugins.scss]]
|
||||
URL = "scss/adritian.scss"
|
||||
|
||||
|
||||
# theme/color style
|
||||
[params.colorTheme]
|
||||
|
||||
## the following configuration would disable automatic theme selection
|
||||
# [params.colorTheme.auto]
|
||||
# disable = true
|
||||
# [params.colorTheme.forced]
|
||||
# theme = "dark"
|
||||
|
||||
## the following parameter will disable theme override in the footer
|
||||
# [params.colorTheme.selector.disable]
|
||||
# footer = true
|
||||
|
||||
|
||||
## by default we allow override AND automatic selection
|
||||
|
||||
[params.blog]
|
||||
layout = "default" # options: default, sidebar
|
||||
sidebarWidth = "25" # percentage width of the sidebar
|
||||
showCategories = true
|
||||
showRecentPosts = true
|
||||
recentPostCount = 5
|
||||
listStyle = "summary" # options: simple, summary
|
||||
```
|
||||
</details>
|
||||
|
||||
This configuration allows you to have a base to edit and adapt to your site, and see the available functionalities.
|
||||
Make sure to edit `baseURL`, `title` and `description`. You can edit the header links, as well as the languages to your needs.
|
||||
|
||||
1. Get the module: `hugo mod get -u`
|
||||
1. Execute `hugo mod npm pack` - this will generate a `package.json` file in the root folder of your site, with the dependencies for the theme.
|
||||
1. Execute `npm install` - this will install the dependencies for the theme (including bootstrap)
|
||||
1. (Optional, to override the defaults) Create a file `data/homepage.yml` with the contents of the [`exampleSite/data/homepage.yml`](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/exampleSite/data/homepage.yml) file, and customize to your needs.
|
||||
1. Start Hugo with `hugo server`...
|
||||
1. 🎉 The theme is alive on http://localhost:1313/ (if everything went well)
|
||||
|
||||
</details>
|
||||
|
||||
|
||||
### Editing the theme content
|
||||
|
||||
Currently the theme content is spread over multiple folders and files. We are working on simplifying this - but for now [this guide](https://adritian-demo.vercel.app/) should help you get started.
|
||||
|
||||
Some of the key files are:
|
||||
|
||||
|
||||
- `config.toml`: Main configuration for your Hugo site. Here you can set the site title, description, and theme specific settings such as:
|
||||
- menu structure (footer and header)
|
||||
- analytics (vercel, google)
|
||||
- blog settings (layout, sidebar contents, etc)
|
||||
- As well as some **required settings** for the theme to work properly (`module.mounts`, `params.plugins.css`)
|
||||
|
||||
- `data/homepage.yml`: homepage structure, content and sections - including social links, and the hero section.
|
||||
- `assets/`: Where you can store static assets such as images, CSS, and JavaScript files (you can add custom CSS and JS files with the `params.plugins.css` in `config.toml`).
|
||||
- `content/`: This is where your content files will live. The theme-specific ones are:
|
||||
- `content/blog/`: For blog posts.
|
||||
- `content/portfolio/`: For portfolio items.
|
||||
- `content/project/`: For projects.
|
||||
- `content/testimonial/`: For testimonials.
|
||||
- `content/education/`: For education items.
|
||||
- `content/experience/`: For experience items.
|
||||
- `content/client-and-work/`: For client and work items.
|
||||
|
||||
### Customizing the theme
|
||||
|
||||
Hugo allows you to customize the theme in many ways. You can override the theme's layouts, styles, and content.
|
||||
For that, you just need to locate the file you would like to change, copy it to your site's corresponding folder (`layouts`, `assets`, ...), and edit it.
|
||||
|
||||
**Note**: if you do this you will not benefit from theme updates, and that could lead to bugs. You can keep an eye on the [UPGRADING.md](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/UPGRADING.md) file.
|
||||
|
||||
### Improving the theme
|
||||
|
||||
Maybe some of the customizations you do are worth a share. If you think that your changes could be useful for others, feel free to open a pull request in the [GitHub repository](https://github.com/zetxek/adritian-free-hugo-theme/pulls) - collaborations are very welcome, especially if the contributions come from real-world use cases.
|
||||
|
||||
### Publishing the site
|
||||
|
||||
Once you have your site ready, you can publish it to the web. There are many ways to do this, but the recommended one is to use a service like [Vercel](https://vercel.com/) or [Github Pages](https://pages.github.com/). Both services offer free hosting for static sites, and they can be connected to your GitHub repository for automatic deployments.
|
||||
|
||||
For that, you will need to have a CI/CD action that builds your site and deploys it to the service. You can find an example of a GitHub action in the demo site repository: [https://github.com/zetxek/adritian-demo/blob/main/.github/workflows/hugo.yml](https://github.com/zetxek/adritian-demo/blob/main/.github/workflows/hugo.yml)
|
||||
@@ -0,0 +1,64 @@
|
||||
+++
|
||||
title = 'Icons'
|
||||
date = 2025-02-28T08:05:05+01:00
|
||||
draft = false
|
||||
featured = true
|
||||
weight = 100
|
||||
[images]
|
||||
featured_image= '/img/blog/icons.png'
|
||||
+++
|
||||
|
||||
The theme has multiple icons available for use.
|
||||
|
||||
You can see them rendered here:
|
||||
|
||||
- {{< link icon="threads" url="https://example.com" >}} `threads`
|
||||
- {{< link icon="bluesky" url="https://example.com" >}} `bluesky`
|
||||
- {{< link icon="x-twitter" url="https://example.com" >}} `x-twitter`
|
||||
- {{< link icon="email" url="https://example.com" >}} `email`
|
||||
- {{< link icon="user" url="https://example.com" >}} `user`
|
||||
- {{< link icon="table-list" url="https://example.com" >}} `table-list`
|
||||
- {{< link icon="download" url="https://example.com" >}} `download`
|
||||
- {{< link icon="circle-info" url="https://example.com" >}} `circle-info`
|
||||
- {{< link icon="square-twitter" url="https://example.com" >}} `square-twitter`
|
||||
- {{< link icon="square-facebook" url="https://example.com" >}} `square-facebook`
|
||||
- {{< link icon="linkedin" url="https://example.com" >}} `linkedin`
|
||||
- {{< link icon="square-github" url="https://example.com" >}} `square-github`
|
||||
- {{< link icon="circle-arrow-left" url="https://example.com" >}} `circle-arrow-left`
|
||||
- {{< link icon="circle-arrow-right" url="https://example.com" >}} `circle-arrow-right`
|
||||
- {{< link icon="circle-arrow-up" url="https://example.com" >}} `circle-arrow-up`
|
||||
- {{< link icon="circle-arrow-down" url="https://example.com" >}} `circle-arrow-down`
|
||||
- {{< link icon="quote-left" url="https://example.com" >}} `quote-left`
|
||||
- {{< link icon="face-smile" url="https://example.com" >}} `face-smile`
|
||||
- {{< link icon="square-arrow-up-right" url="https://example.com" >}} `square-arrow-up-right`
|
||||
- {{< link icon="youtube" url="https://example.com" >}} `youtube`
|
||||
- {{< link icon="square-xing" url="https://example.com" >}} `square-xing`
|
||||
- {{< link icon="instagram" url="https://example.com" >}} `instagram`
|
||||
- {{< link icon="dribbble" url="https://example.com" >}} `dribbble`
|
||||
- {{< link icon="behance" url="https://example.com" >}} `behance`
|
||||
- {{< link icon="file-pdf" url="https://example.com" >}} `file-pdf`
|
||||
- {{< link icon="codepen" url="https://example.com" >}} `codepen`
|
||||
- {{< link icon="yelp" url="https://example.com" >}} `yelp`
|
||||
- {{< link icon="cloud-arrow-down" url="https://example.com" >}} `cloud-arrow-down`
|
||||
- {{< link icon="medium" url="https://example.com" >}} `medium`
|
||||
- {{< link icon="stack-overflow" url="https://example.com" >}} `stack-overflow`
|
||||
- {{< link icon="meetup" url="https://example.com" >}} `meetup`
|
||||
- {{< link icon="tiktok" url="https://example.com" >}} `tiktok`
|
||||
|
||||
You can use them in several ways.
|
||||
1. With the `link` shortcode, as shown above. For more information on how to use shortcodes like this one, visit our [shortcodes documentation page](/blog/shortcodes/).
|
||||
2. In the theme menus (header and footer):
|
||||
```
|
||||
[[languages.en.menus.header]]
|
||||
pre = "search"
|
||||
name = "Search"
|
||||
URL = "/search"
|
||||
weight = 7
|
||||
```
|
||||
3. Directly as HTML markup:
|
||||
```
|
||||
<i class="icon-email" aria-label="Contact"></i>
|
||||
```
|
||||
|
||||
Do you need more icons?
|
||||
You can check this github issue to check how to [add your own](https://github.com/zetxek/adritian-free-hugo-theme/pull/169), or if it's relevant for the community you can request one [via the issue tracker like @klangborste did](https://github.com/zetxek/adritian-free-hugo-theme/issues/168).
|
||||
@@ -0,0 +1,118 @@
|
||||
---
|
||||
title: 'New Theme Features Demo'
|
||||
date: 2025-02-20T10:00:00+00:00
|
||||
draft: false
|
||||
type: 'blog'
|
||||
toc: true
|
||||
tocSticky: true
|
||||
tags:
|
||||
- adritian
|
||||
- guide
|
||||
- advanced
|
||||
description: 'Discover the new features added to the Adritian theme including related posts, social sharing, table of contents, and comments support.'
|
||||
---
|
||||
|
||||
This post demonstrates the new features that have been added to the Adritian Hugo theme to make it more feature-complete and competitive with other popular Hugo themes.
|
||||
|
||||
## Overview of New Features
|
||||
|
||||
The Adritian theme now includes several enhancements that are commonly found in modern Hugo themes for personal websites and portfolios.
|
||||
|
||||
### Related Posts
|
||||
|
||||
At the end of each blog post, you'll now see a section showing related posts based on shared tags and publish dates. This helps visitors discover more relevant content on your site.
|
||||
|
||||
### Social Sharing Buttons
|
||||
|
||||
Share your content easily on social media platforms! The theme now includes built-in sharing buttons for:
|
||||
|
||||
- Twitter/X
|
||||
- LinkedIn
|
||||
- Facebook
|
||||
- Email
|
||||
|
||||
These buttons are automatically styled to match the theme's design and work seamlessly in both light and dark modes.
|
||||
|
||||
## Table of Contents
|
||||
|
||||
This post has a table of contents enabled using the `toc: true` frontmatter parameter. The TOC helps readers navigate longer articles and can be made sticky on larger screens with `tocSticky: true`.
|
||||
|
||||
### How to Enable TOC
|
||||
|
||||
Simply add these parameters to your post's frontmatter:
|
||||
|
||||
```yaml
|
||||
---
|
||||
toc: true
|
||||
tocSticky: true # optional, makes TOC sticky on desktop
|
||||
---
|
||||
```
|
||||
|
||||
The table of contents automatically generates from your post headings and only appears when the post has more than 400 words.
|
||||
|
||||
## Enhanced Reading Experience
|
||||
|
||||
### Reading Time Display
|
||||
|
||||
Posts now show an estimated reading time alongside the word count, helping readers know how long an article will take to read.
|
||||
|
||||
### Last Modified Date
|
||||
|
||||
If you update your post's frontmatter with a `lastmod` date, it will be displayed in the post metadata, showing readers when the content was last updated.
|
||||
|
||||
## Comments Integration
|
||||
|
||||
The theme now supports popular comment systems:
|
||||
|
||||
- **Disqus** - Traditional comment system
|
||||
- **Giscus** - GitHub Discussions-powered comments
|
||||
- **Utterances** - GitHub Issues-powered comments
|
||||
|
||||
### Configuring Comments
|
||||
|
||||
Add this to your `hugo.toml` to enable comments:
|
||||
|
||||
```toml
|
||||
[params.comments]
|
||||
enabled = true
|
||||
provider = "giscus" # or "disqus" or "utterances"
|
||||
|
||||
[params.comments.giscus]
|
||||
repo = "username/repo"
|
||||
repoId = "your-repo-id"
|
||||
category = "General"
|
||||
categoryId = "your-category-id"
|
||||
```
|
||||
|
||||
## Social Sharing Configuration
|
||||
|
||||
Social sharing is enabled by default, but you can customize which platforms appear:
|
||||
|
||||
```toml
|
||||
[params.sharing]
|
||||
enabled = true
|
||||
twitter = true
|
||||
linkedin = true
|
||||
facebook = true
|
||||
email = true
|
||||
```
|
||||
|
||||
## Improved Taxonomy Support
|
||||
|
||||
The theme's tag and category displays have been enhanced with better styling and support for both light and dark modes.
|
||||
|
||||
## Multilingual Support
|
||||
|
||||
All new features include translations for:
|
||||
|
||||
- English (en)
|
||||
- Spanish (es)
|
||||
- French (fr)
|
||||
|
||||
You can easily add more languages by creating corresponding translation files in the `i18n/` directory.
|
||||
|
||||
## Conclusion
|
||||
|
||||
These new features make the Adritian theme more competitive with other popular Hugo themes while maintaining its focus on performance, accessibility, and clean design.
|
||||
|
||||
Try out the features by checking the related posts below, sharing this article, or exploring the table of contents!
|
||||
@@ -0,0 +1,136 @@
|
||||
+++
|
||||
title = 'How to Add Custom Icons to the Adritian Theme'
|
||||
date = 2025-02-28T08:05:05+01:00
|
||||
draft = false
|
||||
featured = true
|
||||
weight = 100
|
||||
[images]
|
||||
featured_image= '/img/blog/new-icon-3.png'
|
||||
+++
|
||||
|
||||
# How to Add Custom Icons to the Adritian Theme
|
||||
|
||||
{{< toc >}}
|
||||
|
||||
This guide will walk you through adding custom icons to your Adritian Hugo theme. Whether you need new social media icons, brand logos, or custom symbols, follow these steps to integrate them seamlessly.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
Before you begin, make sure you have:
|
||||
- Access to your Hugo site's source files
|
||||
- Basic understanding of file management
|
||||
- A web browser to access Fontello
|
||||
|
||||
## Overview
|
||||
|
||||
The Adritian theme uses a custom icon font generated with [Fontello](https://fontello.bableck.dev/). This is a fork of the original fontello, with additional font options.
|
||||
|
||||
To add new icons, you'll need to:
|
||||
|
||||
1. Export the current icon configuration
|
||||
2. Add new icons using Fontello
|
||||
3. Download and integrate the updated font files
|
||||
4. Update your site configuration
|
||||
|
||||
## Step 1: Export Current Configuration
|
||||
|
||||
1. Navigate to your theme's font directory: `static/fonts/`
|
||||
2. Locate the `config.json` file (see [the downstream version](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/static/fonts/config.json))
|
||||
3. Keep this file ready - you'll upload it to Fontello
|
||||
|
||||
## Step 2: Import Configuration to Fontello
|
||||
|
||||
1. Go to [Fontello](https://fontello.bableck.dev/)
|
||||
2. Click the **import** button (wrench icon)
|
||||
3. Upload your `config.json` file
|
||||
4. Fontello will load your current icon set
|
||||
|
||||
## Step 3: Add New Icons
|
||||
|
||||
|
||||
|
||||
1. **Browse available icons** in Fontello's library
|
||||
2. **Click on icons** you want to add (they'll be highlighted)
|
||||
3. **Configure icon names** by clicking the pencil icon next to each selected icon
|
||||
4. **Set icon codes** if needed (Fontello usually assigns these automatically)
|
||||
|
||||
## Step 4: Download Updated Font
|
||||
|
||||
1. Click the **Download webfont** button in Fontello
|
||||
2. Save the generated ZIP file to your computer
|
||||
3. Extract the ZIP file contents
|
||||
|
||||
## Step 5 (option 1): Update Theme Files Manually
|
||||
|
||||
1. **Copy font files** from the downloaded ZIP to `static/fonts/`:
|
||||
- Copy `.woff`, `.woff2`, `.ttf`, and `.eot` files
|
||||
|
||||
2. **Update CSS file**:
|
||||
- Open the CSS file from the ZIP
|
||||
- **Important**: Replace all instances of `/font` with `/fonts`
|
||||
- Copy the updated CSS to your theme's CSS file
|
||||
|
||||
3. **Replace config.json**:
|
||||
- Copy the new `config.json` from the ZIP to `static/fonts/`
|
||||
|
||||
## Step 5 (option 2): Update Theme Files with npm script
|
||||
|
||||
You can use the theme helper (https://www.npmjs.com/package/@zetxek/adritian-theme-helper) to update the theme files.
|
||||
|
||||
You can read the theme helper font script here: https://www.npmjs.com/package/@zetxek/adritian-theme-helper#user-content-update-font-script
|
||||
|
||||
With the following command you can update the theme files with the new icons automatically:
|
||||
```bash
|
||||
ts-node scripts/update-font.ts <source> <destination>
|
||||
```
|
||||
|
||||
## Step 6: Using the New Icon
|
||||
|
||||
Reference your new icons in your content, as for the [pre-provided icons](/blog/icons/).
|
||||
|
||||
## Example Usage
|
||||
|
||||
```html
|
||||
<!-- In your templates -->
|
||||
<i class="icon-your-new-icon-name"></i>
|
||||
<!-- In markdown with HTML -->
|
||||
<i class="icon-your-new-icon-name"></i> Custom Icon Text
|
||||
<!-- In a markdown file -->
|
||||
{ {< link icon="icon-your-new-icon-name" url="https://example.com" >} }
|
||||
```
|
||||
Note: for the markdown file, no spaces between the curly braces - added so it gets displayed here properly.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Icons Not Displaying
|
||||
- **Check file paths**: Ensure fonts are in `static/fonts/`
|
||||
- **Verify CSS paths**: Make sure `/font` is changed to `/fonts`
|
||||
- **Clear browser cache**: Force refresh with Ctrl+F5 (or Cmd+Shift+R on Mac)
|
||||
|
||||
### Icons Show as Squares
|
||||
- **Font files missing**: Verify all font files were copied correctly
|
||||
- **CSS not loaded**: Check that your CSS includes the new icon definitions
|
||||
|
||||
### Build Errors
|
||||
- **Invalid CSS**: Check for syntax errors in your CSS file
|
||||
- **Missing files**: Ensure all required font files are present
|
||||
|
||||
## Best Practices
|
||||
|
||||
- **Keep backups**: Save your old `config.json` before making changes
|
||||
- **Test locally**: Always test icon changes on your local development site first
|
||||
- **Consistent naming**: Use clear, descriptive names for your custom icons
|
||||
- **Optimize selection**: Only include icons you actually need to keep font file sizes small
|
||||
- **Do not modify the theme, override the files in your own project**: Instead of modifying the theme, override the files in your own site project. That will ensure you can update the theme without losing your changes.
|
||||
- **If your icon choice is a popular one, consider contributing it to the theme**: If you think your icon choice is a popular one, consider contributing it to the theme. That will help other users and make the theme more complete.
|
||||
|
||||
## Additional Resources
|
||||
|
||||
- [Fontello Documentation](https://github.com/fontello/fontello/wiki/Help)
|
||||
- [Adritian Theme Icons](/blog/icons/) - View all available icons
|
||||
|
||||
---
|
||||
|
||||
**Need help?** If you encounter issues following this guide, check the [theme's GitHub repository](https://github.com/zetxek/adritian-free-hugo-theme) for support and examples. If you still need help, you can open a new issue in the [theme's GitHub repository](https://github.com/zetxek/adritian-free-hugo-theme/issues).
|
||||
|
||||
|
||||
@@ -0,0 +1,380 @@
|
||||
---
|
||||
title: 'Other installation methods'
|
||||
date: 2025-02-11T14:38:33+02:00
|
||||
draft: false
|
||||
type: 'blog'
|
||||
tags:
|
||||
- adritian
|
||||
- guide
|
||||
---
|
||||
|
||||
This is a guide that extends the default instructions offered in [the theme readme](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/README.md).
|
||||
|
||||
### Manual configuration
|
||||
If you prefer to manually set your site, you need to replace the contents of your config file (`hugo.toml`) file by these:
|
||||
|
||||
<details>
|
||||
<summary>hugo.toml configuration</summary>
|
||||
|
||||
```
|
||||
baseURL = "<your website url>"
|
||||
languageCode = "en"
|
||||
|
||||
[module]
|
||||
[module.hugoVersion]
|
||||
# We use hugo.Deps to list dependencies, which was added in Hugo 0.92.0
|
||||
min = "0.92.0"
|
||||
|
||||
[[module.imports]]
|
||||
path="github.com/zetxek/adritian-free-hugo-theme"
|
||||
|
||||
## Base mounts - so your site's assets are available
|
||||
[[module.mounts]]
|
||||
source = "archetypes"
|
||||
target = "archetypes"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "assets"
|
||||
target = "assets"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "i18n"
|
||||
target = "i18n"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "layouts"
|
||||
target = "layouts"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "static"
|
||||
target = "static"
|
||||
|
||||
# The following mounts are required for the theme to be able to load bootstrap
|
||||
# Remember also to copy the theme's `package.json` to your site, and run `npm install`
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/scss"
|
||||
target = "assets/scss/bootstrap"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/dist/js"
|
||||
target = "assets/js/bootstrap"
|
||||
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"
|
||||
target = "assets/js/vendor/bootstrap.bundle.min.js"
|
||||
|
||||
## Optional, if you want print improvements (to PDF/printed)
|
||||
[[module.mounts]]
|
||||
source = "node_modules/bootstrap-print-css/css/bootstrap-print.css"
|
||||
target = "assets/css/bootstrap-print.css"
|
||||
|
||||
[params]
|
||||
|
||||
title = 'Your website title'
|
||||
description = 'Your website description'
|
||||
sections = ["showcase", "about", "education", "experience", "client-and-work", "testimonial", "contact", "newsletter"]
|
||||
|
||||
# If you want to display an image logo in the header, you can add it here
|
||||
# logo = '/img/hugo.svg'
|
||||
homepageExperienceCount = 6
|
||||
|
||||
[params.analytics]
|
||||
## Analytics parameters.
|
||||
### Supported so far: Vercel (Page Insights, Analytics)
|
||||
### And Google (Tag Manager, Analytics)
|
||||
|
||||
# controls vercel page insights - disabled by default
|
||||
# to enable, just set to true
|
||||
vercelPageInsights = false
|
||||
vercelAnalytics = false
|
||||
|
||||
# google analytics and tag manager. to enable, set "enabled" to true
|
||||
# and add the tracking code (UA-something for analytics, GTM-something for tag manager)
|
||||
[params.analytics.googleAnalytics]
|
||||
code = "UA-XXXXX-Y"
|
||||
enabled = false
|
||||
[params.analytics.googleTagManager]
|
||||
code = "GTM-XXXXX"
|
||||
enabled = false
|
||||
|
||||
[build]
|
||||
[build.buildStats]
|
||||
disableClasses = false
|
||||
disableIDs = false
|
||||
disableTags = false
|
||||
enable = true
|
||||
|
||||
[params.languages.selector.disable]
|
||||
footer = false
|
||||
|
||||
[languages]
|
||||
[languages.en]
|
||||
disabled = false
|
||||
languageCode = 'en'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'English'
|
||||
title = ''
|
||||
weight = 0
|
||||
|
||||
[languages.en.menus]
|
||||
[[languages.en.menus.header]]
|
||||
name = 'About'
|
||||
URL = '#about'
|
||||
weight = 2
|
||||
[[languages.en.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '#portfolio'
|
||||
weight = 3
|
||||
# [[languages.en.menus.header]]
|
||||
# name = "Experience"
|
||||
# URL = "#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.en.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.en.menus.header]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "About"
|
||||
URL = "#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.en.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 4
|
||||
|
||||
|
||||
[languages.es]
|
||||
disabled = false
|
||||
languageCode = 'es'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'Español'
|
||||
title = ''
|
||||
weight = 0
|
||||
[[languages.es.menus.header]]
|
||||
name = 'Sobre mi'
|
||||
URL = '/es/#about'
|
||||
weight = 2
|
||||
[[languages.es.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '/es/#portfolio'
|
||||
weight = 3
|
||||
|
||||
# [[languages.es.menus.header]]
|
||||
# name = "Experiencia"
|
||||
# URL = "/es/#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.es.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/es/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.es.menus.header]]
|
||||
name = "Contacto"
|
||||
URL = "/es/#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Sobre mi"
|
||||
URL = "/es/#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "/es/#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.es.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "/es/#contact"
|
||||
weight = 4
|
||||
|
||||
[languages.fr]
|
||||
disabled = false
|
||||
languageCode = 'fr'
|
||||
languageDirection = 'ltr'
|
||||
languageName = 'Français'
|
||||
title = ''
|
||||
weight = 0
|
||||
|
||||
[languages.fr.menus]
|
||||
[[languages.fr.menus.header]]
|
||||
name = 'About'
|
||||
URL = '#about'
|
||||
weight = 2
|
||||
[[languages.fr.menus.header]]
|
||||
name = 'Portfolio'
|
||||
URL = '#portfolio'
|
||||
weight = 3
|
||||
# [[languages.fr.menus.header]]
|
||||
# name = "Experience"
|
||||
# URL = "#experience"
|
||||
# weight = 4
|
||||
|
||||
[[languages.fr.menus.header]]
|
||||
name = "Blog"
|
||||
URL = "/blog"
|
||||
weight = 5
|
||||
|
||||
[[languages.fr.menus.header]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 6
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "About"
|
||||
URL = "#about"
|
||||
weight = 2
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "Portfolio"
|
||||
URL = "#portfolio"
|
||||
weight = 3
|
||||
|
||||
[[languages.fr.menus.footer]]
|
||||
name = "Contact"
|
||||
URL = "#contact"
|
||||
weight = 4
|
||||
|
||||
# Plugins
|
||||
[params.plugins]
|
||||
|
||||
# CSS Plugins
|
||||
[[params.plugins.css]]
|
||||
URL = "css/custom.css"
|
||||
[[params.plugins.css]]
|
||||
URL = "css/adritian-icons.css"
|
||||
## Optional, if you want print improvements (to PDF/printed)
|
||||
[[params.plugins.css]]
|
||||
URL = "css/bootstrap-print.css"
|
||||
|
||||
# JS Plugins
|
||||
[[params.plugins.js]]
|
||||
URL = "js/rad-animations.js"
|
||||
[[params.plugins.js]]
|
||||
URL = "js/sticky-header.js"
|
||||
[[params.plugins.js]]
|
||||
URL = "js/library/fontfaceobserver.js"
|
||||
|
||||
# SCSS Plugins
|
||||
[[params.plugins.scss]]
|
||||
URL = "scss/adritian.scss"
|
||||
|
||||
|
||||
# theme/color style
|
||||
[params.colorTheme]
|
||||
|
||||
## the following configuration would disable automatic theme selection
|
||||
# [params.colorTheme.auto]
|
||||
# disable = true
|
||||
# [params.colorTheme.forced]
|
||||
# theme = "dark"
|
||||
|
||||
## the following parameter will disable theme override in the footer
|
||||
# [params.colorTheme.selector.disable]
|
||||
# footer = true
|
||||
|
||||
|
||||
## by default we allow override AND automatic selection
|
||||
|
||||
[params.blog]
|
||||
layout = "default" # options: default, sidebar
|
||||
sidebarWidth = "25" # percentage width of the sidebar
|
||||
showCategories = true
|
||||
showRecentPosts = true
|
||||
recentPostCount = 5
|
||||
listStyle = "summary" # options: simple, summary
|
||||
```
|
||||
|
||||
1. Get the module: `hugo mod get -u`
|
||||
1. Execute `hugo mod npm pack` - this will generate a `package.json` file in the root folder of your site, with the dependencies for the theme.
|
||||
1. Execute `npm install` - this will install the dependencies for the theme (including bootstrap)
|
||||
1. (Optional, to override the defaults) Create a file `data/homepage.yml` with the contents of the [`exampleSite/data/homepage.yml`](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/exampleSite/data/homepage.yml) file, and customize to your needs (__note: this file is not included in your theme if you use hugo modules, download it manually from the repository__)
|
||||
|
||||
|
||||
</details>
|
||||
|
||||
### Traditional Installation (as git submodule)
|
||||
|
||||
If you prefer not to use Hugo Modules, you can still install the theme as a git submodule.
|
||||
The guide is very similar to [official "Quick Start"](https://gohugo.io/getting-started/quick-start/#create-a-site), just changing the theme URL in the `git submodule add` command:
|
||||
|
||||
<details>
|
||||
<summary>Old instructions for git submodules</summary>
|
||||
|
||||
- Create a new Hugo site (this will create a new folder): `hugo new site <your website's name>`
|
||||
- Enter the newly created folder: `cd <your website's name>/`
|
||||
- Initialize hugo modules: `hugo mod init github.com/<your_user>/<your_project>`
|
||||
- Install PostCSS: execute `npm i -D postcss postcss-cli autoprefixer` from the top-level site folder [check [Hugo's official docs](https://gohugo.io/hugo-pipes/postcss/)].
|
||||
- Add adritian-free-hugo-theme as a module dependency, by adding
|
||||
```
|
||||
[module]
|
||||
[[module.imports]]
|
||||
path = 'github.com/zetxek/adritian-free-hugo-theme'
|
||||
```
|
||||
To your `hugo.toml` file, and executing `hugo mod get -u`
|
||||
|
||||
- Replace the `hugo.toml` file in the project's root directory with the contents of [themes/adritian-free-hugo-theme/exampleSite/config.toml](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/exampleSite/hugo.toml). If you are using the git submodules, you can execute `cp themes/adritian-free-hugo-theme/exampleSite/hugo.toml hugo.toml` (*executed from the website root folder*), otherwise just copy and paste the contents.
|
||||
- Create the file `data/homepage.yml`, with the initial contents of the [`exampleSite/data/homepage.yml`](https://github.com/zetxek/adritian-free-hugo-theme/blob/main/exampleSite/data/homepage.yml). This will serve as your starting point to customize your home content ✍️
|
||||
- Start Hugo with `hugo server -D`
|
||||
- 🎉 The theme is alive on http://localhost:1313/
|
||||
|
||||
|
||||
_Optional, and only for git submodule or when you download the whole repo:_
|
||||
if you want to preview the theme with the example content before deciding if it's what you are looking for, you can run the theme with the example content:
|
||||
```
|
||||
cd themes/adritian-free-hugo-theme/exampleSite
|
||||
hugo server --themesDir ../..
|
||||
```
|
||||
|
||||
Note: The `exampleSite` is not downloaded when installing the Hugo module. That's why this works only as git submodule or full repo download.
|
||||
</details>
|
||||
|
||||
|
||||
---
|
||||
|
||||
After this, you can start adding your own content to the site, and customize the configuration.
|
||||
|
||||
If everything has gone well asn you have the right configuration, the output for the `serve` command will be something like this:
|
||||
<details>
|
||||
<summary>Example output for the serve command</summary>
|
||||
|
||||
```
|
||||
adritian-demo git:(master) ✗ hugo server -D
|
||||
Watching for changes in /Users/adrianmorenopena/tmp/theme-test/themes/adritian-free-hugo-theme/{archetypes,assets,data,exampleSite,i18n,layouts,static}
|
||||
Watching for config changes in /Users/adrianmorenopena/tmp/theme-test/themes/adritian-free-hugo-theme/exampleSite/hugo.toml
|
||||
Start building sites …
|
||||
hugo v0.136.2+extended darwin/arm64 BuildDate=2024-10-17T14:30:05Z VendorInfo=brew
|
||||
|
||||
|
||||
| EN | ES | FR
|
||||
-------------------+----+----+-----
|
||||
Pages | 24 | 10 | 8
|
||||
Paginator pages | 0 | 0 | 0
|
||||
Non-page files | 0 | 0 | 0
|
||||
Static files | 90 | 90 | 90
|
||||
Processed images | 24 | 0 | 0
|
||||
Aliases | 1 | 0 | 0
|
||||
Cleaned | 0 | 0 | 0
|
||||
|
||||
Built in 1788 ms
|
||||
Environment: "development"
|
||||
Serving pages from disk
|
||||
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
|
||||
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
|
||||
Press Ctrl+C to stop
|
||||
```
|
||||
</details>
|
||||
@@ -0,0 +1,19 @@
|
||||
+++
|
||||
title = 'Sample content: featured image'
|
||||
date = 2024-06-24T14:38:33+02:00
|
||||
draft = false
|
||||
type = 'blog'
|
||||
|
||||
[images]
|
||||
featured_image = '/img/blog/feature-sample-3.png'
|
||||
+++
|
||||
|
||||
Sample blog content. Like a lorem ipsum but saying something more interesting.
|
||||
|
||||
|
||||
|
||||
Welcome to the world of "Content Ipsum," the fresh alternative to the classic lorem ipsum. It's the perfect blend for designers and writers who crave a dash of creativity and meaning in their placeholder text. Imagine a text that not only fills the space but also sparks the imagination, a text that weaves tales of innovation, inspiration, and the endless possibilities that creativity brings.
|
||||
|
||||
In the realm of "Content Ipsum," every paragraph is a journey through the wonders of the human mind, a celebration of the achievements that have shaped our world, and a look into the future that awaits us. From the depths of the ocean to the farthest reaches of the universe, "Content Ipsum" takes you on an adventure that captivates and informs.
|
||||
|
||||
So, the next time you're crafting a design or drafting a document, let "Content Ipsum" infuse your work with the spirit of discovery and the joy of creation. It's more than just text; it's a narrative that connects, engages, and inspires. Welcome to the evolution of placeholder text – where every word is a story waiting to be told.
|
||||
@@ -0,0 +1,162 @@
|
||||
---
|
||||
title: 'Sample content: formatting styles'
|
||||
date: 2024-06-21T14:38:33+02:00
|
||||
draft: false
|
||||
type: 'blog'
|
||||
tags:
|
||||
- sample
|
||||
- lorem-ipsum
|
||||
---
|
||||
|
||||
Sample blog content. Like a lorem ipsum but saying something more interesting.
|
||||
|
||||
We will show some content that is supported:
|
||||
|
||||
## Basic Syntax
|
||||
|
||||
### Headings
|
||||
|
||||
```
|
||||
# Heading 1
|
||||
## Heading 2
|
||||
### Heading 3
|
||||
#### Heading 4
|
||||
##### Heading 5
|
||||
###### Heading 6
|
||||
```
|
||||
|
||||
## Heading 2
|
||||
### Heading 3
|
||||
#### Heading 4
|
||||
##### Heading 5
|
||||
###### Heading 6
|
||||
|
||||
### Emphasis
|
||||
|
||||
```text
|
||||
*This text will be italic*
|
||||
_This will also be italic_
|
||||
|
||||
**This text will be bold**
|
||||
__This will also be bold__
|
||||
|
||||
_You **can** combine them_
|
||||
```
|
||||
|
||||
*This text will be italic*
|
||||
|
||||
_This will also be italic_
|
||||
|
||||
**This text will be bold**
|
||||
|
||||
__This will also be bold__
|
||||
|
||||
_You **can** combine them_
|
||||
|
||||
### Lists
|
||||
|
||||
#### Unordered
|
||||
|
||||
```
|
||||
* Item 1
|
||||
* Item 2
|
||||
* Item 2a
|
||||
* Item 2b
|
||||
```
|
||||
|
||||
* Item 1
|
||||
* Item 2
|
||||
* Item 2a
|
||||
* Item 2b
|
||||
|
||||
#### Ordered
|
||||
|
||||
```
|
||||
1. Item 1
|
||||
2. Item 2
|
||||
3. Item 3
|
||||
1. Item 3a
|
||||
2. Item 3b
|
||||
```
|
||||
|
||||
#### Nested
|
||||
|
||||
- This is an unordered list sample 1
|
||||
- This is an unordered list sample 2
|
||||
- This is an unordered indented list sample 1
|
||||
- This is an unordered indented list sample 2
|
||||
1. This is an ordered list sample 1
|
||||
2. This is an ordered list sample 2
|
||||
1. This is an ordered indented list sample 1
|
||||
2. This is an ordered indented list sample 2
|
||||
|
||||
### Images
|
||||
|
||||
```markdown
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
### Links
|
||||
|
||||
```markdown
|
||||
[Hugo](https://gohugo.io)
|
||||
```
|
||||
|
||||
[Hugo](https://gohugo.io)
|
||||
|
||||
### Blockquotes
|
||||
|
||||
```markdown
|
||||
As Newton said:
|
||||
|
||||
> If I have seen further it is by standing on the shoulders of Giants.
|
||||
```
|
||||
|
||||
> If I have seen further it is by standing on the shoulders of Giants.
|
||||
|
||||
### Inline Code
|
||||
|
||||
```markdown
|
||||
Inline `code` has `back-ticks around` it.
|
||||
```
|
||||
|
||||
Inline `code` has `back-ticks around` it.
|
||||
|
||||
### Code Blocks
|
||||
|
||||
#### Syntax Highlighting
|
||||
|
||||
````markdown
|
||||
```go
|
||||
func main() {
|
||||
fmt.Println("Hello World")
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
```go
|
||||
func main() {
|
||||
fmt.Println("Hello World")
|
||||
}
|
||||
```
|
||||
|
||||
### Tables
|
||||
|
||||
```markdown
|
||||
| Syntax | Description |
|
||||
| --------- | ----------- |
|
||||
| Header | Title |
|
||||
| Paragraph | Text |
|
||||
```
|
||||
|
||||
| Syntax | Description |
|
||||
| --------- | ----------- |
|
||||
| Header | Title |
|
||||
| Paragraph | Text |
|
||||
|
||||
## References
|
||||
|
||||
- [Markdown Syntax](https://www.markdownguide.org/basic-syntax/)
|
||||
- [Hugo Markdown](https://gohugo.io/content-management/formats/#markdown)
|
||||
@@ -0,0 +1,216 @@
|
||||
---
|
||||
title: 'Theme shortcodes'
|
||||
date: 2025-02-14T14:38:33+02:00
|
||||
draft: false
|
||||
type: 'blog'
|
||||
tags:
|
||||
- adritian
|
||||
- guide
|
||||
---
|
||||
|
||||
Shortcodes are a convenient [functionality of Hugo](https://gohugo.io/content-management/shortcodes/), allowing you to embed templates or layouts within other content.
|
||||
|
||||
Some of the example built-in shortcodes are Instagram posts, YouTube videos, QR codes, etc. You can find [the full list in the official docs](https://gohugo.io/content-management/shortcodes/#embedded).
|
||||
|
||||
The theme provides custom shortcodes to allow you to customize your landing page as you want:
|
||||
|
||||
- `toc`: Generates a styled table of contents from page headings.
|
||||
- `education-list`: Displays a list of educational qualifications.
|
||||
- `experience-list`: Shows a list of professional experiences.
|
||||
- `platform-links`: Embeds links to various platforms with icons.
|
||||
- `newsletter-section`: Adds a section for newsletter subscription.
|
||||
- `link`: Creates a hyperlink with an icon.
|
||||
- `experience-section`: Inserts a detailed experience section.
|
||||
- `contact-section`: Adds a contact information section, with a customizable form and information.
|
||||
- `client-and-work-section`: Displays a section for clients and work.
|
||||
- `about-section`: About section, with image, buttons for call to action and image.
|
||||
- `testimonial-section`: Adds references from customers, colleagues, etc.
|
||||
- `showcase`: two-column block with a full-width image to the left, and a text snippet to the right. Great for a call to action or introduction of the person (assuming it's a personal website).
|
||||
- `text-section`: utility shortcode used to render text in some parts of the theme where it would otherwise be full-width, appearing "too floaty". See [the github issue #260 for context](https://github.com/zetxek/adritian-free-hugo-theme/issues/260).
|
||||
- `spacer`: Adds vertical spacing before the next element.
|
||||
|
||||
The shortcodes can be customized with different arguments:
|
||||
|
||||
- `toc`: Automatically generates a table of contents from the page's headings (H2, H3, etc.)
|
||||
- `heading`: Custom heading text for the table of contents. Defaults to "Table of Contents".
|
||||
- `showHeading`: Boolean value to show or hide the heading. Defaults to true.
|
||||
- `class`: Custom CSS class for styling. Defaults to "table-of-contents".
|
||||
- **Features**:
|
||||
- Only displays if the page contains headings
|
||||
- Supports nested heading levels with proper indentation
|
||||
- Responsive design with dark mode support
|
||||
- Smooth scrolling to sections
|
||||
- Clean, modern styling with hover effects
|
||||
- **Usage Examples**:
|
||||
- `{{</* toc */>}}`: Basic table of contents with default settings
|
||||
- `{{</* toc heading="Contents" */>}}`: Custom heading
|
||||
- `{{</* toc showHeading=false */>}}`: Hide the heading
|
||||
- `{{</* toc class="sidebar-toc" */>}}`: Custom CSS class
|
||||
- `{{</* toc heading="Article Contents" class="custom-toc" */>}}`: Multiple parameters
|
||||
|
||||
- `education-list`:
|
||||
- `title`: The title of the education section.
|
||||
- `items`: A list of educational qualifications, they're provided by the `education` content type pages. From each, the `year`, `university`, and `degree` will be used.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `experience-list`:
|
||||
- `title`: The title of the experience section (optional). When provided, an h2 heading is added above the list.
|
||||
- `padding`: Controls whether the section has padding. Set to "true" by default.
|
||||
- `items`: A list of professional experiences, coming from the `experience` content type. For each of them, the `companyLogo`, `duration`, `jobTitle`, `location`, and `Content` are used.
|
||||
- **Note**: On mobile devices, a separator line is automatically added between experience entries for better readability.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `platform-links`:
|
||||
- `platforms`: A container to place social links inside. Usually you'll want to use it with a list of `link` nested (see below)
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `link`: links to social platforms (facebook, linkedin, etc)
|
||||
- `url`: The URL for the hyperlink.
|
||||
- `icon`: The icon to display with the link.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `newsletter-section`:
|
||||
- **Form Configuration**:
|
||||
- `form_action`: The URL where the newsletter form data will be submitted. Falls back to site data configuration (typically set in data/homepage.yaml).
|
||||
- `form_method`: The HTTP method for form submission (typically "POST" or "GET"). Falls back to site data configuration.
|
||||
- **Section Content**:
|
||||
- `newsletter_title`: Sets the main heading/title for the newsletter section. Falls back to i18n value "newsletter_title".
|
||||
- `newsletter_placeholder`: Placeholder text displayed in the email input field. Falls back to i18n value "newsletter_placeholder".
|
||||
- `newsletter_button`: Text displayed on the subscription button. Falls back to i18n value "newsletter_button".
|
||||
- **Response Messages**:
|
||||
- `newsletter_success_message`: Message displayed to users after successful subscription. Falls back to i18n value "newsletter_success_message".
|
||||
- `newsletter_error_message`: Message displayed to users if subscription fails. Falls back to i18n value "newsletter_error_message".
|
||||
- `newsletter_note`: Small text/disclaimer shown below the form (typically mentions privacy policy). Falls back to i18n value "newsletter_note".
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `experience-section`:
|
||||
- `title`: The title of the experience section.
|
||||
- `experiences`: A detailed list of experiences, coming from the `experience` content type pages.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `contact-section`:
|
||||
- `title`: Sets the main heading/title for the contact section. Falls back to the i18n value "contact_title" if not provided.
|
||||
- **Form Configuration**:
|
||||
- `form_action`: The URL where the form data will be submitted. Commonly used with services like Formspree. Falls back to site data configuration.
|
||||
- `form_method`: The HTTP method for form submission (typically "POST" or "GET"). Falls back to site data configuration.
|
||||
- **Form Field Placeholders**:
|
||||
- `contact_form_name`: Placeholder text for the name input field. Falls back to i18n value.
|
||||
- `contact_form_email`: Placeholder text for the email input field. Falls back to i18n value.
|
||||
- `contact_form_phone`: Placeholder text for the phone input field. Falls back to i18n value.
|
||||
- `contact_form_message`: Placeholder text for the message textarea. Falls back to i18n value.
|
||||
- `contact_form_rows`: Number of rows for the message textarea. Defaults to 2 if not specified.
|
||||
- `contact_button`: Text for the form submission button. Falls back to i18n value.
|
||||
- **Contact Information**:
|
||||
- `contact_phone_title`: Heading for the phone contact section. Falls back to i18n value.
|
||||
- `contact_phone_number`: Phone number to display. Falls back to i18n value.
|
||||
- `contact_email_title`: Heading for the email contact section. Falls back to i18n value.
|
||||
- `contact_email_email`: Email address to display. Falls back to i18n value.
|
||||
- `contact_address_title`: Heading for the address section. Falls back to i18n value.
|
||||
- `contact_address_address`: Physical address or location information. Falls back to i18n value.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `client-and-work-section`: this shortcode doesn't use as many arguments - as much of the content comes from other content pages.
|
||||
- `title`: The title of the client and work section.
|
||||
- `clients`: A list of clients, coming from the `client` content type (each with `title`, `link`, `logo`)
|
||||
- `projects`: A list of projects, coming from the `project` content type (each with `title`, `content`, `button.URL`, `button.btnText`, `button.icon`, `image`).
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `about-section`:
|
||||
- Content Arguments
|
||||
- `intro_title` - Sets the main heading/title for the about section. Falls back to the title from site data if not provided.
|
||||
|
||||
- `intro_description` - Contains the HTML content or description text for the about section. Falls back to the content from site data if not provided.
|
||||
|
||||
- `imgSrc` - Specifies the path to the image displayed in the about section. Falls back to the image defined in site data if not provided.
|
||||
|
||||
- `imgWidth` - Specifies the width for the image.
|
||||
|
||||
- `imgHeight` - Specifies the height for the image.
|
||||
|
||||
- `imgScale` - Specifies the scale used for the image (for example, `0.5` if the high resolution image is double the size of the smaller one) This is only considered if neither imgWidth nor imgHeight is used.
|
||||
|
||||
- `v_align` - Controls the vertical alignment of the text content relative to the image. Accepts "center" (default), "top", or "bottom".
|
||||
- `text_align` - **Deprecated**: Use `v_align` instead. Maintains backwards compatibility.
|
||||
- `h_align` - Controls the horizontal alignment of the text content. Accepts "left" (default), "center", or "right".
|
||||
|
||||
**Alignment Examples**:
|
||||
- `v_align="center" h_align="left"` - Text vertically centered, left-aligned (default)
|
||||
- `v_align="top" h_align="center"` - Text at top, horizontally centered
|
||||
- `v_align="bottom" h_align="right"` - Text at bottom, right-aligned
|
||||
|
||||
- Primary Button Arguments
|
||||
- `button1_enable` - Boolean value to show or hide the primary button. Defaults to the value from site data.
|
||||
|
||||
- `button1_icon` - icon class to display before the button text. Falls back to the icon from site data.
|
||||
|
||||
- `button1_url` - Target URL for the primary button. Falls back to the URL from site data.
|
||||
|
||||
- `button1_text` - Text label to display on the primary button. Falls back to the text from site data.
|
||||
|
||||
- Secondary Button Arguments
|
||||
- `button2_enable` - Boolean value to show or hide the secondary button. Defaults to the value from site data.
|
||||
|
||||
- `button2_icon` - FontAwesome or icon class to display before the button text. Falls back to the icon from site data.
|
||||
|
||||
- `button2_url` - Target URL for the secondary button. Falls back to the URL from site data.
|
||||
|
||||
- `button2_text` - Text label to display on the secondary button. Falls back to the text from site data.
|
||||
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `testimonial-section`:
|
||||
- `title`: The title of the testimonial section.
|
||||
- `testimonials`: A list of testimonials, provided by the `testimonial` content type pages. The partial dynamically pulls content from pages with type "testimonial". Each testimonial page should include:
|
||||
- `Content`: The main testimonial text (the actual quote)
|
||||
- Meta Information:
|
||||
- `name`: The name of the person giving the testimonial
|
||||
- `position`: The job title or role of the person giving the testimonial
|
||||
- `image.src`: Path to the image of the testimonial author
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `showcase`:
|
||||
- **Content Arguments**:
|
||||
- `title`: Sets the main heading/title for the showcase section. Falls back to the i18n value "showcase_title".
|
||||
- `subtitle`: Sets the subtitle text that appears below the main heading. Falls back to the i18n value "showcase_subtitle".
|
||||
- `description`: Contains the HTML content or description text for the showcase section. Falls back to the i18n value "showcase_description".
|
||||
- **Button Configuration**:
|
||||
- `button_text`: Text label to display on the button. If not provided or set to false, the button will not be displayed.
|
||||
- `button_icon`: Icon class to display before the button text. Falls back to the icon from site data.
|
||||
- `button_url`: Target URL for the button. Falls back to the URL from site data.
|
||||
- **Image Configuration**:
|
||||
- `imgSrc`: Specifies the path to the image displayed in the showcase section. Falls back to the image defined in site data.
|
||||
- `imgWidth` - Specifies the width for the image.
|
||||
- `imgHeight` - Specifies the height for the image.
|
||||
- `imgScale` - Specifies the scale used for the image (for example, `0.5` if the high resolution image is double the size of the smaller one) This is only considered if neither imgWidth nor imgHeight is used.
|
||||
- **Social Media**:
|
||||
- `social_links`: Array of social media platform links to display at the bottom of the showcase. Each item should have a URL and icon property.
|
||||
- **Responsive Behavior**:
|
||||
- The showcase uses a two-column layout on desktop devices (≥768px) and stacks columns vertically on mobile devices, with the image appearing above the text content.
|
||||
- **Inner Content**:
|
||||
- The shortcode can also accept inner content that will be rendered in a separate div with class "inner-content".
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `text-section`:
|
||||
- **Content Arguments**:
|
||||
- `title`: Sets the main heading/title for the text section (optional).
|
||||
- `subtitle`: Sets the subtitle text that appears below the main heading (optional).
|
||||
- **Layout Options**:
|
||||
- `padding`: Controls whether the section has padding. Set to "true" by default.
|
||||
- `centered`: When set to "true", adds flexbox classes to center the content both horizontally and vertically. Set to "false" by default.
|
||||
- **Inner Content**:
|
||||
- The shortcode accepts markdown-formatted inner content that will be rendered in the text section.
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
- `spacer`:
|
||||
- **Size Options**:
|
||||
- `size`: Controls the amount of vertical spacing. Accepts "small", "medium" (default), "large", or "xlarge".
|
||||
- **Usage Examples**:
|
||||
- `{{</* spacer */>}}`: Adds medium spacing (default)
|
||||
- `{{</* spacer size="small" */>}}`: Adds minimal spacing
|
||||
- `{{</* spacer size="large" */>}}`: Adds substantial spacing
|
||||
- `{{</* spacer size="xlarge" */>}}`: Adds maximum spacing
|
||||
- `sectionId`: Optional. Overrides the default HTML id for the section. If not provided, the default id is used.
|
||||
|
||||
You can see them in effect in:
|
||||
- [the homepage](/) [`(see source)`](https://raw.githubusercontent.com/zetxek/adritian-demo/refs/heads/main/content/home.md).
|
||||
- [the CV page](/cv) [`(see source)`](https://raw.githubusercontent.com/zetxek/adritian-demo/refs/heads/main/content/cv.md).
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
date: '2024-08-25T10:21:48+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Goldline'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/goldline.png"
|
||||
scale: 0.5
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,15 @@
|
||||
---
|
||||
date: '2024-08-25T10:22:34+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Kanba'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/kanba.png"
|
||||
scale: 0.5
|
||||
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,15 @@
|
||||
---
|
||||
date: '2024-08-25T10:23:08+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Zoo'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/zoo-tv.png"
|
||||
scale: 0.5
|
||||
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,16 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Asgardia'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/asgardia.png"
|
||||
scale: 0.5
|
||||
|
||||
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
date: '2024-08-25T10:17:12+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Earth 2.0'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/earth-2.png"
|
||||
scale: 0.5
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,15 @@
|
||||
---
|
||||
date: '2024-08-25T10:23:39+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Ztos'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
logo:
|
||||
src: "images/clients/ztos.png"
|
||||
scale: 0.5
|
||||
|
||||
## The content is not used (yet). If you have ideas on how to use it,
|
||||
## you can suggest it at https://github.com/zetxek/adritian-free-hugo-theme/discussions
|
||||
---
|
||||
@@ -0,0 +1,19 @@
|
||||
---
|
||||
title: 'Printable CV'
|
||||
hideTitle: true
|
||||
---
|
||||
|
||||
ℹ This page is a demo of the printer-friendly output of the theme. You can find the source code in the demo repo (https://raw.githubusercontent.com/zetxek/adritian-demo/refs/heads/main/content/cv.md). Try printing it directly from your browser!
|
||||
|
||||
### About me
|
||||
|
||||
I am a passionate software engineer with over 10 years of experience building web applications and distributed systems. My expertise spans full-stack development, cloud architecture, and leading engineering teams to deliver impactful solutions. I thrive on solving complex technical challenges while mentoring others and fostering a collaborative engineering culture.
|
||||
|
||||
Throughout my career, I've focused on creating scalable, maintainable software using modern technologies and best practices. I'm particularly interested in distributed systems, performance optimization, and building resilient architectures. When I'm not coding, I enjoy contributing to open source projects and sharing knowledge through technical writing and speaking at conferences.
|
||||
|
||||
### Experience
|
||||
|
||||
{{< experience-list >}}
|
||||
|
||||
{{< education-list title="Education" >}}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'High School of Hard Knocks'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
university: "High School of Hard Knocks"
|
||||
year: "2009-2012"
|
||||
degree: "High School Diploma, Sciences, Math, Computer & Business Studies"
|
||||
|
||||
---
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'University of Life'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
university: "University of Life"
|
||||
year: "2012-2017"
|
||||
degree: "Bachelor of Applied Science (BASc), Electrical Engineering"
|
||||
|
||||
---
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
title: Experiencia
|
||||
---
|
||||
|
||||
Aquí es donde puedes destacar un poco sobre tu experiencia. Años de experiencia total, especialización, etc.
|
||||
|
||||
El contenido en esta introducción viene del archivo `content/experience/_index.md`.
|
||||
Este tipo de contenido, las "páginas índice", se denominan "branch bundles" (paquetes de rama). Puede leer más sobre [**secciones y paquetes** en la documentación de Hugo](https://gohugo.io/content-management/sections/#template-selection).
|
||||
|
||||
El contenido para cada elemento de experiencia (en los que puedes hacer clic a la izquierda) se define en la carpeta `content/experience`, con un elemento de contenido por experiencia, como en `job-1.es.md`, `job-2.es.md`, etc.
|
||||
|
||||
El contenido (texto y URL) para los botones a continuación (donde puedes agregar enlaces) proviene del archivo de traducción, `i18n/en.yaml`, en los elementos `experience_button`, `experience_button_url`, `experience_button2`, `experience_button2_url`, `experience_button3`, `experience_button3_url`.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
title: Expérience
|
||||
---
|
||||
|
||||
C'est ici que vous pouvez mettre en avant un peu de votre expérience. Années d'expérience totale, spécialisation, etc.
|
||||
|
||||
Le contenu de cette introduction provient du fichier `content/experience/_index.md`.
|
||||
Ce type de contenu, les "pages d'index", sont appelées "branch bundles" (paquets de branche). Vous pouvez en savoir plus sur [**les sections et les paquets** dans la documentation de Hugo](https://gohugo.io/content-management/sections/#template-selection).
|
||||
|
||||
Le contenu pour chaque élément d'expérience (sur lesquels vous pouvez cliquer à gauche) est défini dans le dossier `content/experience`, avec un élément de contenu par expérience, comme dans `job-1.fr.md`, `job-2.fr.md`, etc.
|
||||
|
||||
Le contenu (texte et URL) pour les boutons ci-dessous (où vous pouvez ajouter des liens) provient du fichier de traduction, `i18n/fr.yaml`, dans les éléments `experience_button`, `experience_button_url`, `experience_button2`, `experience_button2_url`, `experience_button3`, `experience_button3_url`.
|
||||
@@ -0,0 +1,40 @@
|
||||
---
|
||||
title: Experience
|
||||
button1_text: See page source
|
||||
button1_url: https://github.com/zetxek/adritian-demo/blob/main/content/experience/_index.md
|
||||
button1_icon: icon-square-github
|
||||
|
||||
button2_text: Button 2
|
||||
button2_url: https://linkedin.com/in/adrianmoreno
|
||||
button2_icon: icon-face-smile
|
||||
|
||||
button3_text: Button 3
|
||||
button3_url: https://linkedin.com/in/adrianmoreno
|
||||
button3_icon: icon-circle-arrow-up
|
||||
|
||||
---
|
||||
|
||||
This is where you can highlight a bit over your experience. Years of total experience, specialization, etc.
|
||||
|
||||
The content in this intro comes from the `content/experience/_index.md` file.
|
||||
These kind of content, the "index pages", are called "branch bundles". You can read more about [**sections and bundles** in Hugo's docs](https://gohugo.io/content-management/sections/#template-selection).
|
||||
|
||||
The content for each experience item (that you can click on the left) is defined in the `content/experience` folder, with one content item per experience, as in `job-1.md`, `job-2.md`, etc.
|
||||
|
||||
The content (text and URL) for the buttons below (where you can add links) comes from two different files, depending on where you see this content:
|
||||
1. in the "experience" page (`/experience`): this is passed from the content file, in `/content/experience/_index.md`
|
||||
2. in the home page (or another page), using shortcodes.
|
||||
|
||||
In both cases, the arguments that can be passed (either via shortcode or front matter arguments) are:
|
||||
- button1:
|
||||
- button1_text
|
||||
- button1_ url
|
||||
- button1_icon
|
||||
- button2:
|
||||
- button2_text
|
||||
- button2_ url
|
||||
- button2_icon
|
||||
- button3:
|
||||
- button3_text
|
||||
- button3_ url
|
||||
- button3_icon
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
date: 2022-01-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Trabajo #1"
|
||||
jobTitle: "Becario Junior"
|
||||
company: "Internet Affairs Inc."
|
||||
location: "Stavanger, Noruega"
|
||||
duration: "2022-2024"
|
||||
---
|
||||
## Arreglando el mundo, un byte a la vez
|
||||
|
||||
El comienzo de una gran carrera.
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
date: 2022-12-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Job #1"
|
||||
jobTitle: "Junior Intern"
|
||||
company: "Internet Affairs Inc. "
|
||||
location: "Stavanger, Norway"
|
||||
duration: "2022-2024"
|
||||
companyLogo: "images/experience/internet-affairs.png"
|
||||
|
||||
---
|
||||
## 1st job: Junior Intern
|
||||
|
||||
The beginning of a great career. As a Junior Intern at Internet Affairs Inc., I had the opportunity to work on various projects that helped me develop my technical and professional skills. Working alongside experienced developers, I contributed to the company's core web applications and learned industry best practices in software development.
|
||||
|
||||
During my internship, I took the initiative to create an internal documentation wiki that improved knowledge sharing across teams. This project taught me valuable lessons in technical writing and collaboration. I also participated in code reviews and daily stand-ups, gaining firsthand experience in agile development methodologies.
|
||||
|
||||
My most notable achievement was developing an automated testing script that reduced QA time by 25%. This project not only improved team efficiency but also demonstrated my ability to identify problems and implement effective solutions. Additionally, I actively participated in the company's mentorship program, where I helped onboard new interns and shared my growing knowledge with peers.
|
||||
|
||||
Through these experiences, I built a strong foundation in software development and professional collaboration, setting the stage for my advancement to more senior roles within the company.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
date: 2023-01-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Trabajo #2"
|
||||
jobTitle: "Becario Jefe"
|
||||
company: "Internet Affairs Inc."
|
||||
location: "Stavanger, Noruega"
|
||||
duration: "2023-2024"
|
||||
---
|
||||
## Arreglando el mundo, un byte a la vez
|
||||
|
||||
Continuando la misión.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
date: 2023-01-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Poste #2"
|
||||
jobTitle: "Stagiaire en Chef"
|
||||
company: "Internet Affairs Inc."
|
||||
location: "Stavanger, Norvège"
|
||||
duration: "2023-2024"
|
||||
---
|
||||
## Réparer le monde, un octet à la fois
|
||||
|
||||
Poursuivant la quête.
|
||||
@@ -0,0 +1,17 @@
|
||||
---
|
||||
date: 2023-12-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Job #2"
|
||||
jobTitle: "Chief Intern"
|
||||
company: "Internet Affairs Inc. "
|
||||
location: "Stavanger, Norway"
|
||||
duration: "2023-2024"
|
||||
|
||||
---
|
||||
## 2nd job: Chief Intern
|
||||
|
||||
As Chief Intern at Internet Affairs Inc., I led several key initiatives that helped streamline our internal processes and boost productivity. Working closely with cross-functional teams, I developed and implemented an automated documentation system that reduced report generation time by 65% and improved accuracy by 40%.
|
||||
|
||||
During my internship, I spearheaded the company's first-ever "Innovation Lab" program, where I mentored junior interns and coordinated weekly brainstorming sessions. This initiative resulted in three patent-pending solutions and garnered attention from senior management. The program has since been adopted as a permanent fixture in the company's internship structure.
|
||||
|
||||
My most significant achievement was the successful implementation of a machine learning algorithm that optimized our resource allocation system. This project not only improved resource utilization by 35% but also led to my eventual promotion to CIO. I also actively participated in community outreach programs, organizing coding workshops for local high school students and contributing to the company's STEM education initiatives.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
date: 2024-01-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Trabajo #3"
|
||||
jobTitle: "Director Ejecutivo"
|
||||
company: "Internet Affairs Inc."
|
||||
location: "Stavanger, Noruega"
|
||||
duration: "2024-ahora"
|
||||
---
|
||||
## Arreglando el mundo, un byte a la vez
|
||||
|
||||
¡Adquisición hostil - ¿quién es el jefe ahora?!
|
||||
@@ -0,0 +1,13 @@
|
||||
---
|
||||
date: 2024-12-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Puesto #3"
|
||||
jobTitle: "Gerente General"
|
||||
company: "Translated Content"
|
||||
location: "Stavanger, Norway"
|
||||
duration: "2024-now"
|
||||
|
||||
---
|
||||
## 3rd job: Gerente General
|
||||
|
||||
Con una traducción al español, se puede llegar a cualquier parte.
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
date: 2024-01-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Poste #3"
|
||||
jobTitle: "PDG"
|
||||
company: "Internet Affairs Inc."
|
||||
location: "Stavanger, Norvège"
|
||||
duration: "2024-maintenant"
|
||||
---
|
||||
## Réparer le monde, un octet à la fois
|
||||
|
||||
Prise de contrôle hostile - qui est le patron maintenant !
|
||||
@@ -0,0 +1,19 @@
|
||||
---
|
||||
date: 2024-12-01T00:00:00+01:00
|
||||
draft: false
|
||||
title: "Job #3"
|
||||
jobTitle: "CIO"
|
||||
company: "Internet Affairs Inc. "
|
||||
location: "Stavanger, Norway"
|
||||
duration: "2024-now"
|
||||
|
||||
---
|
||||
## 3rd job: CIO
|
||||
|
||||
As Chief Information Officer at Internet Affairs Inc., I lead the strategic transformation of our digital infrastructure and cybersecurity initiatives. My team of 150+ IT professionals works tirelessly to protect and optimize our global network spanning 23 countries.
|
||||
|
||||
During my tenure, I've spearheaded the implementation of a revolutionary blockchain-based verification system that reduced fraudulent transactions by 87% while improving processing speeds by 300%. This initiative saved the company $12M annually and earned us the prestigious "Digital Innovation Award 2024".
|
||||
|
||||
I'm particularly proud of our "Green Computing" program which has successfully migrated 75% of our data centers to renewable energy sources. This environmental initiative not only reduced our carbon footprint by 45% but also resulted in a 30% reduction in operational costs.
|
||||
|
||||
In my role, I also serve as a member of the executive board, helping shape the company's long-term technology vision and ensuring our IT strategy aligns perfectly with our business objectives. Currently leading an ambitious AI integration project that promises to revolutionize our customer service capabilities.
|
||||
@@ -0,0 +1,48 @@
|
||||
+++
|
||||
title = "Footer"
|
||||
type = "footer"
|
||||
draft = false
|
||||
+++
|
||||
|
||||
|
||||
{{< contact-section
|
||||
sectionId="contacto"
|
||||
title="Contáctame"
|
||||
contact_form_name="Tu nombre"
|
||||
contact_form_email="Tu correo"
|
||||
contact_form_message="Tu mensaje"
|
||||
contact_button="Enviar mensaje"
|
||||
contact_phone_title="Mi teléfono"
|
||||
contact_phone_number="<a href='tel:+555666777'>555 666 777</a>"
|
||||
contact_email_title="Mi correo"
|
||||
contact_email_email="demo@demosite.com"
|
||||
contact_address_title="Mi ubicación"
|
||||
contact_address_address="🇩🇰 Denmark"
|
||||
form_action="https://formspree.io/f/mail@example.com"
|
||||
form_method="POST"
|
||||
>}}
|
||||
|
||||
{{< newsletter-section
|
||||
newsletter_title="Subscríbete"
|
||||
newsletter_placeholder="Tu correo"
|
||||
newsletter_button="Subscríbete"
|
||||
newsletter_success_message="Gracias por suscribirte!"
|
||||
newsletter_error_message="Algo ha fallado, por favor inténtalo de nuevo."
|
||||
newsletter_note="Respetamos tu privacidad."
|
||||
form_action="/"
|
||||
form_method="POST"
|
||||
>}}
|
||||
|
||||
|
||||
{{< text-section
|
||||
title="Contenido extra"
|
||||
centered="true"
|
||||
>}}
|
||||
|
||||
Puedes añadir contenido adicional después de los bloques de `section`.
|
||||
|
||||
Aquí puedes ser creativo, utilizar otros shortcodes, ... O dejarlo vacío.
|
||||
|
||||
Para añadir texto que quede bien en el pie, puedes utilizar el shortcode `text-section`.
|
||||
|
||||
{{< /text-section >}}
|
||||
@@ -0,0 +1,47 @@
|
||||
+++
|
||||
title = "Footer"
|
||||
type = "footer"
|
||||
draft = false
|
||||
+++
|
||||
|
||||
|
||||
{{< contact-section
|
||||
title="Reach out"
|
||||
contact_form_name="Your name"
|
||||
contact_form_email="Your e-mail"
|
||||
contact_form_message="Your text"
|
||||
contact_form_phone="Your phone"
|
||||
contact_button="Send message"
|
||||
contact_phone_title="My phone"
|
||||
contact_phone_number="<a href='tel:+555666777'>555 666 777</a>"
|
||||
contact_email_title="My mail"
|
||||
contact_email_email="<a href='mailto:demo@demosite.com'>demo@demosite.com</a>"
|
||||
contact_address_title="My location"
|
||||
contact_address_address="🇩🇰 Denmark"
|
||||
form_action="https://formspree.io/f/mail@example.com"
|
||||
form_method="POST"
|
||||
contact_form_rows="3"
|
||||
>}}
|
||||
|
||||
{{< newsletter-section
|
||||
newsletter_title="Stay updated"
|
||||
newsletter_placeholder="Enter your email"
|
||||
newsletter_button="Subscribe"
|
||||
newsletter_success_message="Thank you for subscribing!"
|
||||
newsletter_error_message="Something went wrong, please try again."
|
||||
newsletter_note="We respect your privacy and won't share your data."
|
||||
form_action="/"
|
||||
form_method="POST"
|
||||
>}}
|
||||
|
||||
|
||||
{{< text-section
|
||||
title="Extra footer content"
|
||||
centered="true"
|
||||
>}}
|
||||
Additional content added after the `section` blocks.
|
||||
|
||||
Here you could freestyle, add other shortcodes, ... Or just let the content empty, and rely on the shortcode sections alone.
|
||||
|
||||
To make the text nicely wrapped in the footer, the shortcode `text-section` is used.
|
||||
{{< /text-section >}}
|
||||
@@ -0,0 +1,82 @@
|
||||
+++
|
||||
title = "Inicio"
|
||||
type = "home"
|
||||
draft = false
|
||||
+++
|
||||
|
||||
{{< showcase-section
|
||||
title="Sección destacada"
|
||||
subtitle="Subtítulo - proviene de <code>home.md</code>"
|
||||
buttonText="Correo"
|
||||
description="Texto en <strong>negrita</strong> y normal. Esto viene de <code>home.md</code>. ¿No proporcionado? se usa i18n por defecto (por ahora, para ofrecer compatibilidad con versiones >1.7.0)"
|
||||
imgSrc="images/showcase/showcase.png"
|
||||
imgScale="0.5"
|
||||
sectionId="seccion-destacada"
|
||||
>}}
|
||||
|
||||
{{< platform-links sectionId="social" >}}
|
||||
{{< link icon="square-facebook" url="https://facebook.com/yourpage" >}}
|
||||
{{< link icon="square-twitter" url="https://twitter.com/yourpage" >}}
|
||||
{{< link icon="linkedin" url="https://www.linkedin.com/in/adrianmoreno/" >}}
|
||||
{{< link icon="square-github" url="https://github.com/zetxek" >}}
|
||||
{{< link icon="x-twitter" url="https://twitter.com/zetxek" >}}
|
||||
{{< link icon="dribbble" url="#" >}}
|
||||
{{< link icon="behance" url="#" >}}
|
||||
{{< link icon="youtube" url="#" >}}
|
||||
{{< link icon="instagram" url="https://www.instagram.com/zetxek/" >}}
|
||||
{{< link icon="square-facebook" url="https://www.facebook.com/zetxek/" >}}
|
||||
{{< link icon="codepen" url="#" >}}
|
||||
{{< link icon="yelp" url="https://www.yelp.com/" >}}
|
||||
{{< link icon="bluesky" url="https://www.bluesky.com/" >}}
|
||||
{{< link icon="threads" url="https://www.threads.net/" >}}
|
||||
{{< link icon="face-smile" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="user" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="quote-left" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="cloud-arrow-down" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="square-xing" url="https://www.adrianmoreno.info/" >}}
|
||||
|
||||
{{< /platform-links >}}
|
||||
{{< /showcase-section >}}
|
||||
|
||||
{{< about-section
|
||||
title="Sobre mí"
|
||||
content="Usando <code>sintaxis HTML</code>"
|
||||
about_button="Texto del botón"
|
||||
button_icon="info"
|
||||
button_text="Puedes editar esto"
|
||||
button_url="https://www.google.com"
|
||||
imgSrc="images/about/user-picture.png"
|
||||
imgScale="0.5"
|
||||
sectionId="sobre-mi"
|
||||
>}}
|
||||
|
||||
{{< education-list
|
||||
title="Formación académica"
|
||||
sectionId="formacion-academica" >}}
|
||||
|
||||
{{< experience-section
|
||||
title="Mi experiencia laboral (sección)"
|
||||
intro_title="Introducción"
|
||||
intro_description="Descripción.<br>Puedes usar HTML, con formato en <strong>negrita</strong>, o listas <ul><li>uno</li><li>dos</li></ul>"
|
||||
button1_url="https://example.com"
|
||||
button1_text="Visitar Ejemplo"
|
||||
button1_icon="icon-globe"
|
||||
button2_text="Otro Botón (2)"
|
||||
button3_text="Ver todo"
|
||||
button3_url="/es/experience"
|
||||
sectionId="experiencia-laboral"
|
||||
>}}
|
||||
|
||||
|
||||
## Experiencia (lista)
|
||||
|
||||
Puedes ver una versión alternativa, usando `experience-list` en [/cv](/cv).
|
||||
|
||||
|
||||
{{< client-and-work-section
|
||||
title="Una selección de mi trabajo"
|
||||
sectionId="trabajo" >}}
|
||||
|
||||
{{< testimonial-section
|
||||
title="Lo que dicen de mí"
|
||||
sectionId="testimonios" >}}
|
||||
@@ -0,0 +1,79 @@
|
||||
+++
|
||||
title = "Accueil"
|
||||
type = "home"
|
||||
draft = false
|
||||
+++
|
||||
|
||||
{{< showcase-section
|
||||
title="Section vedette"
|
||||
subtitle="Sous-titre - vient de <code>home.md</code>"
|
||||
buttonText="Courriel"
|
||||
description="Texte en <strong>gras</strong> et normal. Ceci provient de <code>home.md</code>. Non fourni ? i18n par défaut (pour compatibilité versions >1.7.0)"
|
||||
imgSrc="images/showcase/showcase.png"
|
||||
imgScale="0.5"
|
||||
sectionId="section-vedette"
|
||||
>}}
|
||||
|
||||
{{< platform-links sectionId="liens-plateforme" >}}
|
||||
{{< link icon="square-facebook" url="https://facebook.com/yourpage" >}}
|
||||
{{< link icon="square-twitter" url="https://twitter.com/yourpage" >}}
|
||||
{{< link icon="linkedin" url="https://www.linkedin.com/in/adrianmoreno/" >}}
|
||||
{{< link icon="square-github" url="https://github.com/zetxek" >}}
|
||||
{{< link icon="x-twitter" url="https://twitter.com/zetxek" >}}
|
||||
{{< link icon="dribbble" url="#" >}}
|
||||
{{< link icon="behance" url="#" >}}
|
||||
{{< link icon="youtube" url="#" >}}
|
||||
{{< link icon="instagram" url="https://www.instagram.com/zetxek/" >}}
|
||||
{{< link icon="square-facebook" url="https://www.facebook.com/zetxek/" >}}
|
||||
{{< link icon="codepen" url="#" >}}
|
||||
{{< link icon="yelp" url="https://www.yelp.com/" >}}
|
||||
{{< link icon="bluesky" url="https://www.bluesky.com/" >}}
|
||||
{{< link icon="threads" url="https://www.threads.net/" >}}
|
||||
{{< link icon="face-smile" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="user" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="quote-left" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="cloud-arrow-down" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="square-xing" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< /platform-links >}}
|
||||
{{< /showcase-section >}}
|
||||
|
||||
{{< about-section
|
||||
title="À propos de moi"
|
||||
content="En utilisant la <code>syntaxe HTML</code>"
|
||||
about_button="Texte du bouton"
|
||||
button_icon="info"
|
||||
button_text="Vous pouvez modifier ceci"
|
||||
button_url="https://www.google.com"
|
||||
imgSrc="images/about/user-picture.png"
|
||||
imgScale="0.5"
|
||||
sectionId="a-propos"
|
||||
>}}
|
||||
|
||||
{{< education-list
|
||||
title="Formation académique"
|
||||
sectionId="formation-academique" >}}
|
||||
|
||||
{{< experience-section
|
||||
title="Mon expérience professionnelle (section)"
|
||||
intro_title="Introduction"
|
||||
intro_description="Description.<br>Vous pouvez utiliser du HTML, avec format <strong>gras</strong>, ou des listes <ul><li>un</li><li>deux</li></ul>"
|
||||
button1_url="https://example.com"
|
||||
button1_text="Visiter Exemple"
|
||||
button1_icon="icon-globe"
|
||||
button2_text="Autre Bouton (2)"
|
||||
button3_text="Tout voir"
|
||||
button3_url="/es/experience"
|
||||
sectionId="experience-professionnelle"
|
||||
>}}
|
||||
|
||||
## Expérience (liste)
|
||||
|
||||
Vous pouvez voir une autre version, utilisant `experience-list` sur [/cv](/cv).
|
||||
|
||||
{{< client-and-work-section
|
||||
title="Une sélection de mon travail"
|
||||
sectionId="travail" >}}
|
||||
|
||||
{{< testimonial-section
|
||||
title="Ce que l’on dit de moi"
|
||||
sectionId="temoignages" >}}
|
||||
@@ -0,0 +1,96 @@
|
||||
+++
|
||||
title = "Home"
|
||||
type = "home"
|
||||
draft = false
|
||||
+++
|
||||
|
||||
|
||||
{{< showcase-section
|
||||
title="Showcase section"
|
||||
subtitle="Subtitle - coming from <code>home.md</code>"
|
||||
buttonText="Email"
|
||||
description="<strong>Strong</strong>, <em>italic</em> and normal text. This comes from <a href='https://github.com/zetxek/adritian-demo/blob/main/content/home/home.md?plain=1'><code>home.md</code></a>, using the <code>showcase-section</code> <a href=''>shortcode</a>.<br/>Below you can see the social links, provided by the <code>platform-links</code> shortcode."
|
||||
imgSrc="images/showcase/showcase.png"
|
||||
imgScale="0.5"
|
||||
>}}
|
||||
|
||||
{{< platform-links >}}
|
||||
{{< link icon="square-facebook" url="https://facebook.com/yourpage" >}}
|
||||
{{< link icon="square-twitter" url="https://twitter.com/yourpage" >}}
|
||||
{{< link icon="linkedin" url="https://www.linkedin.com/in/adrianmoreno/" >}}
|
||||
{{< link icon="square-github" url="https://github.com/zetxek" >}}
|
||||
{{< link icon="x-twitter" url="https://twitter.com/zetxek" >}}
|
||||
{{< link icon="dribbble" url="#" >}}
|
||||
{{< link icon="behance" url="#" >}}
|
||||
{{< link icon="youtube" url="#" >}}
|
||||
{{< link icon="instagram" url="https://www.instagram.com/zetxek/" >}}
|
||||
{{< link icon="square-facebook" url="https://www.facebook.com/zetxek/" >}}
|
||||
{{< link icon="codepen" url="#" >}}
|
||||
{{< link icon="yelp" url="https://www.yelp.com/" >}}
|
||||
{{< link icon="bluesky" url="https://www.bluesky.com/" >}}
|
||||
{{< link icon="threads" url="https://www.threads.net/" >}}
|
||||
{{< link icon="face-smile" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="user" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="quote-left" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="cloud-arrow-down" url="https://www.adrianmoreno.info/" >}}
|
||||
{{< link icon="square-xing" url="https://www.adrianmoreno.info/" >}}
|
||||
|
||||
{{< /platform-links >}}
|
||||
|
||||
{{< /showcase-section >}}
|
||||
|
||||
{{< about-section
|
||||
title="About me"
|
||||
content="This content is using the <code>about-section</code> shortcode. <br/>You can write <code>HTML</code>, as long as you <em>wrap it</em> accordingly. "
|
||||
button_icon="icon-user"
|
||||
button_text="Check my skills"
|
||||
button_url="/skills"
|
||||
imgSrc="images/about/user-picture.png"
|
||||
imgScale="0.5"
|
||||
v_align="center"
|
||||
h_align="left"
|
||||
>}}
|
||||
|
||||
{{< education-list
|
||||
title="Formal Education (education-list)" >}}
|
||||
|
||||
{{< experience-section
|
||||
title="My job experience (title)"
|
||||
intro_title="Intro (intro_title)"
|
||||
intro_description="Description (intro_description).<br>You can use HTML,with <strong>strong</strong> formatting, or lists <ul><li>one</li><li>two</li></ul>"
|
||||
button1_url="https://example.com"
|
||||
button1_text="(1) Visit Example"
|
||||
button1_icon="icon-globe"
|
||||
button2_text="(2) Skills"
|
||||
button2_url="/skills"
|
||||
hideViewAll="false"
|
||||
>}}
|
||||
|
||||
{{< experience-list
|
||||
title="Experience (as list)"
|
||||
padding="false" >}}
|
||||
|
||||
{{< client-and-work-section
|
||||
title="A selection of my work" >}}
|
||||
|
||||
{{< testimonial-section
|
||||
title="What they say about me" >}}
|
||||
|
||||
{{< spacer size="large" >}}
|
||||
|
||||
## Extra home content
|
||||
|
||||
Additional content added after the `section` blocks, in the `home.md` file.
|
||||
|
||||
Here you could freestyle, add other shortcodes, ... Or just let the content empty, and rely on the shortcode sections alone.
|
||||
|
||||
{{< spacer size="small" >}}
|
||||
|
||||
{{< text-section
|
||||
title="Extra (centered) content"
|
||||
centered="true"
|
||||
>}}
|
||||
|
||||
You can also use the `text-section` shortcode to add centered texts
|
||||
|
||||
{{< /text-section >}}
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
title: "News"
|
||||
date: 2024-01-01
|
||||
draft: false
|
||||
description: "Latest news updates and announcements"
|
||||
---
|
||||
|
||||
Latest news updates and announcements. This section demonstrates how you can have multiple sections in your Hugo site, each with their own content organization and URL structure.
|
||||
|
||||
Stay updated with the latest developments, announcements, and important information.
|
||||
@@ -0,0 +1,19 @@
|
||||
---
|
||||
title: 'Breaking News'
|
||||
date: 2024-01-25T16:45:00+00:00
|
||||
draft: false
|
||||
tags:
|
||||
- announcement
|
||||
- important
|
||||
---
|
||||
|
||||
This is breaking news content demonstrating how different sections can contain different types of content while using the same underlying Hugo section functionality.
|
||||
|
||||
## News Section Benefits
|
||||
|
||||
- **Separate URL space**: `/news/` vs `/articles/`
|
||||
- **Different content structure**: News vs long-form articles
|
||||
- **Independent RSS feeds**: `/news/index.xml`
|
||||
- **Custom styling**: Different templates if needed
|
||||
|
||||
This allows for clear content separation while maintaining consistency in the overall site structure.
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Radity Finance - UI Kit'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
button:
|
||||
icon: "icon-arrow-right"
|
||||
btnText: "Case Study"
|
||||
URL: "https://www.adrianmoreno.info"
|
||||
image:
|
||||
src: "images/works/radity-finance.jpg"
|
||||
scale: 0.5
|
||||
|
||||
## The content is used for the description of the project
|
||||
---
|
||||
|
||||
We have been receiving a lot of requests for a Finance Kit recently due to the popularity of Fintech.
|
||||
@@ -0,0 +1,21 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Robo Advisor'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
button:
|
||||
icon: "icon-arrow-right"
|
||||
btnText: "Case Study"
|
||||
URL: "https://www.adrianmoreno.info"
|
||||
image:
|
||||
src: "images/works/robo-advisor.jpg"
|
||||
scale: 0.5
|
||||
|
||||
|
||||
## The content is used for the description of the project
|
||||
---
|
||||
|
||||
Robo Advisor is a Swiss Wealth Manager and wants to create the best digital experience for its UNHW clients across the world. We started with a whiteboard.
|
||||
@@ -0,0 +1,40 @@
|
||||
---
|
||||
date: '2024-08-25T09:53:42+02:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Swiss Fintech Website'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
button:
|
||||
icon: "icon-arrow-right"
|
||||
btnText: "Case Study"
|
||||
URL: "https://www.adrianmoreno.info"
|
||||
image:
|
||||
src: "images/works/swissfintech.jpg"
|
||||
scale: 0.5
|
||||
|
||||
|
||||
## The content is used for the description of the project
|
||||
---
|
||||
|
||||
Here you can add additional context, description, links, etc.
|
||||
The content you see here comes from the contents of the `content/projects` folder.
|
||||
|
||||
This project is in the file `projects/swiss-fintech.md`.
|
||||
|
||||
In the markdown file frontmatter you can also define additional parameters, such as the link:
|
||||
|
||||
```
|
||||
link: "https://www.adrianmoreno.info" # optional URL to link the logo to
|
||||
|
||||
params:
|
||||
button:
|
||||
icon: "icon-arrow-right"
|
||||
btnText: "Case Study"
|
||||
URL: "https://www.adrianmoreno.info"
|
||||
image:
|
||||
src: "images/works/swissfintech.jpg"
|
||||
scale: 0.5
|
||||
|
||||
```
|
||||
@@ -0,0 +1,8 @@
|
||||
---
|
||||
title: "Search" # in any language you want
|
||||
layout: "search" # necessary for search
|
||||
# url: "/archive"
|
||||
# description: "Description for Search"
|
||||
summary: "search"
|
||||
placeholder: "placeholder text in search input box"
|
||||
---
|
||||
@@ -0,0 +1,53 @@
|
||||
---
|
||||
title: "Technical Skills"
|
||||
date: 2025-05-19T14:56:00+01:00
|
||||
draft: false
|
||||
description: "A comprehensive overview of technical skills and expertise across various domains."
|
||||
skill_categories:
|
||||
- name: "Programming Languages"
|
||||
skills:
|
||||
- name: "JavaScript/TypeScript"
|
||||
level: 95
|
||||
years: "10+"
|
||||
description: "Modern ES6+, TypeScript, React, Node.js"
|
||||
- name: "Java"
|
||||
level: 85
|
||||
years: "8+"
|
||||
description: "Enterprise applications, Spring framework"
|
||||
- name: "PHP"
|
||||
level: 90
|
||||
years: "10+"
|
||||
description: "Laravel, Symfony, WordPress"
|
||||
- name: "Swift/Objective-C"
|
||||
level: 80
|
||||
years: "7+"
|
||||
description: "iOS native development"
|
||||
- name: "Kotlin/Java"
|
||||
level: 75
|
||||
years: "6+"
|
||||
description: "Android native development"
|
||||
- name: "Frameworks & Technologies"
|
||||
skills:
|
||||
- name: "React/React Native"
|
||||
level: 90
|
||||
years: "7+"
|
||||
description: "Web and cross-platform mobile apps"
|
||||
- name: "Node.js"
|
||||
level: 90
|
||||
years: "8+"
|
||||
description: "Express, NestJS, API development"
|
||||
- name: "AWS"
|
||||
level: 85
|
||||
years: "6+"
|
||||
description: "EC2, S3, Lambda, CloudFront, RDS"
|
||||
- name: "Docker/Kubernetes"
|
||||
level: 80
|
||||
years: "5+"
|
||||
description: "Containerization, orchestration"
|
||||
- name: "CI/CD"
|
||||
level: 90
|
||||
years: "8+"
|
||||
description: "GitHub Actions, Jenkins, CircleCI"
|
||||
---
|
||||
|
||||
As a technology professional, I've developed expertise across multiple technical domains throughout my career. This skills showcase highlights my technical capabilities, from programming languages to architectural patterns and methodologies.
|
||||
@@ -0,0 +1,18 @@
|
||||
---
|
||||
date: '2024-11-25T21:50:45+01:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Dana Oneal'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
name: "International Interrogations" # place/city/country for the experience. Fill-in.
|
||||
position: "Internal Intern" # from-to, for example "2022-2024". Fill-in.
|
||||
|
||||
params:
|
||||
image:
|
||||
src: "images/testimonials/testimonial2.png" # example: "images/clients/asgardia.png"
|
||||
scale: 0.5
|
||||
|
||||
## For the content, you can use markdown
|
||||
##
|
||||
---
|
||||
|
||||
I had the pleasure of working with this freelancer on several projects, and their performance has been nothing short of outstanding. They bring a high level of expertise, creativity, and dedication to every task. Their ability to understand project requirements and deliver exceptional results on time is truly impressive. They are a reliable and proactive professional who consistently exceeds expectations. I highly recommend this freelancer to anyone seeking top-notch skills and a collaborative partner.
|
||||
@@ -0,0 +1,18 @@
|
||||
---
|
||||
date: '2024-11-25T21:30:46+01:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Ferdinand Shermand'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
name: "Ferdinand Shermand" # place/city/country for the experience. Fill-in.
|
||||
position: "Butterfly collector" # from-to, for example "2022-2024". Fill-in.
|
||||
|
||||
params:
|
||||
image:
|
||||
src: "images/testimonials/testimonial3.png" # example: "images/clients/asgardia.png"
|
||||
scale: 0.5
|
||||
|
||||
## For the content, you can use markdown
|
||||
##
|
||||
---
|
||||
|
||||
Working with this colleague has been an absolute pleasure. Their dedication, professionalism, and positive attitude make them an invaluable asset to our team. They consistently go above and beyond to ensure that projects are completed on time and to the highest standard. Their ability to collaborate effectively and support their colleagues is truly commendable. I am continually impressed by their innovative thinking and problem-solving skills. This colleague is not just a team member but a true inspiration and a driving force behind our team’s success.
|
||||
@@ -0,0 +1,30 @@
|
||||
---
|
||||
date: '2024-11-25T21:53:18+01:00' # date in which the content is created - defaults to "today"
|
||||
title: 'Graziella Nutella'
|
||||
draft: false # set to "true" if you want to hide the content
|
||||
|
||||
name: "Nutting Hill" # place/city/country for the experience. Fill-in.
|
||||
position: "Nutcracker" # from-to, for example "2022-2024". Fill-in.
|
||||
|
||||
params:
|
||||
image:
|
||||
src: "images/testimonials/testimonial1.png" # example: "images/clients/asgardia.png"
|
||||
scale: 0.5
|
||||
|
||||
## For the content, you can use markdown
|
||||
##
|
||||
---
|
||||
|
||||
The content of this section comes from the `content/testimonial` folder contents. This that you see is in `content/testimonial/graziella-nutella.md`.
|
||||
|
||||
You can also use parameters for configuration:
|
||||
|
||||
```
|
||||
name: "Nutting Hill" # place/city/country for the experience. Fill-in.
|
||||
position: "Nutcracker" # from-to, for example "2022-2024". Fill-in.
|
||||
|
||||
params:
|
||||
image:
|
||||
src: "images/testimonials/testimonial1.png" # example: "images/clients/asgardia.png"
|
||||
scale: 0.5
|
||||
```
|
||||
Reference in New Issue
Block a user