diff --git a/README.md b/README.md index 90ea2fb..cc0c9ef 100644 --- a/README.md +++ b/README.md @@ -127,6 +127,10 @@ site_title: "My Blog" site_author: "Your Name" ``` +## Favicon + +A favicon is automatically generated at `dist/favicon.svg` using your site title initials. It uses the `social_highlight` color as the background and requires the [Open Sans](https://fonts.google.com/specimen/Open+Sans) font. + ## OpenGraph Images When ImageMagick is installed, blurt automatically generates OpenGraph images for social sharing. Requires the [Open Sans](https://fonts.google.com/specimen/Open+Sans) font to be installed. Images are created at: @@ -139,10 +143,12 @@ Images display: - Date (top-right, posts only) - Title (bottom-left) -The background uses a subtle gradient based on your highlight color. Configure it in `config.yaml`: +## Highlight Color + +Both the favicon and OpenGraph images use a configurable highlight color. Set it in `config.yaml`: ```yaml -og_highlight: "#3b82f6" # Any hex color +social_highlight: "#3b82f6" # Any hex color ``` The `social.html` partial includes all necessary meta tags for OpenGraph and Twitter cards. diff --git a/blurt b/blurt index 0812b94..be8bff4 100755 --- a/blurt +++ b/blurt @@ -1,7 +1,7 @@ #!/bin/sh set -e -VERSION="1.5.0" +VERSION="2.0.0" SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)" DIST="$SCRIPT_DIR/dist" @@ -27,7 +27,8 @@ xml_escape() { generate_favicon() { title="$1" - output="$2" + highlight="$2" + output="$3" # Extract initials from title (first letter of each word, max 2) initials=$(echo "$title" | awk '{ @@ -38,8 +39,9 @@ generate_favicon() { cat >"$output" < - - $initials + + $initials + $initials EOF } @@ -144,8 +146,8 @@ cmd_build() { # Read config values for OG image generation site_url=$(sed -n 's/^site_url: *"\{0,1\}\([^"]*\)"\{0,1\} *$/\1/p' "$SCRIPT_DIR/config.yaml" 2>/dev/null | head -1) - og_highlight=$(sed -n 's/^og_highlight: *"\{0,1\}\([^"]*\)"\{0,1\} *$/\1/p' "$SCRIPT_DIR/config.yaml" 2>/dev/null | head -1) - [ -z "$og_highlight" ] && og_highlight="#6246ea" + social_highlight=$(sed -n 's/^social_highlight: *"\{0,1\}\([^"]*\)"\{0,1\} *$/\1/p' "$SCRIPT_DIR/config.yaml" 2>/dev/null | head -1) + [ -z "$social_highlight" ] && social_highlight="#6246ea" rm -rf "$DIST" mkdir -p "$DIST" @@ -171,7 +173,7 @@ cmd_build() { sed -i.bak "s/__BUILD_TIME__/$page_time/g" "$DIST/$slug/index.html" rm -f "$DIST/$slug/index.html.bak" - generate_og_image "$title" "$site_url" "$date" "$og_highlight" "$DIST/$slug/og.jpg" + generate_og_image "$title" "$site_url" "$date" "$social_highlight" "$DIST/$slug/og.jpg" posts_data="$posts_data$date $slug $title " @@ -193,8 +195,8 @@ cmd_build() { rm -f "$DIST/index.html.bak" # Generate OG image for homepage (no date) - generate_og_image "$site_title" "$site_url" "" "$og_highlight" "$DIST/og.jpg" - generate_favicon "$site_title" "$DIST/favicon.svg" + generate_og_image "$site_title" "$site_url" "" "$social_highlight" "$DIST/og.jpg" + generate_favicon "$site_title" "$social_highlight" "$DIST/favicon.svg" # Generate Atom feed site_url=$(sed -n 's/^site_url: *"\{0,1\}\([^"]*\)"\{0,1\} *$/\1/p' "$SCRIPT_DIR/config.yaml" 2>/dev/null | head -1) diff --git a/config.yaml b/config.yaml index b7e2d34..f707a11 100644 --- a/config.yaml +++ b/config.yaml @@ -2,4 +2,4 @@ site_title: "My blog" site_url: "https://example.com" site_author: "Your Name" site_description: "Your site description" -og_highlight: "#3b82f6" +social_highlight: "#3b82f6"