Not able to customize page

[nataliabernardo]

Hi! I'm trying to create my one page with this template. I followed the instructions (bundle, npm and jekyll install etc), however the changes that I made in _config.yml and about.md files are not being updated in the website. Do you have any idea of what is happening? Thank you.

[janczizikow]

Hey, I guess there could be a couple of scenarios why this is happening.

1. No Frontmatter in the file
2. If you're using gulp to run the site locally, I think it doesn't refresh on editing .md files
3. ServiceWorker

Frontmatter
Did you add YAML / Frontmatter in your .md or .html file? You should add it on top of the pages:

---
layout: page
title: About
permalink: /about/
---

# Markdown or HTML stuff goes here

Running local server with gulp
If you're using gulp to run the site locally, I'm not 100% sure if it refreshes on saving .md files (I don't remember 😆 ). So if that's the case you might have to stop the gulp process and re-run it again (ctrl + C in terminal and run gulp again)

ServiceWorker

Finally it could also be to service worker. It's because the SW open cache first and even if there're changes on the page, you might not see it. Don't want to get to detailed here, but basically it will allow users to access the site faster and even open it without internet connection if they visited the site before. BTW this still doesn't work once the site is published. What you can do is open the developer tools in your browser and check Update on Reload & Bypass for network option:

Try to reload the page with the developer tools open and see if it reloads. If this is the case you can just remove the service worker by removing the last <script> tag in _includes/footer.html. It has sw.js in it, so should be easy to find.

Let me know if any of that helps!

[nataliabernardo]

Thank you very much for you answer janczizikow! It updated when I went to another place with a faster wifi. Maybe, it was because of the low speed internet.

Now I'm having trouble with the images of cards. "gulp img" command returns:

Error: File `turnstile.jpg`: Image enlargement is detected
  real width: 1280px, required width: 1920px

Thank you!

[janczizikow]

That's because gulp-img cannot resize from smaller dimensions to bigger ones. So you cannot resize an image from 1280px => 1920px (it would result in stretching the image and reducing it's quality). If you want to use images smaller than 1920px you can change the options of the gulp-img task in gulpfile.js :

  // somes stuff
      }, {
        width: 1999, // dimensions of the blog post hero images
        rename: { suffix: '_lg' }
      }, {
        // max-width hero
        width: 1920,
      }],

// some stuff

So if you want to use 1280px images, just change the 1999 to 1280 and same for 1920px.

[nataliabernardo]

Thank you, janczizikow! :)