https://kellyyubini.github.io/kellyyubini/categories/theme-features/Recent content in Theme Features on Kelly Yubini YubiniHugoes-ESThu, 28 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/spoonful-series/01-spoonful/Fri, 01 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/spoonful-series/01-spoonful/ Hi, I'm the here-bot cat! Use me to find your way in your website. Here I am: content/blog/spoonful-series/01-spoonful.md To remove me, delete this line inside that file: {{< here >}} My content section is: blog My layout is: single-series does this work? or this? Let’s start. beginning middle endhttps://kellyyubini.github.io/kellyyubini/blog/spoonful-series/02-spoonful/Sat, 02 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/spoonful-series/02-spoonful/ Hi, I'm the here-bot cat! Use me to find your way in your website. Here I am: content/blog/spoonful-series/02-spoonful/index.md To remove me, delete this line inside that file: {{< here >}} My content section is: blog My layout is: single-series Images in this page bundle: /kellyyubini/blog/spoonful-series/02-spoonful/sidebar-inverse.jpg part 2! does this work? now for some very cool things more get ready!https://kellyyubini.github.io/kellyyubini/blog/spoonful-series/03-spoonful/Sun, 03 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/spoonful-series/03-spoonful/Hi, I'm the here-bot cat! Use me to find your way in your website. Here I am: content/blog/spoonful-series/03-spoonful/index.markdown Here is my R Markdown source file: blog/spoonful-series/03-spoonful/index.Rmarkdown You'll want to edit this file, then re-knit to see the changes take effect in your site preview. To remove me, delete this line inside that file: {{< here >}} My content section is: blog My layout is: single-series Images in this page bundle: /kellyyubini/blog/spoonful-series/03-spoonful/featured-photo.https://kellyyubini.github.io/kellyyubini/blog/social/Thu, 28 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/social/There are five places where you can choose to show social icons. Here is the tl;dr: site header (set in config.toml), site footer (set in config.toml), homepage (set in content/_index.md), about page in the sidebar (set in content/about/sidebar/index.md), and contact page (set in content/form/contact.md). Read on to learn how to set up your social icons, and how to show/hide them. Configure social Wherever you end up wanting to show your social icons, you’ll need to start by setting up the links in your site config.https://kellyyubini.github.io/kellyyubini/blog/color-themes/Wed, 27 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/color-themes/You can totally customize your site’s theme colors within minutes of creating a new site. Read on to find out how, and decide which of the three options meets your needs. Use a color theme Hugo Apéro includes 8 built-in color themes that work “out of the box.” This means you can use a color theme to quickly customize the look of your site without needing to write any CSS. You can select the color theme in your config.https://kellyyubini.github.io/kellyyubini/blog/fonts/Wed, 27 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/fonts/As with color themes, you can completely customize your site’s fonts within minutes of creating a new site. How you do it depends on how much control and customization you need. Embedded fonts Hugo Apéro includes 6 embedded fonts that work “out of the box.” We selected 3 serif and 3 sans-serif options that we thought looked good with this theme, in our humble opinions. All embedded fonts include real italics so you may emphasize to your heart’s content :heart:!https://kellyyubini.github.io/kellyyubini/blog/seedling/Sat, 02 Jan 2021 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/seedling/Courtesy of panelset.js by Garrick Aden-Buie, from his xaringanExtra package: https://pkg.garrickadenbuie.com/xaringanExtra/#/panelset For example, this panelset: Hello! 👋 hello Goodbye 💨 goodbye Was created by combining this theme’s panelset and panel shortcodes: {{< panelset class="greetings" >}} {{< panel name="Hello! :wave:" >}} hello {{< /panel >}} {{< panel name="Goodbye :dash:" >}} goodbye {{< /panel >}} {{< /panelset >}} You could also revert to HTML as well. For example, this panelset: Question Which came first: the :chicken: or the :egg:?https://kellyyubini.github.io/kellyyubini/project/giraffes/Wed, 03 Jul 2019 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/project/giraffes/Tachyons is a design system that allows you to design gorgeous interfaces in the browser with little effort. Because Speed Building this static site generator theme was the first time I used an Atomic (or Functional) CSS system like Tachyons. It’s a design system that provides very small (which means fast) CSS modules that you can use in your HTML. So, rather than writing every line of CSS, you apply the style you need as you write your HTML with easy to understand shorthand class names.https://kellyyubini.github.io/kellyyubini/blog/css-grid-scaffold/Tue, 02 Jul 2019 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/css-grid-scaffold/“Grid is the very first CSS module created specifically to solve the layout problems we’ve all been hacking our way around for as long as we’ve been making websites.” — Chris House, A Complete Guide to CSS Grid Layout 1 Overview Since I began building websites in Y2K, I’ve lost count how many times the phrase “…there’s got to be a better way to do this” has passed my lips.https://kellyyubini.github.io/kellyyubini/project/penguins/Tue, 02 Jul 2019 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/project/penguins/“Grid is the very first CSS module created specifically to solve the layout problems we’ve all been hacking our way around for as long as we’ve been making websites.” — Chris House, A Complete Guide to CSS Grid Layout 1 Since I began building websites in Y2K, I’ve lost count how many times the phrase “…there’s got to be a better way to do this” has passed my lips. Most times, while fighting with floats and widths of content and sidebars or just basically trying to get something beside something else without using a stupid TABLE.https://kellyyubini.github.io/kellyyubini/project/bakeoff/Mon, 01 Jul 2019 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/project/bakeoff/Formspree makes it easy to receive submissions from HTML forms on your static website. Functional Form This theme has a form-to-email feature built in, thanks to the simple Formspree integration. All you need to activate the form is a valid recipient email address saved in the front matter of the form (/content/forms/contact.md). Of course, the example shown below (your@email.here) must not be used. Please use your actual email address.https://kellyyubini.github.io/kellyyubini/blog/built-in-contact-form/Mon, 01 Jul 2019 00:00:00 +0000https://kellyyubini.github.io/kellyyubini/blog/built-in-contact-form/Formspree makes it easy to receive submissions from HTML forms on your static website. Functional Form This theme has a form-to-email feature built in, thanks to the simple Formspree integration. All you need to activate the form is a valid recipient email address saved in the front matter of the form (/content/forms/contact.md). Of course, the example shown below (your@email.here) must not be used. Please use your actual email address.