Hugo Theme PaperMod Obrazy !
Dodawanie metryki z godzinami
Dodałem tabelę na stronie Wyzwania i będzie na początku wystarczająca aby dodawać LogBook z przepracowanymi godzinami w Challange. Tabela będzie zawierała link do Post z numerem np #6. Nie zawsze będę tworzył post gdyż całe 2h poświęce na zadanie.
Wysyłanie Odpowiedzi na JobOffer
Dodatkowo pomyślałem że mogę wysyłać odpowiedz na Juniorskie oferty pracy Front-End oraz inne pokrewne ale związane z IT vacanty. Przy okazji robię rozeznanie co się dzieje na rynku IT. Znów jest dużo ofert Junior.
Dodawanie obrazów do Theme i kwestie renderowania
Jest więcej wiedzy na temat dodwawania do Hugo obrazów. Można statycznie przez szablony oraz można użyć techniki bundle. Temat do rozwinięcia poniżej kilka przydatnych zasobów.
Post Cover Image
In post's page-variables add :
cover:
image: "<image path/url>"
# can also paste direct link from external site
# ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png
alt: "<alt text>"
caption: "<text>"
relative: false # To use relative path for cover image, used in hugo Page-bundles
When you include images in the Page Bundle, multiple sizes of the image will automatically be provided using the HTML5 srcset field.
To reduce generation time and size of the site, you can disable this feature using
params:
cover:
responsiveImages: false
To enable hyperlinks to the full image size on post pages, use
params:
cover:
linkFullImages: true
Zasoby PaperMod
PaperMod to wszechstronny szablon dla Hugo, który oferuje wiele zasobów i opcji konfiguracyjnych, umożliwiając dostosowanie wyglądu i funkcjonalności strony do własnych potrzeb. Oto niektóre z zasobów i opcji konfiguracyjnych dostępnych w PaperMod:
- Motywy kolorystyczne: Możliwość wyboru różnych motywów kolorystycznych, aby dopasować wygląd strony do preferencji użytkownika.
- Układ strony: Konfigurowalne układy strony, takie jak układ z jedną kolumną, dwoma kolumnami, itp.
- Nagłówki i stopki: Opcje dostosowywania nagłówków i stopek, w tym dodawanie własnych logo, linków do mediów społecznościowych i innych elementów.
- Menu nawigacyjne: Możliwość tworzenia i dostosowywania menu nawigacyjnych, aby ułatwić użytkownikom poruszanie się po stronie.
- Widżety: Dodawanie różnych widżetów, takich jak listy najnowszych postów, kategorie, tagi, itp.
- Obsługa obrazów: Zaawansowane opcje przetwarzania obrazów, w tym responsywne obrazy, linki do pełnych rozmiarów obrazów, itp.
- Render hooks: Możliwość dostosowywania sposobu renderowania różnych elementów strony za pomocą render hooks.
- SEO i analityka: Wbudowane wsparcie dla SEO i integracji z narzędziami analitycznymi, takimi jak Google Analytics.
Dzięki tym zasobom i opcjom konfiguracyjnym, PaperMod pozwala na praktycznie dowolne dostosowanie szablonu do indywidualnych potrzeb i preferencji użytkownika. Oto link do strony GitHub AdityLang Git Hugo PaperMode twórcy szablonu.
Dodawanie obrazów zostało zaimplementowane.
Robi się to przez:
- dodaj obraz do static/img a następnie code.
- w moim przypadku static/img
- trzeba pamiętać o finalnej ścieźce do obrazka
![Kodowanie](/img/code.jpg)
Więcej o tej modyfikacji a także jak dodałem title do a href jest w post #40 40 Jak dodać title w a href Hugo.
40 Jak dodać title w a href Hugo
Dodatkowe flagi do CLI Hugo
Hugo version
hugo version
Moja v Hugo go v0.123.0-DEV-1891d5e6b5575e3abb7e0f80c3fbce1670f9bd5e windows/amd64 BuildDate=2024-02-01T07:18:11Z
Usuwanie public
Przed budowaniem witryny w trybie produkcyjnym, upewnij się, że katalog public jest czysty. Możesz to zrobić, usuwając zawartość katalogu public przed każdym budowaniem:
rm -rf public/*
Dodatkowe błędy w konsoli
Uruchom polecenie budowania z dodatkowymi opcjami debugowania, aby uzyskać więcej informacji na temat błędów:
hugo --logLevel info --logLevel debug