devcows / hugo-universal-theme

Universal theme for Hugo, it stands out with its clean design and elegant typography.
https://devcows.github.io/hugo-universal-theme
MIT License
803 stars 569 forks source link

[Discussion] feature parity with upstream Bootstrapious theme? #101

Open ringods opened 7 years ago

ringods commented 7 years ago

This issue is intended to get these 2 questions answered:

  1. do we want this Hugo theme to have feature parity with the upstream Bootstrapious theme?
  2. how will we implement the missing stuff if the first question is answered positive?

Apologies if this discussion would have had a better place on the Hugo forums, but I wanted the pool of contributors to definitely see this and be involved.

Intent

If this discussion comes to a positive conclusion, I'm more than willing to contribute changes as I have an actual need for some of the missing features.

What is missing?

First have a look at the upstream Boostrapious Universal theme:

http://universal.ondrejsvestka.cz/1-0/

Looking at the Home menu, the Hugo theme only has the Default Page. There are still 4 other landing page layouts:

The Features section refers to shortcodes, but the Hugo theme doesn't have (all of) them:

The Portfolio section offers 2, 3 and 4 column layouts with our without space between the items.

How to implement it?

Landing pages

To support more variations in the landing page layouts, we could offer a number of different layouts, named after the landing page style. To prevent duplication in these styles, we should start using base templates and blocks. We could have the following files in the layouts folder:

baseof.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>{{ block "title" . }}
      <!-- Blocks may include default content. -->
      {{ .Site.Title }}
    {{ end }}</title>
  </head>
  <body>
    <!-- Code that all your templates share, like a header -->
    {{ block "main" . }}
      <!-- The part of the page that begins to differ between templates -->
    {{ end }}
    {{ block "footer" . }}
    <!-- More shared code, perhaps a footer but that can be overridden if need be in  -->
    {{ end }}
  </body>
</html>

index.html

{{ define "main" }}
        {{ partial "carousel.html" . }}
        {{ partial "features.html" . }}
        {{ partial "testimonials.html" . }}
        {{ partial "see_more.html" . }}
        {{ partial "recent_posts.html" . }}
        {{ partial "clients.html" . }}
{{ end }}

application.html

{{ define "main" }}
        {{ partial "app_info.html" . }}
        {{ partial "features.html" . }}
        {{ partial "packages.html" . }}
        {{ partial "clients.html" . }}
        {{ partial "see_more.html" . }}
{{ end }}

The more we can capture in base templates, the easier it becomes for users of the theme to create a custom layout in their own layouts folder and mix and match the partial templates to their likings.

Shortcodes

The current Hugo theme implements its Features feature with one of the specific content boxes from the upstream theme. But the contentbox could be a real Hugo shortcode, allowing for all the different types of variations.

Same for some of the other Universal 'shortcodes'. By using real Hugo shortcodes, we could even DRY up the theme for users. They could create custom layouts and use shortcodes mixed with partials, e.g.:

other-application.html

{{ define "main" }}
        {{% block name="application" content="application.md" %}}
        {{% block name="features" content="features.md" %}}
        {{ partial "packages.html" . }}
        {{ partial "clients.html" . }}
        {{ partial "see_more.html" . }}
{{ end }}

Summary

By using base templates, blocks and shortcodes, this theme would allow a user to have a decent set of default layouts, but also create additional custom layouts in a DRY manner.

GeorgeWL commented 7 years ago

I agree with the DRY heavily.

I'm not sure why some of the base layouts in the original theme exist tbh. But I do think trying to match upstream would make sense...to a point, we don't really want to have this be infinite-Development.

ringods commented 7 years ago

@GeorgeWL I just want a theme that is very flexible for users to use/reuse/extend so it is not needed to do inifinite development. Updating it with base templates and blocks would help a lot in this respect.

GeorgeWL commented 7 years ago

Yeah I totally agree there @ringods

Would this be a rather major overhaul do you suppose, or just adding incremental changes?

I think it makes sense to stat with the most useful parts first.

So the Team Members Template is likely to be used often. The Portfolio Template is likely to be used often too.

ringods commented 7 years ago

@GeorgeWL I still have to dissect a bit more, but the improvements can be done in a series of smaller pull requests, meanwhile checking if everything keeps working.