Questions about your theme #5

pokemaster974 · 2022-10-13T15:08:10Z

Hi @boratanrikulu sorry if it's not the good place (it's not really an issue) but I thought that other people could have the same questions.

I've developped a personnal website with Hugo and your theme. This is the first "initial" deploy of it : https://cys-photographie.netlify.app/

Modifications

First of all, I will tell you the modifications I've made from your theme. Maybe it could give you ideas for improvements :

style.css :

.menu {
    max-width: 1200px;
}
/* I've grown the max-width to prevent navbar to take 2 lines when we add tags in menu */

img.logo {
    border-radius: 0%;
    height: 100%;
}

/* I've removed the border-radius because with 50% (default) it will "cut" the border of non-circle logo */

adding a 404.html file into layout folder to localize the error page (and copying this content into nil/single.html because on rare occasions it loads the default 404 page instead my custom 404 page, I don't know why exactly).

{{ partial "header.html" . }}

{{ partial "navbar.html" . }}
<body>
    <section class="hero is-fullheight">
        <div class="hero-body">
            <div class="">
                <div class="header-404">
                    <img src="/idontknow.png" alt="" width="25%" height="25%">
                </div>
                <div class="body-404">
                    <p class="subtitle-404">Page non trouvée</p>
                    <p class="title-404">404</p>
                    <a href="/">Retour à la case départ</a>
                </div>
            </div>
        </div>
    </section>
{{ partial "footer.html" . }}

modifying partials/slides/meta.html to have a better "localization" of the format date :

                  <p>{{ .ctx.Page.Date.Format "2 January 2006" }}</p>
              </div>
          {{ else }}
              <div class="center column slide-meta-el grey">
                  <p>{{ with (index $.imgs 0).Exif }}</p>{{ .Date.Format "2 January 2006" }}</p>{{ end }}</p>

I've tried to localize perfectly to french "conventions" with this template code but never success.
If I just change 2 January 2006 with :date_full it will literally write ":date_full" on the page.
If I try to use the complete template {{ .Date | time.Format ":date_full" }} or {{ .ctx.Page..Date | time.Format ":date_full" }} it will break all the website.

I've added a html code into partials/slides/slider.html to inform visitors that they can click on the pictures to open the viewer :

<div class="center">
    <div class="slide-info">
        <div class="content">
            {{ . }}
        </div>
    </div>
</div>
{{ end }}
<center>N'hésitez pas à cliquer sur les images pour ouvrir la visionneuse</center>

Questions

Now my questions :

does the website loads indefinitively the pictures, for example into the /work page or can we add a maximum pictures loaded ?
how are displayed the pictures ? I've loaded several times and I've done a full reload, but it seems to have always the same order, and the posts with the smallest weight (1 in my case) are not even loaded into the first place on my /work page.
I was hoping the smalles weight will be displayed first, and randomly.
where do you think it's the best place to store the pictures ?
In my case, I've added folders into the "asset" folder and call them from the page with something like this :

images:
  /images/aerien/_CYS0486_.jpg

I've tried to add them into static or ressources but without success or not also easy than this "asset" method.

at the beginning of my coding, I was planned to made one post with several pictures (like an album) but if we add multipleColumn: true all pictures wil be aligned only on one line even if they are 6 or more pictures into the post. I could add multipleColumn: true but I don't find very attractive.
I don't know if we can add a viewer which let use configure the number of max columns et let us navigate to the "album" post with left and right arrows.

Sorry for this long post, but hoping we can discuss about it.
Regards.

The text was updated successfully, but these errors were encountered:

pokemaster974 · 2022-10-14T11:14:03Z

For the order, I guess it could be because of this code into colums.html :
{{ $posts = sort $posts ".Params.weight" "desc" }}

It seems coherent with my reports, as the higher weights seem to be displayed fisrt. It seems in contradiction with the docs page of hugo :

Lower weight gets higher precedence. So content with lower weight will come first.

pokemaster974 · 2022-10-16T07:49:59Z

As I understand, random ordering for content with same weight can't be displayed randomly because of Hugo is static site generator. I can deal with this.

But do you know if all the contents are loaded even if I don't scroll the page ? If yes, what do you think about a pagination to have a maximum content loaded in the first page ?
If I check the lighthouse report of my page the recommandation is :

Avoid enormous network payloads - Total size was 5,950 KiB

boratanrikulu · 2022-10-16T11:29:51Z

But do you know if all the contents are loaded even if I don't scroll the page ?

Lazy Load is implemented. So, only visible (a bit more) content will be loaded. You can test it by checking network page in your browser.

boratanrikulu · 2022-10-16T11:33:04Z

Lower weight gets higher precedence. So content with lower weight will come first.

I disagree. If we use "asc", it will be harder for long-term theme usage. Let's say you have 10 posts, they have weights and you want to add a new post and make it most important post; in case we use "asc", you need to update other posts' weights too. In case we use "desc", you can just use higher value for the weight.

pokemaster974 · 2022-10-16T13:04:16Z

Lower weight gets higher precedence. So content with lower weight will come first.

I disagree. If we use "asc", it will be harder for long-term theme usage. Let's say you have 10 posts, they have weights and you want to add a new post and make it most important post; in case we use "asc", you need to update other posts' weights too. In case we use "desc", you can just use higher value for the weight.

As you can use negative weights, it's not really true that we are "blocked" by using "asc" because in your example you could easily go to both directions. But I understand your point of view.

pokemaster974 · 2022-10-16T13:40:17Z

But do you know if all the contents are loaded even if I don't scroll the page ?

Lazy Load is implemented. So, only visible (a bit more) content will be loaded. You can test it by checking network page in your browser.

Checked and yes, I saw that some images are only loaded after the scroll. Thanks for the clarification about this !

boratanrikulu · 2022-10-16T13:44:29Z

at the beginning of my coding, I was planned to made one post with several pictures (like an album) but if we add multipleColumn: true all pictures wil be aligned only on one line even if they are 6 or more pictures into the post. I could add multipleColumn: true but I don't find very attractive.
I don't know if we can add a viewer which let use configure the number of max columns et let us navigate to the "album" post with left and right arrows.

The theme supports using multiple pictures. multipleColumn: true puts them all to a single row. If it's false, all of them will be in a single column. Currently gallery is not supported. Only single-row or single-column is supported. multipleColumn: true is useful for 2-3 pictures, like this one https://cankalay.com/the-man-on-the-wall/, or this one https://eternity.bora.sh/people-5/

Example without multipleColumn; https://eternity.bora.sh/nature-4/

boratanrikulu · 2022-10-16T13:49:45Z

where do you think it's the best place to store the pictures ?
In my case, I've added folders into the "asset" folder and call them from the page with something like this :

Yes I think using assets/ folder is okay for current version. But there's a new approach called Page Bundle by @dgoodwin. If we merge the approach, you will be able to use folders for posts.

boratanrikulu · 2022-10-18T21:08:16Z

.menu {
max-width: 1200px;
}
/* I've grown the max-width to prevent navbar to take 2 lines when we add tags in menu */

I guess this change will lead to a responsive issue.

img.logo {
border-radius: 0%;
height: 100%;
}
/* I've removed the border-radius because with 50% (default) it will "cut" the border of non-circle logo */

Hmm, okay I see. I will think about this and make changes. I don't want to break radius feature but we can make param to disable this radius.

I've developped a personnal website with Hugo and your theme. This is the first "initial" deploy of it : https://cys-photographie.netlify.app/

Great! It's good to see you use the theme. As I see there are some responsive issues on mobile, I guess it's not caused by the theme, maybe some overwrite-changes?

adding a 404.html file into layout folder to localize the error page (and copying this content into nil/single.html because on rare occasions it loads the default 404 page instead my custom 404 page, I don't know why exactly).

Hmm, I don't understand this. So it randomly loads your custom or default 404 page?

modifying partials/slides/meta.html to have a better "localization" of the format date :

Okay, I'll change it to time.Format usage

I've added a html code into partials/slides/slider.html to inform visitors that they can click on the pictures to open the viewer :

I think no need to add this information to Slider. I think it's obvious they're clickable.

boratanrikulu · 2022-10-18T21:09:47Z

does the website loads indefinitively the pictures, for example into the /work page or can we add a maximum pictures loaded ?

There's no a limit. But like I said, #5 (comment)
I think post count should not be a problem

boratanrikulu · 2022-10-18T21:12:03Z

how are displayed the pictures ? I've loaded several times and I've done a full reload, but it seems to have always the same order, and the posts with the smallest weight (1 in my case) are not even loaded into the first place on my /work page.
I was hoping the smalles weight will be displayed first, and randomly.

Random is not supported. You can use Hugo's sorting methods https://github.com/boratanrikulu/eternity/blob/main/doc/posts.md#usage-of-posts

boratanrikulu · 2022-10-18T21:13:58Z

I guess I answered all questions.

I'll check later for these;

time.Format usage
radius

pokemaster974 · 2022-10-20T21:29:47Z

Thanks for your replies. Yes I need to check it again because I'm surely doing wrong job when trying to customize your theme.

I've find best theme and yours is the only one adapt to a photos' portfolio so hoping you could improve it even if it's already a very good theme for photographer.
I'm happy to help you (if I can) !

boratanrikulu · 2022-10-21T20:05:48Z

Via 1.3.7 version

time.Format usage

":date_long" is used as time format

radius

disableRadius variable is added to disable logo's radius. You can check example config or docs.

pokemaster974 · 2022-10-22T10:51:24Z

Via 1.3.7 version
* time.Format usage
":date_long" is used as time format
* radius
disableRadius variable is added to disable logo's radius. You can check example config or docs.

Thanks for this update.

I can confirm I've revert back the css parameters for img.logo and adding the parameters into my config file is working
I can confirm that revert back the .Date.Format "2 January 2006" to the new template format | time.Format ":date_long" is working (many thanks for this !)

pokemaster974 mentioned this issue Oct 16, 2022

Adding a section for the last new contents #10

Closed

boratanrikulu closed this as completed Oct 21, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Questions about your theme #5

Questions about your theme #5

pokemaster974 commented Oct 13, 2022 •

edited

Loading

pokemaster974 commented Oct 14, 2022

pokemaster974 commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022 •

edited

Loading

pokemaster974 commented Oct 16, 2022

pokemaster974 commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022 •

edited

Loading

boratanrikulu commented Oct 16, 2022

boratanrikulu commented Oct 18, 2022 •

edited

Loading

boratanrikulu commented Oct 18, 2022

boratanrikulu commented Oct 18, 2022

boratanrikulu commented Oct 18, 2022

pokemaster974 commented Oct 20, 2022

boratanrikulu commented Oct 21, 2022 •

edited

Loading

pokemaster974 commented Oct 22, 2022

Questions about your theme #5

Questions about your theme #5

Comments

pokemaster974 commented Oct 13, 2022 • edited Loading

Modifications

Questions

pokemaster974 commented Oct 14, 2022

pokemaster974 commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022 • edited Loading

pokemaster974 commented Oct 16, 2022

pokemaster974 commented Oct 16, 2022

boratanrikulu commented Oct 16, 2022 • edited Loading

boratanrikulu commented Oct 16, 2022

boratanrikulu commented Oct 18, 2022 • edited Loading

boratanrikulu commented Oct 18, 2022

boratanrikulu commented Oct 18, 2022

boratanrikulu commented Oct 18, 2022

pokemaster974 commented Oct 20, 2022

boratanrikulu commented Oct 21, 2022 • edited Loading

pokemaster974 commented Oct 22, 2022

pokemaster974 commented Oct 13, 2022 •

edited

Loading

boratanrikulu commented Oct 16, 2022 •

edited

Loading

boratanrikulu commented Oct 16, 2022 •

edited

Loading

boratanrikulu commented Oct 18, 2022 •

edited

Loading

boratanrikulu commented Oct 21, 2022 •

edited

Loading