### Synchronize Example Content and Assets

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Use rsync to copy example content and static assets from the theme to your site's content and static directories for a complete preview.

```bash
rsync -av themes/hugo-profile/exampleSite/static/ ./static/
rsync -av themes/hugo-profile/exampleSite/content/ ./content/
```

--------------------------------

### Start Hugo Development Server

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Run this command to start the Hugo development server and preview your site.

```bash
hugo server
```

--------------------------------

### Copy Example Configuration File

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Copy the example `hugo.yaml` configuration file from the theme to your site's root directory.

```bash
cp -f themes/hugo-profile/exampleSite/hugo.yaml ./hugo.yaml
```

--------------------------------

### Check Hugo Version

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Run this command to verify your installed Hugo version. Ensure it is 0.87.0 or higher.

```bash
hugo version
```

--------------------------------

### Pink Color Variant Configuration

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Example configuration for the Pink color theme. This sets specific hex codes for text, background, and primary/secondary colors.

```yaml
color:
    textColor: "#D1D1D1"
    secondaryTextColor: "#C1A3A3"
    backgroundColor: "#470D21"
    primaryColor: "#F3F0D7"
    secondaryColor: "#781D42"
```

--------------------------------

### Blue Color Variant Configuration

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Example configuration for the Blue color theme. This sets specific hex codes for text, background, and primary/secondary colors.

```yaml
color:
    textColor: "#2C3333"
    secondaryTextColor: "#F5F5F5"
    backgroundColor: "#54BAB9"
    primaryColor: "#F0F0F0"
    secondaryColor: "#78C2C3"
```

--------------------------------

### Navy Color Variant Configuration

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Example configuration for the Navy color theme. This sets specific hex codes for text, background, and primary/secondary colors.

```yaml
color:
    textColor: "#F5F5F5"
    secondaryTextColor: "#F5F5F5"
    backgroundColor: "#313552"
    primaryColor: "#F1E0AC"
    secondaryColor: "#30475E"
```

--------------------------------

### Red Color Variant Configuration

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Example configuration for the Red color theme. This sets specific hex codes for text, background, and primary/secondary colors.

```yaml
color:
    textColor: "#121212"
    secondaryTextColor: "#311D3F"
    backgroundColor: "#FF6363"
    primaryColor: "#30475E"
    secondaryColor: "#F05454"
```

--------------------------------

### Get Recent Blog Posts Path and Section

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/footer/recentBlogPosts.html

Retrieves the path for recent posts from site parameters, defaulting to 'blogs'. It then uses `site.GetPage` to get the corresponding section page and its regular pages.

```html
{{ $recentPostsPath := .Site.Params.footer.recentPosts.path | default "blogs" }}
{{- /* Get the blogs section page */ -}}
{{ $blogsSection := site.GetPage "section" $recentPostsPath }}
{{ $allSectionPosts := slice }}
{{ if $blogsSection }}
  {{ $allSectionPosts = $blogsSection.RegularPages }}
{{ end }}
```

--------------------------------

### Green Color Variant Configuration

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Example configuration for the Green color theme. This sets specific hex codes for text, background, and primary/secondary colors.

```yaml
color:
    textColor: "#161616"
    secondaryTextColor: "#311D3F"
    backgroundColor: "#34BE82"
    primaryColor: "#194350"
    secondaryColor: "#2FDD92"
```

--------------------------------

### Add New Language Translation File in Hugo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Create a TOML file in the 'i18n/' directory to define translations for a new language. This example shows how to add German translations for navigation items.

```toml
[nav_about]
other = "Über uns"

[nav_experience]
other = "Erfahrung"

# Add all other translations...
```

--------------------------------

### Enable Emoji Globally in Hugo Configuration

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/emoji-support.md

Set `enableEmoji` to `true` in your site's configuration file to enable emoji shorthand codes directly in content files. This requires no additional setup beyond modifying the configuration.

```yaml
enableEmoji: true
```

--------------------------------

### Create New Hugo Site with YAML Config

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Use this command to create a new Hugo site that uses a `hugo.yaml` configuration file.

```bash
hugo new site my-site --format="yaml"
```

--------------------------------

### Manual Hugo Site Deployment

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Use this command to generate a static site for deployment. It's recommended to clear the public directory before each build to ensure only the latest output is present.

```bash
rm -rf public/ && hugo
```

--------------------------------

### Build Standard Hugo Edition

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/README.md

Use this command to build the standard edition of Hugo from source. Requires Go 1.19 or later.

```text
go install github.com/gohugoio/hugo@latest
```

--------------------------------

### Display Hugo Environment Information

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/README.md

Run this command to display a list of dependencies and other environment details. Use --logLevel info for more verbose output.

```bash
hugo env --logLevel info
```

--------------------------------

### Configure Contact Section

Source: https://github.com/gurusabarish/hugo-profile/wiki/Pages-or-Sections

Enable the contact section and set its content, email address, and button name.

```yaml
contact:
    enable: true
    content: My inbox is always open. Whether you have a question or just want to say hi, I’ll try my best to get back to you!
    email: gurusabarisha@gmail.com
    btnName: Mail me
```

--------------------------------

### Enable Custom CSS

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Enable the use of custom CSS by setting 'customCSS' to true in config.yaml. Ensure a 'style.css' file exists in the static folder.

```yaml
params:
  customCSS: true
```

--------------------------------

### Responsive Images with Cloudinary (Basic)

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/rich-content.md

Use the dynamic-img shortcode for responsive images hosted on Cloudinary. Provide the image path and a title. The file extension is omitted as it's auto-detected.

```html
{{</* dynamic-img src="/my/image/on/cloudinary" title="A title for the image" */>}}
```

--------------------------------

### Create New Blog Post in Hugo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Use this command to create a new markdown file for a blog post in the 'content/blogs/' directory. It includes pre-filled front matter.

```bash
hugo new content content/blogs/my-post.md
```

--------------------------------

### Configure Color Palette

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Set custom text, background, and primary colors for both light and dark modes in config.yaml. Use '<value>' as a placeholder for actual color codes.

```yaml
params:
  color:
    textColor: <value>
    secondaryTextColor: <value>
    backgroundColor: <value>
    secondaryBackgroundColor: <value> 
    primaryColor: <value>
    secondaryColor: <value>

    darkmode:
      textColor: <value>
      secondaryTextColor: <value>
      backgroundColor: <value>
      secondaryBackgroundColor: <value>
      primaryColor: <value>
      secondaryColor: <value>
```

--------------------------------

### Build Extended Hugo Edition

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/README.md

Use this command to build the extended edition of Hugo from source, enabling features like WebP image encoding and Sass transpilation. Requires Go 1.19 or later and GCC. Ensure CGO is enabled.

```text
CGO_ENABLED=1 go install -tags extended github.com/gohugoio/hugo@latest
```

--------------------------------

### Ordered List

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Create an ordered list using numbers followed by periods.

```markdown
1. First item
2. Second item
3. Third item
```

--------------------------------

### Configure Font Properties

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Customize font size, weight, line height, and text alignment in config.yaml. Defaults are provided for each property.

```yaml
params:
    font:
        fontSize: 1.5rem # default: 1rem
        fontWeight: 500 # default: 400
        lineHeight: 1 # default: 1.5
        textAlign: right # default: left
```

--------------------------------

### Configure Navbar Properties

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Customize navbar alignment, brand logo, and brand name in config.yaml. Default values are used if not specified.

```yaml
params:
    navbar:
        align: mx-auto
        brandLogo: "/logo.png" # Logo for the brand | default is the favicon variable
        brandName: "Profile" # Brand name for the brand | default is the title variable
```

--------------------------------

### Configure and Select Recent Posts

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/footer/recentBlogPosts.html

Checks if recent posts are enabled and if there are any posts available. It then sets the count of recent posts to display, defaulting to 3, and selects the first N posts from the `allSectionPosts` list.

```html
{{ $currentNumOfrecentPosts := len $allSectionPosts }}
{{ if and (gt $currentNumOfrecentPosts 0) (.Site.Params.footer.recentPosts.enable | default false) }}

{{ $recentPostsCount := .Site.Params.footer.recentPosts.count | default 3 }}
{{ $recentPosts := $allSectionPosts | first $recentPostsCount }}
```

--------------------------------

### Configure Static File Path

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Set the sub-path for serving static files in config.yaml, useful for websites hosted in a sub-directory like '<ghuser-or-org>.github.io/myhugosite/'.

```yaml
params:
  staticPath: "/your/path/"
```

--------------------------------

### Basic Table

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Hugo supports tables out-of-the-box. Define columns and rows using pipes and hyphens.

```markdown
| Name  | Age |
| ----- | --- |
| Bob   | 27  |
| Alice | 23  |
```

--------------------------------

### Responsive Images with Cloudinary (Styled)

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/rich-content.md

Customize the CSS styles for responsive images using the dynamic-img shortcode by adding a style parameter. The file extension is omitted as it's auto-detected.

```html
{{</* dynamic-img src="/my/image/on/cloudinary" title="A title for the image" style="max-width:60%" */>}}
```

--------------------------------

### Theme Toggling Logic

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/header.html

Handles theme switching based on local storage and user's OS preference. Adds or removes 'dark' class to document elements.

```javascript
let localStorageValue = localStorage.getItem("pref-theme");
let mediaQuery = window.matchMedia('(prefers-color-scheme: dark)').matches;
switch (localStorageValue) {
  case "dark":
    document.documentElement.classList.add('dark');
    document.body.classList.add('dark');
    break;
  case "light":
    document.body.classList.remove('dark');
    document.documentElement.classList.remove('dark');
    break;
  default:
    if (mediaQuery) {
      document.documentElement.classList.add('dark');
      document.body.classList.add('dark');
    }
    break;
}
```

--------------------------------

### Unordered List

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Create an unordered list using hyphens, asterisks, or plus signs.

```markdown
- List item
- Another item
- And another item
```

--------------------------------

### List of Hugo Project Dependencies

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/README.md

This section lists the Go modules that Hugo relies on. It includes version information for each dependency.

```text
cloud.google.com/go/compute/metadata="v0.2.3"
cloud.google.com/go/iam="v1.1.3"
cloud.google.com/go/storage="v1.31.0"
cloud.google.com/go="v0.110.8"
github.com/Azure/azure-sdk-for-go/sdk/azcore="v1.7.0"
github.com/Azure/azure-sdk-for-go/sdk/azidentity="v1.3.0"
github.com/Azure/azure-sdk-for-go/sdk/internal="v1.3.0"
github.com/Azure/azure-sdk-for-go/sdk/storage/azblob="v1.1.0"
github.com/AzureAD/microsoft-authentication-library-for-go="v1.0.0"
github.com/BurntSushi/locker="v0.0.0-20171006230638-a6e239ea1c69"
github.com/PuerkitoBio/purell="v1.1.1"
github.com/PuerkitoBio/urlesc="v0.0.0-20170810143723-de5bf2ad4578"
github.com/alecthomas/chroma/v2="v2.11.1"
github.com/armon/go-radix="v1.0.0"
github.com/aws/aws-sdk-go-v2/aws/protocol/eventstream="v1.4.11"
github.com/aws/aws-sdk-go-v2/config="v1.18.32"
github.com/aws/aws-sdk-go-v2/credentials="v1.13.31"
github.com/aws/aws-sdk-go-v2/feature/ec2/imds="v1.13.7"
github.com/aws/aws-sdk-go-v2/feature/s3/manager="v1.11.76"
github.com/aws/aws-sdk-go-v2/internal/configsources="v1.1.37"
github.com/aws/aws-sdk-go-v2/internal/endpoints/v2="v2.4.31"
github.com/aws/aws-sdk-go-v2/internal/ini="v1.3.38"
github.com/aws/aws-sdk-go-v2/internal/v4a="v1.1.0"
github.com/aws/aws-sdk-go-v2/service/internal/accept-encoding="v1.9.12"
github.com/aws/aws-sdk-go-v2/service/internal/checksum="v1.1.32"
github.com/aws/aws-sdk-go-v2/service/internal/presigned-url="v1.9.31"
github.com/aws/aws-sdk-go-v2/service/internal/s3shared="v1.15.0"
github.com/aws/aws-sdk-go-v2/service/s3="v1.38.1"
github.com/aws/aws-sdk-go-v2/service/sso="v1.13.1"
github.com/aws/aws-sdk-go-v2/service/ssooidc="v1.15.1"
github.com/aws/aws-sdk-go-v2/service/sts="v1.21.1"
github.com/aws/aws-sdk-go-v2="v1.20.0"
github.com/aws/aws-sdk-go="v1.48.2"
github.com/aws/smithy-go="v1.14.0"
github.com/bep/clocks="v0.5.0"
github.com/bep/debounce="v1.2.0"
github.com/bep/gitmap="v1.1.2"
github.com/bep/goat="v0.5.0"
github.com/bep/godartsass/v2="v2.0.0"
github.com/bep/godartsass="v1.2.0"
github.com/bep/golibsass="v1.1.1"
github.com/bep/gowebp="v0.3.0"
github.com/bep/lazycache="v0.2.0"
github.com/bep/logg="v0.3.0"
github.com/bep/mclib="v1.20400.20402"
github.com/bep/overlayfs="v0.6.0"
github.com/bep/simplecobra="v0.3.2"
github.com/bep/tmc="v0.5.1"
github.com/clbanning/mxj/v2="v2.7.0"
github.com/cli/safeexec="v1.0.1"
github.com/cpuguy83/go-md2man/v2="v2.0.2"
github.com/disintegration/gift="v1.2.1"
github.com/dlclark/regexp2="v1.10.0"
github.com/dustin/go-humanize="v1.0.1"
github.com/evanw/esbuild="v0.19.7"
github.com/fatih/color="v1.16.0"
github.com/frankban/quicktest="v1.14.6"
github.com/fsnotify/fsnotify="v1.7.0"
github.com/getkin/kin-openapi="v0.120.0"
github.com/ghodss/yaml="v1.0.0"
github.com/go-openapi/jsonpointer="v0.19.6"
github.com/go-openapi/swag="v0.22.4"
github.com/gobuffalo/flect="v1.0.2"
github.com/gobwas/glob="v0.2.3"
github.com/gohugoio/go-i18n/v2="v2.1.3-0.20230805085216-e63c13218d0e"
github.com/gohugoio/locales="v0.14.0"
github.com/gohugoio/localescompressed="v1.0.1"
github.com/golang-jwt/jwt/v4="v4.5.0"
github.com/golang/groupcache="v0.0.0-20210331224755-41bb18bfe9da"
github.com/golang/protobuf="v1.5.3"
github.com/google/go-cmp="v0.6.0"
github.com/google/s2a-go="v0.1.7"
github.com/google/uuid="v1.4.0"
github.com/google/wire="v0.5.0"
github.com/googleapis/enterprise-certificate-proxy="v0.3.2"
github.com/googleapis/gax-go/v2="v2.12.0"
github.com/gorilla/websocket="v1.5.1"
github.com/hairyhenderson/go-codeowners="v0.4.0"
github.com/hashicorp/golang-lru/v2="v2.0.1"
github.com/invopop/yaml="v0.2.0"
github.com/jdkato/prose="v1.2.1"
github.com/jmespath/go-jmespath="v0.4.0"
github.com/josharian/intern="v1.0.0"
github.com/kr/pretty="v0.3.1"
github.com/kr/text="v0.2.0"
github.com/kylelemons/godebug="v1.1.0"
github.com/kyokomi/emoji/v2="v2.2.12"
github.com/mailru/easyjson="v0.7.7"
github.com/marekm4/color-extractor="v1.2.1"
github.com/mattn/go-colorable="v0.1.13"
github.com/mattn/go-isatty="v0.0.20"
github.com/mattn/go-runewidth="v0.0.9"

```

--------------------------------

### Cloudinary Responsive Images

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Initializes Cloudinary's responsive image functionality using the provided cloud name.

```javascript
var cl = cloudinary.Cloudinary.new({cloud_name: "{{- .Site.Params.cloudinary_cloud_name }}"});
cl.responsive();
```

--------------------------------

### Configure Main Menu Items

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Define main menu items, including their identifier, name, title, URL, and weight, following Hugo's menu structure. Supports nested dropdown menus.

```yaml
Menus:
  main:
    - identifier: blog
      name: Blog
      title: Blog posts
      url: /blog
      weight: 1

    #Dropdown menu
    - identifier: dropdown
      title: Example dropdown menu
      name: Dropdown
      weight: 2
    - identifier: dropdown1
      title: example dropdown 1
      name: example 1
      url: /#
      parent: dropdown
      weight: 1
    - identifier: dropdown2
      title: example dropdown 2
      name: example 2
      url: /#
      parent: dropdown
      weight: 2
```

--------------------------------

### Configure About Section

Source: https://github.com/gurusabarish/hugo-profile/wiki/Pages-or-Sections

This YAML configuration enables and customizes the 'About Me' section. It allows for a title, an image, detailed content, and a list of skills with an optional title.

```yaml
about:
    enable: true
    title: "About Me"
    image: '/images/me.png'
    content: |-
      I am a software developer with a passion for web development. I have a background in computer science and mathematics, and I have a strong interest in the intersection of technology and art. I am currently working as a software developer at [example org.](https://example.com) in San Francisco, CA. 
      
      I am currently working on a project that will be used to help people find the best way to get around the city.
    skills:
      enable: true
      title: "Here are a few technologies I've been working with recently:"
      items:
        - "HTML"
        - "CSS"
        - "JavaScript"
        - "React"
        - "Node"
        - "Express"
```

--------------------------------

### Configure Hero Section

Source: https://github.com/gurusabarish/hugo-profile/wiki/Pages-or-Sections

Use this YAML configuration to enable and customize the hero section. It includes options for introductory text, titles, subtitles, content, images, call-to-action buttons, and social media links.

```yaml
hero:
    enable: true
    intro: "Hi, my name is"
    title: "Isabella."
    subtitle: "I build things for the web"
    content: "A passionate web app developer. I tend to make use of modern web technologies to build websites that looks great, feels fantastic, and functions correctly."
    image: /images/hero.svg
    button:
      enable: true
      name: "Resume"
      url: "#"
    socialLinks:
      fontAwesomeIcons:
        - icon: fab fa-github
          url: https://example.com
        - icon: fab fa-twitter
          url: https://example.com
      customIcons:
        - icon: /fav.png
          url: "https://example.com"
```

--------------------------------

### Theme Toggling Logic

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Handles switching between light, dark, and system-default themes. It updates the document's classes and local storage to persist the user's preference.

```javascript
if (document.body.className.includes("dark")) { document.body.classList.remove('dark'); document.documentElement.classList.remove('dark'); localStorage.setItem("pref-theme", 'light'); } else if (document.body.className.includes("light")) { document.documentElement.classList.add('dark'); document.body.classList.add('dark'); localStorage.setItem("pref-theme", 'dark'); } else if (localStorage.getItem("pref-theme") === "dark") { document.documentElement.classList.add('dark'); document.body.classList.add('dark'); } else if (localStorage.getItem("pref-theme") === "light") { document.body.classList.remove('dark') document.documentElement.classList.remove('dark'); } else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { document.documentElement.classList.add('dark'); document.body.classList.add('dark'); }
```

--------------------------------

### Render Block Equations with Mathjax

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/math.md

Enable Mathjax in your page's frontmatter by setting `mathjax: true`. Use `$$ ... $$` on a new line to render block equations.

```markdown
$$ | Pr_{x \leftarrow P_{1}} [A(x) = 1] - Pr_{x \leftarrow P_{2}} [A(x) = 1] | < \text{negligible} $$
```

--------------------------------

### General Color Customization Format

Source: https://github.com/gurusabarish/hugo-profile/wiki/Color-Customization

Defines the general structure for customizing colors in the configuration file, including options for both light and dark modes.

```yaml
color:
  textColor: <value>
  secondaryTextColor: <value>
  backgroundColor: <value>
  secondaryBackgroundColor: <value> 
  primaryColor: <value>
  secondaryColor: <value>

  darkmode:
    textColor: <value>
    secondaryTextColor: <value>
    backgroundColor: <value>
    secondaryBackgroundColor: <value>
    primaryColor: <value>
    secondaryColor: <value>
```

--------------------------------

### Configure Theme Toggle

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Control the theme toggle functionality and set the default theme (light or dark) in config.yaml. By default, the toggle is enabled and the theme is auto.

```yaml
params:
    theme:
        disableThemeToggle: false
        defaultTheme: "light" # or dark
```

--------------------------------

### Keyboard Input Element

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use the kbd tag to represent keyboard input.

```html
Press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd></kbd> to end the session.
```

--------------------------------

### Search Index Configuration

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Sets the URL for the search index JSON file, which is required for the search functionality to work correctly.

```javascript
window.searchIndexURL = {{ .Site.Home.RelPermalink | printf "%sindex.json" | jsonify | safeJS }};
```

--------------------------------

### Mark Element

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use the mark tag to highlight text.

```html
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.
```

--------------------------------

### Add Hugo Profile Theme via Git Clone

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Clone the Hugo Profile theme repository into your site's themes directory. This method allows for easy customization.

```bash
cd my-site/themes
git clone https://github.com/gurusabarish/hugo-profile.git
```

--------------------------------

### MathJax Configuration

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Configures MathJax for rendering mathematical equations, including inline and display math syntax, processing escapes, and handling specific tags.

```javascript
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['\\(','\\)']],
    displayMath: [['$$','$$'], ['\\[','\\]']],
    processEscapes: true,
    processEnvironments: true,
    skipTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
    TeX: {
      equationNumbers: { autoNumber: "AMS" },
      extensions: ["AMSmath.js", "AMSsymbols.js"]
    }
  }
});
```

--------------------------------

### Image Rendering

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Conditionally renders an image if the 'image' parameter is set in the page's front matter.

```html
{{ if .Params.image }}

![{{ .Title }}]({{ .Params.image }})

{{ end }}
```

--------------------------------

### Configure Footer Social Networks

Source: https://github.com/gurusabarish/hugo-profile/wiki/Configuration

Specify social network links to be displayed in the footer. Uncomment the 'recentPosts' option to show recent posts.

```yaml
footer:
    # recentPosts: false
    socialNetworks:
      github: https://github.com
      linkedin: https://linkedin.com
      twitter: https://twitter.com
      instagram: https://instagram.com
      facebook: https://facebook.com
```

--------------------------------

### Render Font Awesome Social Links

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/hero/social.html

Iterates over Font Awesome social links defined in site parameters to render them as links.

```html
{{ range .Site.Params.hero.socialLinks.fontAwesomeIcons }} []({{ .url }}){{ end }}
```

--------------------------------

### Display Recent Posts Loop

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/footer/recentBlogPosts.html

Iterates over the selected recent posts. For each post, it optionally displays a featured image if not disabled and an image is present, followed by the post title, summary, date, and a 'read more' link.

```html
{{ range $recentPosts }}

{{ if and (not (.Site.Params.footer.recentPosts.disableFeaturedImage | default false)) (.Params.image) }}

[![{{ .Title }}]({{ .Params.image }})]({{ .RelPermalink }})

{{ end }}

[

##### {{ .Title | truncate 25 }}

]({{ .RelPermalink }})

{{ .Summary | truncate 300}}

{{ .Date | time.Format (":date\_long" | default "January 2, 2006") }} [{{ .Site.Params.terms.read | default (i18n "read")}}]({{ .RelPermalink }})

{{ end }}

{{ end }}
```

--------------------------------

### Add New Language Configuration in Hugo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Include the new language in your 'hugo.yaml' configuration file to enable it for your site. Assign a weight to determine its order.

```yaml
languages:
  de:
    languageName: "Deutsch"
    weight: 4
```

--------------------------------

### Theme Toggle Event Listener

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Attaches a click event listener to the theme toggle button to trigger theme changes and initializes Bootstrap tooltips.

```javascript
document.getElementById("theme-toggle").addEventListener("click", () => { if (document.body.className.includes("dark")) { document.body.classList.remove('dark'); document.documentElement.classList.remove('dark'); localStorage.setItem("pref-theme", 'light'); } else { document.body.classList.add('dark'); document.documentElement.classList.add('dark'); localStorage.setItem("pref-theme", 'dark'); } }); var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')) var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { return new bootstrap.Tooltip(tooltipTriggerEl) })
```

--------------------------------

### Add Hugo Profile Theme as Git Submodule

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Add the Hugo Profile theme as a Git submodule to your site. This facilitates structured updates from the original repository.

```bash
cd my-site
git init
git submodule add https://github.com/gurusabarish/hugo-profile.git themes/hugo-profile
```

--------------------------------

### Render Custom Social Links

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/hero/social.html

Iterates over custom social links defined in site parameters, rendering them with custom icons and URLs.

```html
{{ range .Site.Params.hero.socialLinks.customIcons }}  [![]({{ .icon }})]({{ .url }}){{ end }}
```

--------------------------------

### Page Metadata Rendering

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Renders page metadata including title, author (if present), date, and estimated reading time. The reading time can be enabled/disabled via site or page parameters.

```html
{{ .Title }}
============

{{ if .Params.author }} {{ .Params.author }} | {{ end }} {{ .Date | time.Format (":date_medium" | default "Jan 2, 2006") }} {{ if or (.Site.Params.singlePages.readTime.enable | default true) (.Params.enableReadingTime) }} {{ .Site.Params.readTime.content | default (i18n "min_read") }} {{ end }}
```

--------------------------------

### Scroll Progress and To-Top Button JavaScript

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Implements a scroll-to-top button that appears after scrolling down 20px and disappears when scrolling back to the top. It also dynamically sets the top offset for a sticky sidebar based on header height and navbar configuration.

```javascript
var topScroll = document.getElementById("topScroll");
window.onscroll = function() {scrollFunction()};

function scrollFunction() {
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
    topScroll.style.display = "block";
  } else {
    topScroll.style.display = "none";
  }
}

function topFunction() {
  document.body.scrollTop = 0;
  document.documentElement.scrollTop = 0;
}

// To set height of sticky sidebar dynamically
let stickySideBarElem = document.getElementById("stickySideBar");
let stickyNavBar = {{ .Site.Params.navbar.stickyNavBar.enable | default false }};

if(stickyNavBar) {
  let headerElem = document.getElementById("profileHeader");
  let headerHeight = headerElem.offsetHeight + 15;
  stickySideBarElem.style.top = headerHeight + "px";
} else {
  stickySideBarElem.style.top = "50px";
}
```

--------------------------------

### Nested List

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Nest lists by indenting sub-items under parent list items.

```markdown
- Item
  1. First Sub-item
  2. Second Sub-item
```

--------------------------------

### Content and Table of Contents Rendering

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Renders the main page content, including emojis, and the table of contents if enabled. The table of contents title can be customized.

```html
{{ .Content | emojify }}

{{ if .Params.toc | default true}}

##### {{ .Site.Params.terms.toc | default (i18n "toc") }}

{{.TableOfContents}}

{{ end }}
```

--------------------------------

### Superscript Element

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use the sup tag for superscript text.

```html
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
```

--------------------------------

### Heading Levels

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Markdown supports six levels of headings, from H1 (highest) to H6 (lowest), using hash symbols.

```markdown
# H1

## H2

### H3

#### H4

##### H5

###### H6
```

--------------------------------

### Disqus Integration

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Includes the Disqus comment system for the page if configured.

```html
{{ template "_internal/disqus.html" . }}
```

--------------------------------

### Hugo Navigation Links

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/header.html

Renders navigation links for About, Experience, Education, Projects, Achievements, and Contact sections if enabled in site parameters.

```html
{{ if and (.Site.Params.about.enable | default false) (not (.Site.Params.navbar.menus.disableAbout | default false)) }}*   [{{ .Site.Params.about.title | default (i18n "nav_about")}}]({{ .Site.Home.RelPermalink }}#about)
{{ end }} {{ if and (.Site.Params.experience.enable | default false) (not (.Site.Params.navbar.menus.disableExperience | default false)) }}*   [{{ .Site.Params.experience.title | default (i18n "nav_experience")}}]({{ .Site.Home.RelPermalink }}#experience)
{{ end }} {{ if and (.Site.Params.education.enable | default false) (not (.Site.Params.navbar.menus.disableEducation | default false)) }}*   [{{ .Site.Params.education.title | default (i18n "nav_education")}}]({{ .Site.Home.RelPermalink }}#education)
{{ end }} {{ if and (.Site.Params.projects.enable | default false) (not (.Site.Params.navbar.menus.disableProjects | default false)) }}*   [{{ .Site.Params.projects.title | default (i18n "nav_projects")}}]({{ .Site.Home.RelPermalink }}#projects)
{{ end }} {{ if and (.Site.Params.achievements.enable | default false) (not (.Site.Params.navbar.menus.disableAchievements | default false)) }}*   [{{ .Site.Params.achievements.title | default (i18n "nav_achievements")}}]({{ .Site.Home.RelPermalink }}#achievements)
{{ end }} {{ if and (.Site.Params.contact.enable | default false) (not (.Site.Params.navbar.menus.disableContact | default false)) }}*   [{{ .Site.Params.contact.title | default (i18n "nav_contact")}}]({{ .Site.Home.RelPermalink }}#contact)
{{ end }}
```

--------------------------------

### Hugo Main Menu Rendering

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/header.html

Renders the main navigation menu items, including support for nested dropdown menus.

```html
{{ range .Site.Menus.main }} {{ if .HasChildren }}*   [{{ .Name }}]({{ .URL }} "{{ .Title }}")
    
    {{ range .Children }} [{{ .Name }}]({{ .URL }} "{{ .Title }}") {{ end }}
    
{{else}}*   [{{ .Pre }} {{ .Name }}]({{.URL}} "{{ .Title }}")
{{end}} {{end}}
```

--------------------------------

### Sticky Header on Scroll

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/header.html

Implements a sticky header that appears/disappears based on scroll direction. Requires the 'profileHeader' element to be present.

```javascript
let profileHeaderElem = document.getElementById("profileHeader");
let currentScrollPos = window.pageYOffset;
let resetHeaderStyle = false;
let showNavBarOnScrollUp = {{ $showNavBarOnScrollUp }};
let showNavBar = showNavBarOnScrollUp ? prevScrollPos > currentScrollPos : currentScrollPos > 0;
if (showNavBar) {
  profileHeaderElem.classList.add("showHeaderOnTop");
} else {
  resetHeaderStyle = true;
}
if(currentScrollPos === 0) {
  resetHeaderStyle = true;
}
if(resetHeaderStyle) {
  profileHeaderElem.classList.remove("showHeaderOnTop");
}
prevScrollPos = currentScrollPos;
```

--------------------------------

### Tags Rendering

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Renders a list of tags associated with the page, with each tag linking to its respective tag archive page. This section is displayed if the 'tags' parameter is present.

```html
{{ if .Params.tags }}

##### {{ .Site.Params.terms.tags | default (i18n "tags") }}

{{range .Params.tags}} {{ $tagURL := printf "tags/%s" (. | urlize) }}*   [{{.}}]( {{ $tagURL | relLangURL }})
{{end}}

{{end}}
```

--------------------------------

### Configure Default Language and Subdirectories in Hugo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

Set the default content language and control whether it appears in a subdirectory. This is essential for multilingual sites.

```yaml
defaultContentLanguage: "en"
defaultContentLanguageInSubdir: false

languages:
  en:
    languageName: "English"
    weight: 1
  es:
    languageName: "Español"
    weight: 2
  fr:
    languageName: "Français"
    weight: 3
```

--------------------------------

### Render Inline Equations with Mathjax

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/math.md

Use `\( ... \)` for inline equations. This is useful for embedding mathematical expressions within sentences.

```markdown
Write in-line equations with `\\( ... \\)` , like \\( x^n / y \\) . It's easy!
```

--------------------------------

### CSS for Styling Emoji Glyphs

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/emoji-support.md

Use this CSS to ensure consistent rendering of emoji across different platforms and browsers by specifying a font stack. Apply the `.emoji` class to elements containing emoji.

```css
.emoji {
  font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
}
```

--------------------------------

### Dynamic Image Shortcode Logic

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/shortcodes/dynamic-img.html

This Hugo shortcode retrieves image source, title, width, and style attributes. It defaults width to 'w_auto' and style to 'max-width:80%' if not provided.

```html
{{ $image := .Get "src" }} {{ $alt := .Get "title" }} {{ $width := .Get "width" | default "w_auto" }} {{ $style := .Get "style" | default "max-width:80%" }}
```

--------------------------------

### Troubleshooting TLS Handshake Timeout Error

Source: https://github.com/gurusabarish/hugo-profile/blob/master/README.md

This error typically indicates network issues. If it persists, consider removing the problematic tweet shortcode from your content file.

```go
ERROR error calling resources.GetRemote: Get "https://publish.twitter.com/oembed?dnt=false&url=https%3A%2F%2Ftwitter.com%2FGoHugoIO%2Fstatus%2F1315233626070503424": net/http: TLS handshake timeout
Built in 10266 ms
Error: error building site: logged 1 error(s)
```

```go
{{< tweet user="GoHugoIO" id="1315233626070503424" >}}
```

--------------------------------

### Hugo Navigation Brand/Logo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/header.html

Conditionally displays the brand logo and name in the header based on site parameters.

```html
[{{ if and (or (.Site.Params.favicon) (.Site.Params.navbar.brandLogo)) (.Site.Params.navbar.showBrandLogo | default true) }} ![]({{ .Site.Params.navbar.brandLogo | default .Site.Params.favicon }}) {{ .Site.Params.navbar.brandName | default .Site.Params.title }} {{ else }} {{ .Site.Params.navbar.brandName | default .Site.Params.title }} {{ end }}]({{ .Site.Home.RelPermalink }})
```

--------------------------------

### HTML Code Block with Backticks

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use triple backticks to define HTML code blocks. Specify the language for syntax highlighting.

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Example HTML5 Document</title>
  </head>
  <body>
    <p>Test</p>
  </body>
</html>
```

--------------------------------

### Conditional Contact Section Display

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/contact.html

This snippet shows how to conditionally render the entire contact section based on a site parameter. It also demonstrates how to retrieve contact-specific parameters, falling back to global or language-specific settings.

```html
{{ if .Site.Params.contact.enable | default false }}
{{- $contact := .Site.Language.Params.contact | default .Site.Params.contact -}}

### {{ $contact.title | default (i18n "contact") }}

{{ $contact.content | emojify | markdownify }}

{{ if .Site.Params.contact.formspree.enable | default false }}

{{ $contact.btnName | default .Site.Params.contact.btnName | default (i18n "contact") }}

{{ else if or (.Site.Params.contact.email) (.Site.Params.contact.btnLink) }}

[{{ $contact.btnName | default .Site.Params.contact.btnName | default (i18n "contact") }}]({{ if .Site.Params.contact.btnLink }}
                                    {{ .Site.Params.contact.btnLink | default "#" }}
                                  {{ else }}
                                    mailto:{{ .Site.Params.contact.email }}
                                  {{ end }})

{{ end }}

{{ end }}
```

--------------------------------

### Display Multilingual Language Switcher in Hugo

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/language-switcher.html

Use this partial to render a language switcher when hugo.IsMultilingual is true. It prioritizes page-specific translations and falls back to site-wide translations if none are found for the current page.

```html
{{ if hugo.IsMultilingual }}*   [{{ with .Language }} 🌐 {{ .LanguageName }} {{ end }}](#)
    
    {{- /* Use page translations if available, otherwise fall back to site languages */ -}} {{- $translations := .AllTranslations -}} {{- if eq (len $translations) 1 -}} {{- /* No translations for this page, use home page translations */ -}} {{- range site.Home.AllTranslations -}} [{{ .Language.LanguageName }}]({{ .RelPermalink }} "{{ .Language.LanguageName }}") {{- end -}} {{- else -}} {{- /* Page has translations, use them */ -}} {{- range $translations -}} [{{ .Language.LanguageName }}]({{ .RelPermalink }} "{{ .Language.LanguageName }}") {{- end -}} {{- end -}}
    
{{ end }}
```

--------------------------------

### Abbreviation Element

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use the abbr tag with a title attribute for abbreviations.

```html
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
```

--------------------------------

### Blockquote without Attribution

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use blockquotes to cite content from another source. Markdown syntax is supported within the blockquote.

```markdown
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
> **Note** that you can use _Markdown syntax_ within a blockquote.
```

--------------------------------

### Hugo Template for Gallery Layout

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/gallery.html

This is the main Hugo template for the gallery layout. It defines the head, title, and main content sections, including image display and viewer initialization.

```html
{{ define "head" }}   {{ if .Params.viewer | default true }}   {{ end }} {{ end }} {{ define "title" }} {{.Title }} | {{ .Site.Title }} {{ end }} {{ define "main" }}

{{.Title}}
----------

###### {{ .Params.description | emojify }}

{{ .Content | emojify }}

{{ range .Params.galleryImages }}

![]({{ .src }})

{{ end }}

{{ if .Params.viewer | default true }} document.addEventListener('DOMContentLoaded', function() { var viewer = new Viewer(document.getElementById('list-page'), { ...{{ .Params.viewerOptions }} }); }); {{ end }} {{ end }}
```

--------------------------------

### Subscript Element

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Use the sub tag for subscript text.

```html
H<sub>2</sub>O
```

--------------------------------

### Embed YouTube Video using Hugo Shortcode

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/rich-content.md

Embed YouTube videos using the youtube shortcode by providing the video ID. This is a Hugo built-in shortcode.

```html
{{</* youtube w7Ft2ymGmfc */>}}
```

--------------------------------

### Blockquote with Attribution

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Blockquotes can include attribution using the cite element. Ensure the attribution is correctly formatted.

```markdown
> Don't communicate by sharing memory, share memory by communicating.</p>
> — <cite>Rob Pike[^1]</cite>

[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
```

--------------------------------

### Render Social Network Links in Hugo Footer

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/sections/footer/socialNetwork.html

Use this partial to conditionally display social media links in your Hugo site's footer. Ensure social network URLs are defined in your site's configuration (e.g., config.toml, config.yaml).

```html
{{ if .Site.Params.footer.socialNetworks.github }} [Font Awesome]({{ .Site.Params.footer.socialNetworks.github }}) {{ end }} {{ if .Site.Params.footer.socialNetworks.linkedin }} []({{ .Site.Params.footer.socialNetworks.linkedin }}){{ end }} {{ if .Site.Params.footer.socialNetworks.twitter }} []({{ .Site.Params.footer.socialNetworks.twitter }}){{ end }} {{ if .Site.Params.footer.socialNetworks.instagram }} []({{ .Site.Params.footer.socialNetworks.instagram }}){{ end }} {{ if .Site.Params.footer.socialNetworks.facebook }} []({{ .Site.Params.footer.socialNetworks.facebook }}){{ end }}
```

--------------------------------

### Hugo Template Definitions

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Defines the 'head', 'title', and 'main' blocks for Hugo templates. The 'main' block structures the content of a single page.

```html
{{ define "head" }}    {{ end }} {{ define "title" }} {{.Title }} | {{ .Site.Title }} {{ end }} {{ define "main" }}
```

--------------------------------

### Custom Script Inclusion

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/partials/scripts.html

Allows for the inclusion of custom JavaScript code defined in the site's parameters.

```javascript
{{ .Site.Params.customScripts | safeHTML }}
```

--------------------------------

### Embed Vimeo Video using Hugo Shortcode

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/rich-content.md

Embed Vimeo videos using the vimeo shortcode by providing the video ID. This is a Hugo built-in shortcode.

```html
{{</* vimeo 146022717 */>}}
```

--------------------------------

### Social Share Links

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/single.html

Generates social sharing links for LinkedIn, Twitter, WhatsApp, and email. The visibility and content can be configured via site parameters.

```html
{{ if .Params.socialShare | default .Site.Params.singlePages.socialShare | default true }}

##### {{ .Site.Params.terms.social | default (i18n "social") }}

*   [](https://www.linkedin.com/feed/?shareActive=true&text={{ .Params.description }} {{ .Site.Params.hostName}}{{ .Permalink | absURL }})
*   [](https://twitter.com/share?text={{ .Title }}&url={{ .Site.Params.hostName}}{{ .Permalink | absURL }}&hashtags={{ delimit .Params.tags "," }})
*   [](https://api.whatsapp.com/send?text={{ .Title }}: {{ .Site.Params.hostName}}{{ .Permalink | absURL }})
*   [](mailto:?subject={{ .Title }}&body={{ .Site.Params.terms.emailText | default \(i18n \"email_text\") }} {{ .Site.Params.hostName}}{{ .Permalink | absURL }})

{{ end }}
```

--------------------------------

### HTML Code Block with Hugo Highlight Shortcode

Source: https://github.com/gurusabarish/hugo-profile/blob/master/exampleSite/content/blogs/markdown-syntax.md

Hugo's internal highlight shortcode provides a way to embed and highlight code blocks within content.

```html
{{< highlight html >}}

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example HTML5 Document</title>
</head>
<body>
  <p>Test</p>
</body>
</html>
{{< /highlight >}}
```

--------------------------------

### Hugo Main Content Template Definition

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/about.html

Defines the main content area of an HTML template in Hugo. It includes logic for displaying a title, image, name, social links, and the main content with emojis.

```html
{{ define "main" }}

{{ .Title }}
============

{{ if .Params.image }}

![]({{ .Params.image }})

{{ .Params.name }}
------------------

{{ range .Params.socialLinks.fontAwesomeIcons }}*   []({{ .url }})
{{ end }} {{ range .Params.socialLinks.customIcons }}*   [![]({{ .icon }})]({{ .url }})
{{ end }}

{{ end }}

{{ .Content | emojify }}

{{ end }}
```

--------------------------------

### Hugo Head Template Definition

Source: https://github.com/gurusabarish/hugo-profile/blob/master/layouts/_default/about.html

Defines the head section of an HTML template in Hugo. It's a placeholder and typically contains meta tags, CSS links, and other head elements.

```html
{{ define "head" }}
    {{ end }}
```