Code Monkey home page Code Monkey logo

wjh18 / hugo-liftoff Goto Github PK

View Code? Open in Web Editor NEW
89.0 89.0 25.0 4.92 MB

Minimal blog/portfolio theme with a focus on content creation and SEO best practices. An ideal choice for technical users jump-starting a personal brand.

Home Page: https://hugo-liftoff.netlify.app

License: MIT License

HTML 55.17% JavaScript 7.73% SCSS 37.07% CSS 0.02%
blog blog-theme hugo hugo-blog hugo-portfolio hugo-site hugo-theme jamstack jamstack-theme portfolio portfolio-theme ssg static-site static-site-generator theme

hugo-liftoff's People

Contributors

ajfite avatar deining avatar smallkirby avatar wjh18 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

hugo-liftoff's Issues

Brainstorm and add additional structured data schema types

Is your feature request related to a problem? Please describe.
There's currently support for Person, ImageObject, WebSite, WebPage, CollectionPage, ReadAction, BreadcrumbList and Article schema types.

It would be nice to continue adding to these with other common web schemas types for blogs or personal sites.

Describe the solution you'd like
Brainstorm a list of possible additions below or in the comments:

Align the dropdown menu with header

Hello.

Thanks for the theme. It's great.

I have an issue with the header. It displays like this:

image

The dropdown menu has a different width than the menu option which makes it look odd.

Can this be fixed?

Module "hugo-liftoff" is not compatible with hugo v0.111.3+extended linux/amd64

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:
COPY Directories
config
content

REMOVE config.toml

hugo server

Bug/Error is in config directory

hugo server
WARN 2023/12/26 16:17:38 Module "hugo-liftoff" is not compatible with this Hugo version; run "hugo mod graph" for more information.
panic: runtime error: slice bounds out of range [1:0]

goroutine 1 [running]:
github.com/gohugoio/hugo/resources/page.PermalinkExpander.validate({0xc000326240?, 0x0?, 0xc000317cb0?}, {0x0?, 0x0?})
github.com/gohugoio/hugo/resources/page/permalinks.go:183 +0x23b
github.com/gohugoio/hugo/resources/page.PermalinkExpander.parse({0xc000326240?, 0x0?, 0xc000317cb0?}, 0x8?)
github.com/gohugoio/hugo/resources/page/permalinks.go:126 +0x136
github.com/gohugoio/hugo/resources/page.NewPermalinkExpander(0xc000317cb0)
github.com/gohugoio/hugo/resources/page/permalinks.go:95 +0x7a5
github.com/gohugoio/hugo/resources.NewSpec(0xc000317cb0, 0xc000317ce0, {0x26982a0, 0xc00035ebe8}, {0x26b69f0, 0xc0003167b0}, {0x26982c0?, 0xc00014abe8}, 0xc0001f4640, {0xc000770600, ...}, ...)
github.com/gohugoio/hugo/resources/resource_spec.go:76 +0x205
github.com/gohugoio/hugo/deps.New({{0x26b69f0, 0xc0003167b0}, 0xc000278d20, 0xc000686700, {0x0, 0x0}, {0x26b3f40, 0xc00013a960}, {0xc0002fe000, 0x23, ...}, ...})
github.com/gohugoio/hugo/deps/deps.go:291 +0x705
github.com/gohugoio/hugo/hugolib.configLoader.applyDeps({{0x0, 0x0}, {{0x0, 0x0}, {0x0, 0x0}, {0x0, 0x0}, {0x0, 0x0}, ...}}, ...)
github.com/gohugoio/hugo/hugolib/hugo_sites.go:518 +0x31e
github.com/gohugoio/hugo/hugolib.newHugoSites({{0x26b69f0, 0xc0003167b0}, 0xc000278d20, 0x0, {0x0, 0x0}, {0x26b3f40, 0xc00013a960}, {0x0, 0x0, ...}, ...}, ...)
github.com/gohugoio/hugo/hugolib/hugo_sites.go:405 +0x766
github.com/gohugoio/hugo/hugolib.NewHugoSites({{0x26b69f0, 0xc0003167b0}, 0xc000278d20, 0x0, {0x0, 0x0}, {0x26b3f40, 0xc00013a960}, {0x0, 0x0, ...}, ...})
github.com/gohugoio/hugo/hugolib/hugo_sites.go:554 +0x158
github.com/gohugoio/hugo/commands.(*commandeer).loadConfig.func3()
github.com/gohugoio/hugo/commands/commandeer.go:501 +0x8d8
sync.(*Once).doSlow(0xc00013a960?, 0x1fb730b?)
sync/once.go:74 +0xc2
sync.(*Once).Do(...)
sync/once.go:65
github.com/gohugoio/hugo/commands.(*commandeer).loadConfig(0xc000020d00)
github.com/gohugoio/hugo/commands/commandeer.go:426 +0xaaa
github.com/gohugoio/hugo/commands.newCommandeer(0x1, 0x1, 0x1, 0xc0002e7770, {0x2698240?, 0xc000492fc0}, 0xc000375360, {0x0, 0x0, 0x0})
github.com/gohugoio/hugo/commands/commandeer.go:227 +0x31f
github.com/gohugoio/hugo/commands.initializeConfig(0x0?, 0x0?, 0x0?, 0x1f9c039?, {0x2698240?, 0xc000492fc0?}, 0x0?)
github.com/gohugoio/hugo/commands/hugo.go:125 +0x3b
github.com/gohugoio/hugo/commands.(*serverCmd).server(0xc000492fc0, 0xc0007be300, {0x0?, 0x0?, 0x0?})
github.com/gohugoio/hugo/commands/server.go:257 +0x1cd
github.com/gohugoio/hugo/commands.(*commandsBuilder).newServerCmdSignaled.func1(0xc0007be300?, {0x3743198?, 0x0?, 0x0?})
github.com/gohugoio/hugo/commands/server.go:96 +0x36
github.com/spf13/cobra.(*Command).execute(0xc0007be300, {0x3743198, 0x0, 0x0})
github.com/spf13/cobra/command.go:916 +0x862
github.com/spf13/cobra.(*Command).ExecuteC(0xc000636300)
github.com/spf13/cobra/command.go:1044 +0x3bd
github.com/gohugoio/hugo/commands.Execute({0xc000040050, 0x1, 0x1})
github.com/gohugoio/hugo/commands/hugo.go:92 +0xbd
main.main()
github.com/gohugoio/hugo/main.go:23 +0x56

Location of security settings for 'newContentEditor'

Describe the bug
Using the 'newContentEditor' line does not work as expected, as to not being configured in the security settings

To Reproduce
Steps to reproduce the behavior:
Create new content with newContentEditor = 'code'

Expected behavior
Creating the content file and also opening the editor

Log

Editing "/home/daniel/Documents/GitHub/test_liftoff/content/posts/umzug.md" with "code" ...
Error: access denied: "code" is not whitelisted in policy "security.exec.allow"; the current security configuration is:

[security]
  enableInlineShortcodes = false

  [security.exec]
    allow = ['^(dart-)?sass(-embedded)?$', '^go$', '^npx$', '^postcss$']
    osEnv = ['(?i)^((HTTPS?|NO)_PROXY|PATH(EXT)?|APPDATA|TE?MP|TERM|GO\w+|(XDG_CONFIG_)?HOME|USERPROFILE|SSH_AUTH_SOCK|DISPLAY|LANG)$']

  [security.funcs]
    getenv = ['^HUGO_', '^CI$']

  [security.goTemplates]
    AllowActionJSTmpl = false

  [security.http]
    methods = ['(?i)GET|POST']
    urls = ['.*']

Additional context
Getting the current config with hugo config also shows the security settings, but I was unable to find them with the config file split

Modularize / clean up CSS by converting it to Sass for future maintainability and extensibility

Is your feature request related to a problem? Please describe.
Currently the styles are written in vanilla CSS with BEM. There are a lot of repeated styles and it's starting to get messy.

Describe the solution you'd like
There is already CSS -> Sass processing built into the theme, so the obvious solution is to convert the existing CSS to Sass where appropriate. SCSS is preferred so that vanilla CSS can be sprinkled in if needed.

Describe alternatives you've considered
N/a

Additional context
N/a

Insert image insie post

I try to insert image and adjust the size of it with markdown as follow
![alt text](image URL){: width="50%"}
but not work
I tried as well HTML tag img not worked, any suggestion ?

Thanks in advance

Enhancements for next major version - drop your suggestions here

I'm going to slowly chip away at the next version of the theme. These are just ideas I have at the moment in no particular order. If anyone using the theme has any feedback let me know.

  • Take care of all existing issues
  • Improve styling and responsiveness in a few spots that need work. I might make the markdown content text a bit lighter. It's a little harsh on the eyes at the moment and there's not enough contrast between headings and paragraph text.
  • Remove UA option due to upcoming deprecation by Google
  • Figure out how to incorporate Hugo modules
  • It would be nice to have a way to customize the homepage with shortcodes. For example, having shortcodes for posts and projects with customizable filters. And the ability to arrange them in any order as desired.
  • Ability to disable projects and customize section names of posts and projects without breaking other features
  • Pinning featured posts on homepage (I've wanted the ability to do this for awhile)
  • I'm also thinking of adding a content callout shortcode for blog posts. Very similar style to blockquotes but for emphasized content.
  • CDN/remote support for image assets
  • Dedicated post archive page (by year most likely)
  • Allow project single pages to (optionally) act more like case studies (list client name, objectives, outcomes, etc.)
  • PhotoSwipe image galleries for projects
  • Terms and privacy policy page examples
  • More social link/share icons
  • CloudCannon (or other maintained CMS) integration. NetlifyCMS is being resurrected as Decap CMS so I might add it back with example config.
  • Make more customizations available in general. Basically allow you to change any piece of content in the theme
  • Site search integration
  • More structured data types
  • Translations

Make it easier to create custom single pages that don't use the posts single template

Is your feature request related to a problem? Please describe.
Currently creating a custom single page uses the default single template which is for posts only. There needs to be a way to create single pages other than about or contact that look like single pages instead of single posts. About and contact templates can be extended from this as well.

Describe the solution you'd like
Create a default template that will be used automatically when creating a page without a defined section or type.

Describe alternatives you've considered
N/a

Additional context
N/a

How do I change the home image to not be grayscale?

Is your feature request related to a problem? Please describe.

I updated the image in the home page by placing an image under my assets directory. It comes out as grayscale by default though, my understanding is that it's because of this line:

https://github.com/wjh18/hugo-liftoff/blob/master/layouts/index.html#L23

where the filter is applied. I am wondering how to toggle this off?

Describe the solution you'd like

I guess this might have to be made a config on the config.toml? I am not sure though.

Update archetypes for easier bundle create with hugo new

Currently page bundles need to be created manually by running mkdir content/posts/bundle-dir and hugo new posts/bundle-dir/index.md.

This can be simplified with an archetype so you can create a new bundle with hugo new --kind post-bundle posts/new-post.

See this SO post for details.

Add Mastodon to social links

Is your feature request related to a problem? Please describe.
Missing Mastodon from Social links.

Describe the solution you'd like
Could you add Mastodon to the social links with the SVG-icon please?

Describe alternatives you've considered
I have a fork of your repo where I made the change for myself but would rather follow your main repo.
master...riussi:hugo-liftoff:master

Additional context

Not sure if this is a Bug, or problem with my Text Editor (VS Codium)

Describe the bug
I'm trying to comment out a line for series in my hugo.toml file, per the hugo-liftoff Wiki section, "Taxonomies". Here is the link to that particular paragraph: https://github.com/wjh18/hugo-liftoff/wiki/3.-Config-&-Params#taxonomies

In the hugo.toml file, I've tried putting a # (just one on the entire beginning of the line) and save it. But the Hugo Server gives errors until I remove the comment. This is the section I'm referring to: Please disregard the spacing, as it pasted strange here in the box I'm typing this in:

[taxonomies]
tag = 'tags'
category = 'categories'

series = 'series' # Allows you to create an organized series of posts (e.g. multi-part tutorial)

project-type = 'project types' # Categorize projects by type (e.g. client work, personal, open source, etc.)

Expected behavior
I expected the Series option to go away from posts that have it included.
Screenshots
image

Desktop (please complete the following information):
Windows 11
Edge Version 114.0.1823.82 (Official build) (64-bit)
No Add-ins or extensions installed
Smartphone (please complete the following information):
Not using smartphone for this site, but I do have a Galaxy s23 Ultra

Additional context
Problem goes away if I remove the comment and allow the series to exist.

I'd like to add that I believe this is the best Hugo Theme I've ever seen and It needs more recognition than the other "best themes" out there. This one is superior, in my opinion.

Optionally disable projects section and allow custom posts/projects permalinks

There are currently two limitations with the theme that reduce flexibility for users:

  1. The projects section can't be disabled. There may be users who like the theme and only want to use the posts section for blogging.
  2. The posts and projects section permalinks are hard-coded throughout the theme (in SEO features, etc.). This means that if someone wants to change posts to blog for example, they would need to override various layout templates in their project repo. This isn't a very good user experience.

It would be helpful to fix these issues ASAP to broaden the appeal of the theme.

am i doing something wrong with netlify deployment?

I followed the getting started guide of hugo-liftoff and used submodule but in the following screenhot but it still says
Error: failed to load modules: module "hugo-liftoff" not found in "/opt/build/repo/themes/hugo-liftoff"; either add it as a Hugo Module or store it in "/opt/build/repo/themes".: module does not exist

also my netlify.toml is same as mentioned in the theme i only change my version of hugo 0.119.0

am i doing some thing wrong ?

Screenshots
image

Question: changing icon color(s) or font

Is there a config parameter for changing icon colors and/or font?

about and projects icons

I was looking at the config exampleSite/config/_default/hugo.toml, and I didn't see any fields for specifying overrides on these.

Enable SCSS Sourcemap

Is your feature request related to a problem? Please describe.

Debugging the CSS generated by Hugo could be easier with a sourcemap pointing to the corresponding SCSS file

Here is a short note about implementing such a feature:

Before:

{{ $normalizeSass := resources.Get "normalize.scss" }}
{{ $normalizeStyle := $normalizeSass | resources.ToCSS  | resources.Fingerprint }}

After:

{{ $options := (dict "enableSourceMap" true ) }}

{{ $normalizeSass := resources.Get "normalize.scss" }}
{{ $normalizeStyle := $normalizeSass | resources.ToCSS $options | resources.Fingerprint }}

What do you think?

(Thanks for this lovely theme BTW!)

Disqus embed color scheme breaks on toggle

Describe the bug
Disqus auto-detects a site's color scheme and displays the embed with the appropriate contrast. When the color scheme is manually toggled via the theme's light/dark mode switcher, the Disqus embed is not toggled with it to the opposite color scheme and is difficult to read.

To Reproduce
Steps to reproduce the behavior:

  1. Load a post with Disqus comments. The embed should look good.
  2. Toggle the color scheme to the opposite one without reloading the page.
  3. The embed should now have multiple elements with insufficient contrast.
  4. Reload the page and the color scheme that was just not working should show sufficient contrast.

Expected behavior
The body of the iframe embed has a class light or dark which controls the color scheme. Target this element with JS and toggle the class when the dark/light mode switch is toggled by a user.

Accessibility and HTML validation

Is your feature request related to a problem? Please describe.
Your theme throws a few accessibility warnings and errors / and some HTML warnings.

Describe the solution you'd like
Test your demo site with the "WAVE Evaluation Tool" extension (e.g. on a Chrome based browser) and https://validator.w3.org/ and see the results.

Language Error

Describe the bug
Following the steps in the Getting Started results in an error when using the config values. I keep getting language errors:

$ hugo server -D
Error: command error: failed to create config from result: failed to decode "languages": no languages configured

To Reproduce
Steps to reproduce the behavior:

  1. Follow the getting started guide.
  2. Start development server hugo server
  3. Review output.

Expected behavior
I expected the example site to come up with the example content.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: MacOS Ventura 13.4.1
  • Browser: Chrome
  • Version: N/A
  • Hugo Version: 115.1

Additional context
Is this maybe due to a new Hugo version behavior? I reviewed the following docs page from Hugo about languages, but none of the work around work for me.

Mastodon Link Verification

Is your feature request related to a problem? Please describe.
In order to get the verification check on Mastodon you need rel="me" in a link to Mastodon on the page

Describe the solution you'd like
add a rel="me" attribute to the mastodon social link in the footer and/or on the homepage

Describe alternatives you've considered
This can be included manually in the page content but it would be better to include it as part of the default social links

Additional context
Mastodon docs: https://joinmastodon.org/verification

layouts: image: Template renders wrong images due to glob matching.

Describe the bug
In render-image.html, target image file is $resized, where $resized is fetched with with (.Page.Resources.ByType "image").GetMatch (printf "**%s" $src).
However, if the image asset directory contains 2.jpg and 12.jpg, markdown ![](./img./2.jpg) unexpectedly renders 12.jpg, which "**%s matches first.

To Reproduce
Steps to reproduce the behavior:

  1. In /content/posts/test directory, create index.md and img directory.
  2. Create 2.jpg and 12.jpg in img directory.
  3. Write ![](./img/2.jpg) in index.md`.
  4. See 12.jpg is rendered instead of 2.jpg

Expected behavior
2.jpg is rendered.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: Ubuntu, 6.2.0-26-generic
  • Browser: Chrome
  • Version:

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context
Add any other context about the problem here.

Not compatible with hugo v0.123

Describe the bug
With hugo v0.123, this theme results in execute of template failed: template: partials/head/seo/seo.html:17:20: executing "partials/head/seo/seo.html" at <.Paginate>: error calling Paginate: pagination not supported for this page: kind: "page"

I don't know if it's the right solution, but I wrapped the code block here https://github.com/wjh18/hugo-liftoff/blob/master/layouts/partials/head/seo/seo.html#L17 with {{- if and .Page.IsNode .Page.Paginator -}} as recommended here gohugoio/hugo#12080

I know this theme is no longer maintained, creating this for the next person who runs into this issue.

ADD Social link

I want to add social icons to my website
The params that you wrote on the example site are more compatible with this Hugo version

**Can you please help me to add them?

Disable Projects

Was going to see if I could remove projects easily. Must have been missing something obvious. No worries.

Bug - Feature image not working

Describe the bug

Featured Images for a post aren't being rendered/ working.

To Reproduce
Steps to reproduce the behavior:

  1. Add a feature image to the site:

image

    1. Add a feature_image = to a post:

image

  1. Render site. (I just launched hugo server.)
  2. View the source code:

image

Expected behavior
I expected a featured image to be rendered into the page.

Screenshots
See above.

Desktop (please complete the following information):

  • OS: Windows 11
  • Browser Firefox
  • Version 116

Smartphone (please complete the following information):

  • Device: N/A
  • OS: N/A
  • Browser N/A
  • Version N/A

Additional context
hugo server

Fix minor edge case issues with Open Graph, Twitter Cards and Schema.org templates

Describe the bug

  • og:image and twitter:image aren't being added for pages without a feature image. Needs a fallback from config. - Fixed with 15b6f06
  • Structured data ImageObject (id 2) not working. Add primary image for schemas similar to the ones used for OG and TC. - Fixed with 4cb4e11
  • Characters like / and ' are being escaped and shown in output - Fixed with d2e7a0c
  • WebPage schema title and description need a fallback to site title and description in the event that no page-level ones are set. - Fixed with d2e7a0c
  • The WebPage datePublished structured data field is invalid for non-posts. - Fixed with dedaac0

To Reproduce
Steps to reproduce the behavior:

  1. Fill out necessary fields in config and params
  2. Create content
  3. Inspect page head in browser and note discrepancies in tags

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.