zerostaticthemes / hugo-hero-theme

A multi-page Hugo theme with fullscreen hero images and fullwidth sections.
https://hugo-hero.netlify.com
MIT License
355 stars 252 forks source link

Make customizing of index page meta tags easier. #3

Closed onedrawingperday closed 5 years ago

onedrawingperday commented 5 years ago

Hello again.

I noticed that the day before yesterday you made this commit: https://github.com/JugglerX/hugo-hero-theme/commit/bc5c2bad7a57fa6cf99423a171ec5472db197c6f that among other changes introduced a block for meta tags in

layouts/index.html

It would be best if you either defined that block in the Example Site by overriding the theme’s index layout or if you turned these meta tags into config parameters.

Users need to be made aware of these tags and how to modify them. You could add some instructions in the README or comments in the Example Site config.

As things are now users who don’t notice these meta tags will have the ones that point to your theme’s Netlify demo on their personal websites.

cc: @digitalcraftsman

JugglerX commented 5 years ago

will do.

Thing is currently the live demo is basically a duplicate of the theme which lives in a separate repo. Normally I work on that repo and deploy the changes to netlify. Then I just copy over the files using a build script into this themes repo. So some of the data that is unique to the live demo is getting copied over where it shouldn't. I just need to make this process a little bit more efficient, I don't enjoy having to manually edit the files for the theme every time I deploy.

onedrawingperday commented 5 years ago

One way to go about this within Hugo would be assigning an Enviroment Variable for Netlify and then in your theme's templates you use the getenv function to have these meta tags called as you need them.

JugglerX commented 5 years ago

I'm already using a Netlify environment variables for the google analytics code (maybe on another theme). So yeah this is a nice approach.

It's more about having to manage 2 separate repos.

But I'm just looking at your pull request where you added themesDir = "../.." to the exampleSite/config.toml - It seems like I can actually run hugo from the exampleSite directory on my local and the site runs using the example content!

This makes me think I can probably just deploy to Netlify from this theme repo. On Netlify the hugo command needs to be run from the root of the repo but maybe I can do something like below as the build command

hugo --config exampleSite/config.toml --contentDir exampleSite/content --themesDir ../
JugglerX commented 5 years ago

I've removed the meta tags that had the live demo data just so it doesn't pollute things for anyone who uses the theme right now. I'll work on a more permanent solution.

onedrawingperday commented 5 years ago

Ok. 👍

I'm closing this issue.

JugglerX commented 5 years ago

We can keep it open for a bit until the real solution is in place.

JugglerX commented 5 years ago

What I really want to do is.

Be able to work with just this repo. And this repo should only be the theme so it's compatible with hugoThemes.

Clone this repo to my local and run hugo server and see the working site with the real example content without having to put it inside an existing hugo project and copy the exampleSite to the root.

Be able to git push to this repo and have it build on Netlify using hugo or hugo with a bunch of cli config options.

be able to have unique live demo data, that is not included in the repo >_<

be able to submit this repo to Netlify themes, and make it compatible with the 1 click deploy

onedrawingperday commented 5 years ago

be able to have unique live demo data, that is not included in the repo >_<

Currently there is https://github.com/gohugoio/hugo/issues/5074 When it is resolved generating pages from data sources will be a lot easier.

JugglerX commented 5 years ago

thanks for all your help so far mate, really appreciate it!

JugglerX commented 5 years ago

The meta tags are now configured in the config.toml

[params]
  google_analytics_id=""

  [params.homepage_meta_tags]
    meta_description = "Hero is a multipurpose Hugo theme with fullscreen hero images and fullwidth sections. It contains content types for a business or portfolio site."
    meta_og_title = "Hugo Hero Theme"
    meta_og_type = "website"
    meta_og_url = "https://hugo-hero.netlify.com"
    meta_og_image = "https://github.com/JugglerX/hugo-hero-theme/blob/master/images/tn.png"
    meta_og_description = "Hero is a multipurpose Hugo theme with fullscreen hero images and fullwidth sections. It contains content types for a business or portfolio site."
    meta_twitter_card = "summary"
    meta_twitter_site = "@zerostaticio"
    meta_twitter_creator = "@zerostaticio"

I have also added instructions in the README.MD on how to update these.

onedrawingperday commented 5 years ago

Great! :+1