Frontend developer/designer working with code and pixels.
Wordle 309 4/6
⬜⬜🟨⬜🟨
⬜⬜⬜🟩⬜
⬜⬜🟨🟩🟩
🟩🟩🟩🟩🟩
Links
A minimalist Hugo theme for writers and bloggers
Home Page: https://themes.gohugo.io/theme/hugo-theme-noteworthy/
License: MIT License
Is it possible to add links to accounts other than those included in the example site (e.g., twitter, github)? The three that I'm most interested in are google-scholar, impactstory, and orcid. Thanks.
Hi,
I have a blog that uses this template and I was wondering if it was possible to support the ko-fi donation platform by adding an optional section at the end of a blogpost.
Ideally we'd want a property in the config.toml
with the ko-fi id, and a flag, default to false in every blogpost to enable the ko-fi donate button.
WDYT?
Thanks,
Gio
I have a post on my blog that shows nicely when accessed via computer, but on mobile it is like the horizontal space cuts the page with no scrolling option, so the content is just not showing (because it is cut out). Any ideas how to fix this?
https://oren0e.github.io/2020/04/27/mab_thompson/ -- this is the post.
Include mastodon-icon please.
Just in case this theme is still under active development.
Kind regards
Ulrich
i am using themes with the new hugo module syntax, which - usually - works flawlessly. not so much here, but i think (!) the error is rather simple. i have no clue of go modules unfortunately, this is what i have found out so far.
i'm using hugo v0.87.0+extended darwin/arm64 BuildDate=unknown
is. when i try to build the site i get this error:
Start building sites …
hugo v0.87.0+extended darwin/arm64 BuildDate=unknown
Error: Error building site: TOCSS: failed to transform "css/main.scss" (text/x-scss): \
SCSS processing failed: file "stdin", line 25, col 1: \
File to import not found or unreadable: vendor/normalize.
Built in 653 ms
if i execute hugo mod vendor
it becomes clear - the whole vendor
directory is missing from _vendor/github.com/kimcc/hugo-theme-noteworthy/assets/css/
. (as far as i understood the mod vendor
command copies the module's contents to the local directory _vendor
, so your theme's css/vendor
dir missing would kinda explain the error message).
for reference - the config file i used can be found here.
Currently, the colors used in Noteworthy are defined in assets/css/main.scss
. First, variables with the color names are defined (e.g. $teal: #63BDA2;
), then these variables are used in the CSS ruleset. That is, one finds rules spread out over the 500+ line file.
So, if one wanted to, for example, use shades of muddy brown instead of shades of gray but otherwise keep the style conventions; one could override main.scss
, define different color variables, and then search and edit 10's of rules trying not make mistakes. This is not so hard because you can do some global substitutions. But what if you want to change only part of the color scheme (e.g. how links are colored)? It starts to get messy.
Then, of course, when the theme's main.scss
changes, you need to re-do the editing process in order to take advantage of the update.
It should be possible to change the color palette and the color usage in a straightforward manner and without overriding the main CSS file and applying dozens of edits.
I have prototyped one approach to attack this problem. It basically abstracts out the color and usage definitions from the main.scss file into two files containing only variable definitions. These new files get included into main.scss. Too change the color definitions and usage, one only needs to override one or another or both of these files and change the definitions. See: https://github.com/ranger6/noteworthy-example/commits/colors/assets/css. Especially, see the commit log: it explains the approach in detail.
I am sure that there are other approaches, problems with this approach, improvements, etc. So, comments on this issue are encouraged! I'd be willing to move this (including reasonable alternatives and suggested improvements) towards a PR.
I guess I'm missing somoething obvious, but how can we add a fixed height to our images when using the resize-image shortcode?
Or how can I add my height css option for the article-image key?
Hi kimcc, awesome theme! I am quite new to this and I am not sure if my question makes sense.
When a page with this theme is loaded I noticed that initially the fonts are different and after a second they change to what they are permanently. Is there a way to remove this delay/flickering?
The below gif should illustrate what I mean. (This is viewing the theme on the official hugo website with Chrome on a Mac)
There are 5 example posts in the theme, but only 2 displayed in the homepage. Basic theme installation in the forestry.io
Repo: https://github.com/erickvasilev/hugo-noteworthy2
Hugo Version: 0.69.0
Preview: https://jjwxfln8bzoqxg.instant.forestry.io/
Using theme's config.toml
, paginate = 4
First of all, thank you very much for the great project, it helped a lot in setting up my own blog.
In the default template, the content was biased to the left hand side of the screen, I am wondering if it is possible to move it to the center (just like every posts that we saw in medium?), with the navigation bar remain fixed?
Please look at the picture for clearer description, I would like to move the content to the red rectangle location such that the margin to the left and right are equal.
Thank you very much! Any help would be greatly appreciated.
Are you accepting new issues and PRs? I'm currently maintaining my own fork of this theme where I have a few bugfixes and SEO related optimizations. And as my requirements increase, I might even add small features to the theme. I'd like to contribute back to the theme, but I'm not sure if it is being actively maintained.
Feel free to grab the commits from my fork, or, if you're accepting PRs, I'll be happy to make one!
P.S. I really like the theme, thanks for your great work! :)
Hi, I'm having trouble finding out what values I should put in for the social links in the TOML. For example, for twitter I assume I would put in my twitter handle. However after deployment the link isn't pointing to twitter but to my own website. Even on https://themes.gohugo.io/theme/hugo-theme-noteworthy/, the links are pointing back to the website and not to the social sites.
Hello,
When using the noteworthy theme in my hugo site, the server will launch successfully using the command hugo server
.
However, the site itself seems to be missing some visual elements.
When I look at the console tab, I get the following error:
“http://localhost:1313/js/main.min.fa5c2b23e07b5d9bfad267a52b4b24fdb053e6fb7524993383594926a3ac270c.js” is not eligible for integrity checks since it’s neither CORS-enabled nor same-origin.
I do not get this error when using other themes.
Let me know if any further information is needed/could be useful.
Thanks
The template code to generate a list of tags with href
s to each tag's definition fails when the baseURL contains a path component. That is, everything is fine if the baseURL is https://example.com/
but fails if the baseURL is https://example.com/site/
. This appears to be caused by not using the "relLangURL" (or "relURL") function to form the href
. In other parts of the theme, this function is used and results are correct.
In code, the faulty line is:
<a class="tag" href="/tags/{{ . | urlize }}">#{{.}}</a>
A working version would be:
<a class="tag" href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">#{{.}}</a>
Set up the example Noteworthy theme site and set the baseURL in config.toml
to something with a path component. The bug appears when running hugo server
and when publishing, for example, to GitHub Pages. The example is available at https://github.com/ranger6/noteworthy-example. The master branch contains a forked and unmodified submodule of the Noteworthy Theme: https://github.com/ranger6/hugo-theme-noteworthy. The GitHub Pages for the noteworthy-example demonstrates the bug: https://ranger6.github.io/noteworthy-example/
The above mentioned single.html
file needs the appropriate changes applied.
Pull request to follow.
I noticed the following during build when deploying to Netlify.
8:11:27 PM: --> insecure link urls:
8:11:27 PM: - http://example.org/css/main.min.03322cbe6bddfc28e7b17b84bc5446282a510b14b57be3371ba1f68ef1ab9ce8.css
8:11:27 PM: --> insecure script urls:
8:11:27 PM: - http://example.org/js/main.min.fa5c2b23e07b5d9bfad267a52b4b24fdb053e6fb7524993383594926a3ac270c.js
8:11:28 PM: Mixed content detected in: /index.html
8:11:28 PM: --> insecure link urls:
8:11:28 PM: - http://example.org/css/main.min.03322cbe6bddfc28e7b17b84bc5446282a510b14b57be3371ba1f68ef1ab9ce8.css
8:11:28 PM: - http://example.org/index.xml
8:11:28 PM: --> insecure script urls:
8:11:28 PM: - http://example.org/js/main.min.fa5c2b23e07b5d9bfad267a52b4b24fdb053e6fb7524993383594926a3ac270c.js
8:11:28 PM: Mixed content detected in: /categories/index.html
8:11:28 PM: --> insecure link urls:
8:11:28 PM: - http://example.org/css/main.min.03322cbe6bddfc28e7b17b84bc5446282a510b14b57be3371ba1f68ef1ab9ce8.css
8:11:28 PM: - http://example.org/categories/index.xml
8:11:28 PM: --> insecure script urls:
8:11:28 PM: - http://example.org/js/main.min.fa5c2b23e07b5d9bfad267a52b4b24fdb053e6fb7524993383594926a3ac270c.js
8:11:28 PM: Mixed content detected in: /tags/index.html
8:11:28 PM: --> insecure link urls:
8:11:28 PM: - http://example.org/css/main.min.03322cbe6bddfc28e7b17b84bc5446282a510b14b57be3371ba1f68ef1ab9ce8.css
8:11:28 PM: - http://example.org/tags/index.xml
8:11:28 PM: --> insecure script urls:
8:11:29 PM: - http://example.org/js/main.min.fa5c2b23e07b5d9bfad267a52b4b24fdb053e6fb7524993383594926a3ac270c.js
Is there any way to change the KaTeX math font?
Great theme btw!
Hi @kimcc ,
I noticed that KaTeX is unable to retrieve the math fonts due to where they are located.
The katex.min.css
file is looking for a fonts folder under the same directory, static/css
.
However, the fonts are currently placed in the fonts folder in the parent directory, static/fonts
.
Here's a link for more info: https://katex.org/docs/font.html#location-of-font-files
Two possible solutions include:
static/css/fonts
katex.min.css
to look for the fonts in the parent directoryIf any of the above solutions work with you, I'd be happy to make a PR.
Thanks for the great theme!
This project looks great! So good in fact that I'm considering porting my website over.
I know this project is super new, but I would definitely suggest implementing @media (prefers-color-scheme: dark)
to enable automatically switching to a dark background. This is super useful, for example, when reading on an OLED screen since it saves a ton of battery life. Thanks again for the hard work @kimcc!
Where is demo link?
KaTex is working fine for "block math" and the usual markdown-file (*.md).
However, to get "inline math" working properly (= without line break) you have to use *.mmark, which is going to "[...] be removed in a future release. See https://gohugo.io//content-management/formats/#list-of-content-formats".
Any thoughts on this issue?
Basically, if you specify your email using the email
key under params, since it isn't an absolute URL, Hugo renders it as a relative URL.
Meaning if your config.toml
has this:
email = "[email protected]"
The hyperlink that is generated becomes https://example.com/[email protected]
.
Note that because of this, you cannot just add usernames for other social media handles as well. You need to include the full URL to the social profile, which is poor UX IMHO.
Following this solution, I had to move the Google Analytics line in my config.toml above [taxonomies]
to get tracking to work. Not sure if it is just a blogdown issue or a broader issue.
Hi, how are you? I am interested in converting this into a micro+link+photo blog. Cloud you kindly offer me advice or piece of docsThe theme is beautiful. Thank you.
This theme is amazing for getting started quickly! 🎉 🤗 It would be great if we could support the multi-lingual mode - see https://gohugo.io/content-management/multilingual/
We'd have to change at least the relURL
s to relLangURL
for example here
Hello. I like your theme and since I'm using it on a blog written in Italian, I think it would be nice if it could support multi-language through i18n if you might like it.
For this reason, I've just opened PR #21
What do you think?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.