I'm using Hugo for the first time and I'm having troubles with translations.
More specifically, I'm using the hugo-theme-bootstrap theme. In config\_default, I have a file named author.toml that contains information like the author's name, bio, city, etc. It looks like this:
name = "Pascal Bergeron"
avatar = "images/profile.jpg"
bio = "Description française."
location = "Montréal"
The issue is that this file is used for both the English and French versions of my website. However, I need the bio and location fields to change according to the language. I've tried creating a file named author.fr.toml, but its settings end up being ignored. In fact, if I even rename author.toml to author.en.toml, the settings will be ignored for the English language. It's as if I can only have a author.toml file. This is strange because I can translate all other files in my config folder that way (I have a params.en.toml and a params.fr.toml file for instance).
I've done some digging in the layouts folder of my theme and I've found the file where the author.toml is used to create the HTML code. It looks like this:
{{- with .Site.Author -}}
<section class="profile surface row">
<div class="col-xl-6 d-flex align-items-center justify-content-center">
<img class="profile-avatar img-fluid" src="{{ absURL (default "images/profile.webp" .avatar) }}" alt="{{ .name }}" loading="lazy">
</div>
<div class="col-xl-6">
<h5 class="profile-name my-2">{{ .name }}</h5>
{{- with .bio -}}
<div class="profile-bio mb-2">{{ . }}</div>
{{- end -}}
{{- with .company -}}
<div class="profile-company mb-2"><i class="fas fa-fw fa-building"></i>{{ . }}</div>
{{- end -}}
{{- with .location -}}
<div class="profile-location mb-2"><i class="fas fa-fw fa-map-marker-alt"></i>{{ . }}</div>
{{- end -}}
{{- if .about -}}
<div class="profile-about mb-2"><i class="fas fa-fw fa-info-circle"></i><a target="_blank" href="{{ .about }}">{{ i18n "about_me" }}</a></div>
{{- else -}}
{{- with $.GetPage "about" -}}
<div class="profile-about mb-2"><i class="fas fa-fw fa-info-circle"></i>{{ .Title }}</div>
{{- end -}}
{{- end -}}
</div>
</section>
{{- end -}}
How can I have a author.toml file for each language?
(TLDR - The site author set-up the author data as 1 config file - i.e. Theme is built for 1 author for the entire site).
Hello Pascal, so, really appreciated you took the time to answer me.
To clarify:
This isn't a "hugo" thing, but the way this chap built this theme.
You are going to have to modify his theme (or reach out to him). The specific file in question, as you point out, I believe is profile.html in sidebar:
{{- if .Site.Author -}}
{{- $layout := default "" .Site.Author.params.layout -}}
{{- if eq $layout "compact" -}}
{{- partial "sidebar/profile/compact" . -}}
{{- else -}}
{{- partial "sidebar/profile/default" . -}}
{{- end -}}
{{- end -}}
If you follow the various partials this calls, i.e. down the rabbit whole you will find an example (this is one of many), like you describe and quote in your question, it has the specific comment {{ - with .Site.Author - }} meaning, it's looking for exactly 1 file, with a specific name.
[https://gohugo.io/content-management/multilingual/][1]
covers how to set-up a hugo multilingual - and there is SUPPOSED to be 1 Config file per site (which has it's own meaning in Hugo - see above page)
Point being, this is a theme issue, and I would suggest asking the theme creator to adapt edit.
My suggestion would be if the theme creator isn't helpful - would be to remove the dependency for the TOML file, and simply reference a headless bundle which has the author data, and as the theme has i18n, integrate the two (see above link) so that their is a headless bundle per language.
Related
I couldn't find any documentation, but I keep seeing examples.
Like:
{{- if .Values.serviceAccount.create -}}
apiVersion: v1
kind: ServiceAccount
metadata:
name: {{- include "example.serviceAccountName" . -}} ##<=== {{- -}}
example: {{ .Values.example.example }} ##<=== {{ }}
labels:
{{- include "alma.labels" . | nindent 4 }} ##<=== {{- }}
{{- with .Values.serviceAccount.annotations }}
annotations:
{{- toYaml . | nindent 4 }}
{{- end }}
{{- end }}
Helm uses standard Go templating. Have a look at https://pkg.go.dev/text/template#hdr-Text_and_spaces In short {{- something }} means "trim left whitespace" and {{ something -}} means "trim right whitespace". | nindent 4 means "add 4 spaces before". You need this operators for correct indenting your yaml.
My end goal is to write a script that will loop through all my app/views folders and find any image assets being used within them (jpg, png, svg, gifs) and I can't quite get it but I feel I am close but need a little assistance.
This is how I am getting all my assets
assets_in_assets = []
# I searched for image asset names in this folder
image_asset_path = './app/assets/images'
# I haven't made use the below global variables yet
assets_in_use = []
# I plan to loop through the below folders to see if and where the image
# assets are being used
public_folder = './public'
app_folder = './app'
Find.find(image_asset_path) do |path|
# returns path and file names of all files extensions recursively
if !File.directory?(path) && path =~ /.*[\.jpg$ | \.png$ | .svg$ | \.gif$]/
&& !(path =~ /\.DS_Store/)
new_path = File.basename(path) # equiv to path.to_s.split('/').last
assets_in_assets << new_path
end
end
# The above seems to work, it gives me all the asset image names in an array.
This is how i am trying read a html.erb file to find if and where images are being used.
Here is a sample of part of the page:
<div class="wrapper">
<div class="content-wrapper pull-center center-text">
<img class="pattern-stars" src="<%= image_path('v3/super/pattern-
stars.png') %>" aria-hidden="true">
<h2 class="pull-center uppercase">Built by the Obsessed People at the
Company</h2>
<p class="top-mini">Our pets needed a challenge.</p>
<p class="italicize">So we made one.</p>
<img class="stroke" src="<%= image_path('v3/super/stroke.png') %>"
aria-hidden="true">
</div>
</div>
# The assets I am expecting to find, in this small section, are:
#- pattern-stars.png
#- stroke.png
And my code (I tried two different ways, here is the first):
# My plan is start with one specific file, then expand it once the code works
lines = File.open('./app/views/pages/chewer.html.erb', 'r')
lines.each do |f|
if f =~ / [\w]+\.(jpe?g | png | gif | svg) /xi
puts 'match: ' + f # just wanted to see what's being returned
end
end
# This is what gets returned
# match: <img class="pattern-stars" src="<%= image_path('v3/super
# /pattern-stars.png') %>" aria-hidden="true">
# match: <img class="stroke" src="<%= image_path('v3/super/stroke.png')
# %>" aria-hidden="true">
Not what I was hoping for. I also tried the following:
lines = File.open('./app/views/pages/chewer.html.erb', 'r')
lines.each do |f|
new_f = File.basename(f)
puts 'after split' + new_f # I wanted to see what was being returned
if new_f =~ / [\w]+\.(jpe?g | png | gif | svg) /xi
puts 'match: ' + new_f
end
end
# This is what gets returned
# after split: pattern-stars.png') %>" aria-hidden="true">
# match: pattern-stars.png') %>" aria-hidden="true">
# after split: stroke.png') %>" aria-hidden="true">
# match: stroke.png') %>" aria-hidden="true">
And here I remain blocked. I have searched through S.O. and tried a few things but nothing I have found has helped but it could be that I implemented the solutions incorrectly. I also tried look-behind (using the single ' as a end point) and look-ahead (using a / as a starting point)
If this is a dup or similar to another question, please let me know. I'd appreciate the help (plus an brief explanation, I really want to get a better understanding to improve my skills.
(?:['"])([^'"]+\.(?:png|jpe?g|gif|svg)) seems to work in the one test case you supplied us. It relies on the image paths always being within a string as the 'this is the start of the image path' delimiter and terminates at the extension so even if the string is unclosed should stop at an appropriate place.
Using the above, I eventually got to the following solution;
Find.find(app_folder, public_folder) do |path|
if !File.directory?(path)
&& !(path =~/\.\/app\/assets\/images/)
&& !(path =~ /\.DS_Store/)
&& !(path =~ /\.\/app\/assets\/fonts/)
asset_file = File.read(path)
image_asset = asset_file.scan(/ (?:['"|\s|#])([^'"|\s|#]+\.(?:png | jpe?g |gif | svg)) /xi).flatten
image_asset.each do |image_name|
assets_in_use << [path, File.basename(image_name)]
end
end
end
github site: https://geloangelia.github.io/mynewsite/profile
REPO: https://github.com/geloangelia/mynewsite
I am having trouble with the links. i doesn't link to the right path.
the path should be _site\vclist(NAME)
CODE:
<ul>
{% for list in site.data.vclist %}
<li>{{list.Name}}
</li>
{% endfor %}
</ul>
The problem is how you generate the links with the filter tag, you need to add the basepath to the generated URLs and specify the directory where the plugin generates the files:
<ul>
{% for list in site.data.vclist %}
<li>{{list.Name}}</li>
{% endfor %}
</ul>
Also, the permalink shouldn't be located in the layout, so remove the permalink from _layouts/profile.html
---
layout: page
---
I have exported a variable:
export myparam=one
I have template: file.tmpl :
myproptmpl =
{{ if eq .myparam "one" }}
{{ "one" }}
{{ else }}
{{ "something else" }}
{{ end }}
And when I run confd I get:
# /usr/bin/confd -onetime -backend env
2016-04-20T15:21:58Z 8faae31d53a1 /usr/bin/confd[91]: ERROR template: file.tmpl:70:6: executing "file.tmpl" at <eq .myparam "one">: error calling eq: invalid type for comparison
I'm a newbie on confd. How can I compare an OS environment variable to values and based on them generate different resulting output file out of template?
You need get the variable first and after that then you can compare.
Ex.:
myproptmpl =
{{ if eq (getv .myparam) "one" }}
{{ "one" }}
{{ else }}
{{ "something else" }}
{{ end }}
I m using select2 with Laravel Blade engine and i use it for loading remote data and its work fine (getting data from remote) but its not look like select2 box. i also attach image for my resulting select2.
My CSS file include in section as follows
{{--Bootstrap--}}
{{ HTML::style('css/bootstrap.css') }}
{{ HTML::style('css/bootstrap.min.css') }}
{{ HTML::style('css/plugin/font-awesome.min.css') }}
{{--select2--}}
{{ HTML::style('css/plugin/select2/select2.min.css') }}
{{ HTML::style('css/plugin/select2/select2-bootstrap.css') }}
My Js file include as follows after body tag
{{ HTML::script('js/jquery.min.js') }}
{{ HTML::script('js/bootstrap.min.js') }}
{{ HTML::script('js/plugin/select2/select2.min.js') }}
{{ HTML::script('js/plugin/select2/select2.js') }}
MY HTML code
<input type="hidden" id="student-name-search"
data-placeholder="Select Student" value="" data-option="" style="width:100%"> </input>
Image
enter image description here
You have to use a select input in your HTML like this:
$(document).ready(function() {
$(".js-example-basic-single").select2();
});
<select class="js-example-basic-single">
<option value="AL">Alabama</option>
...
<option value="WY">Wyoming</option>
</select>