Headline Generator for Github Markdown
File to generate beautiful Google Fonts
Headlines.
{ font__google_fonts__h1__name: "Permanent Marker" }
{ font__google_fonts__h1__name: "Playfair Display" }
{ font__google_fonts__h1__name: "Roboto Condensed" }
{ font__google_fonts__h1__name: "Sarina" }
{ font__google_fonts__h1__name: "Sonsie One" }
{ font__google_fonts__h1__name: "Trocchi" }
{ font__google_fonts__h1__name: "UnifrakturMaguntia" }
{ font__google_fonts__h1__name: "Zilla Slab Highlight" }
- Examples
- Quickstart
- Demo
- Setup
- Process
- Functions
- Options
- Limitations
- Contributing
- License
- Code of Conduct
- Support my Work
Single Title
require 'markdown_titles_to_svg'
svg = MarkdownTitlesToSvg.single(
'headline',
:h1,
{}
)
Generate from Github Markdown
require 'markdown_titles_to_svg'
markdowns = [
'https://raw.githubusercontent.com/a6b8/a6b8/main/templates/readme.md'
]
MarkdownTitlesToSvg.generate(
markdowns,
'a6b8',
{}
)
Add this line to your application's Gemfile:
gem 'markdown_headlines_to_svg'
And then execute:
$ bundle install
Or install it yourself as:
$ gem install markdown_headlines_to_svg
A. Implementation
B. Execution
Run Command
mds = [ PATH_FILE1, PATH_FILE2 ] markdown_headlines_to_svg.generate( mds, "github_profile_name", options = {} )
Prepare (Import) Font
:h1 :default | | | mode | mode ---------- ---------- | | | | v v v v Local Google Fonts Local
Scrape Titles
MD_FILE_ 1 QUEUE ------------------------------------------------------ | img src="../a/c/d/1.svg" alt="# Headline 1" ------|------> [ 0 ] | | | MD_FILE_2 | | ----------------------------------------------------- | | img src="../b/c/d/1.svg" alt="# Headline 2" -----|-> [ 1 ] |----| ... | | img src="../c/d/e/2.svg" alt="Title 1" ----------|-> [ 2 ] | ... | [ 0 ] { text: 'Headline 1', type: :h1, output: '../a/c/d/1.svg' } [ 1 ] { text: 'Headline 2', type: :h1, output: '../b/c/d/1.svg' } [ 2 ] { text: 'Title 1', type: :default, output: '../c/d/e/2.svg' }
Add Style and Font Options
default
+ user options
{ |
type: :h1, ---------------------|------------------
text: 'Headline 1', | |
output: '../a/c/d/1.svg', V V
style: <-------------------- options[ :style ][ :h1 ]
font: <---------------------- options[ :font ][ :h1 ]
},
{ ...
.get_options()
Output all Parameter
MarkdownTitlesToSvg.()
# => { github: { profile: nil, ...
.generate( [], '', {} )
Generate and store of Titles in all Files
MarkdownTitlesToSvg.generate(
markdowns,
'a6b8',
{}
)
Type | Required | Description | Example | Description |
---|---|---|---|---|
markdowns | Array (of String) |
Yes | [ '/markdown-titles-to-svg/main/README.md' ] |
Define List of Markup |
github user name | String |
Yes | 'a6b8' |
Set Github User Name |
options | Hash |
No | 'a6b8' |
Change default options, see "options" for more Information. |
.single( [], '', {} )
Generate a single Title and outputs a svg string.
svg = MarkdownTitlesToSvg.single(
'headline',
:h1,
{}
)
# => <svg ...
Type | Required | Description | Example | Description |
---|---|---|---|---|
headline | String |
Yes | 'headline' |
Set Text of Headline/Title |
style | Symbol |
Yes | :h1 |
Set type of style, choose between :h1 and :default |
options | Hash |
No | {} |
Change default options, see "options" for more Information. |
Github
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
A.1. | Source | :github__source | "https://raw.githubusercontent.com/" |
String |
Font
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
B.1. | Text_align | :font__text_align | left |
Symbol | Set aligment of text |
B.2. | Bold | :font__bold | false |
Boolean | Set format of font. If you use Google Fonts try "variant first" |
B.3. | Mode H1 | :font_mode_h1 | :google_fonts |
Symbol | Set mode for Headlines. Choose between :local and :google_fonts |
B.4. | Mode Default | :font_mode_default | :google_fonts |
Symbol | Set mode for Titles. Choose between :local and :google_font |
Import from Local
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
B.5. | H1 | :font_local_h1 | "/Library/Fonts/Microsoft/Corbel Bold.ttf" |
String | Set local font for Headline if necessary |
B.6. | Default | :font_local_default | "/Library/Fonts/Microsoft/Consolas.ttf" |
String | String |
Import from "Google Fonts"
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
B.7. | H1 Name | :font_google_fontsh1_name | "Oswald" |
String | Set Google Fonts font name for Headline |
B.8. | H1 Variant | :font_google_fontsh1_variant | "regular" |
String | Set Google Fonts variant type for headlines |
B.9. | H1 Subset | :font_google_fontsh1_subset | "latin" |
String | Set Google Fonts subset type for headlines |
B.10. | Default Name | :font_google_fontsdefault_name | "Amatic SC" |
String | Set Google Fonts font name for Titles |
B.11. | Default Variant | :font_google_fontsdefault_variant | "regular" |
String | Set Google Fonts variant type for titles |
B.12. | Default Subset | :font_google_fontsdefault_subset | "latin" |
String | Set Google Fonts subset type for titles |
Please use https://google-webfonts-helper.herokuapp.com/fonts to find your favorite Font.
View
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
C.1. | Offset Height | :view_offset_height | 0 |
Integer | Experimental: Set change View Box height |
C.2. | Offset Widht | :view_offset_widht | 0 |
Integer | Experimental: Set change View Box width |
Style
Headlines
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
D.1. | Color Opacity | :style_h1color_opacity | 1.0 |
Float | Change Headline color opacity |
D.2. | Color Default | :style_h1color_default | "#A5834B" |
String | Change Headline fill color |
D.3. | Color Palette | :style_h1color_palette | [] |
Array | Experimental: Set for each character in headline an other color |
D.4. | Stroke Color | :style_h1stroke_color | "none" |
String | Change headline fill color of stroke |
D.5. | Stroke Width | :style_h1stroke_width | "0" |
String | Change headline stroke width |
D.6. | Stroke Opacity | :style_h1stroke_opacity | 1.0 |
Float | Change headline stroke opacity |
D.7. | Stroke Linecap | :style_h1stroke_linecap | "butt" |
String | Change headline stroke width |
Default
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
D.8. | Color Opacity | :style_defaultcolor_opacity | 1.0 |
Float | Change Title color opacity |
D.9. | Color Default | :style_defaultcolor_default | "#A5834B" |
String | Change Title fill color |
D.10. | Color Palette | :style_defaultcolor_palette | [] |
Array | Experimental: Set for each character in titles an other color |
D.11. | Stroke Color | :style_defaultstroke_color | "none" |
String | Change title fill color of stroke |
D.12. | Stroke Width | :style_defaultstroke_width | "0" |
String | Change title stroke width |
D.13. | Stroke Opacity | :style_defaultstroke_opacity | 1.0 |
Float | Change title stroke opacity |
D.14. | Stroke Linecap | :style_defaultstroke_linecap | "butt" |
String | Change title stroke width |
You can find more Information about svg
format here: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/path
Other
Nr | Name | Key | Default | Type | Description |
---|---|---|---|---|---|
E.1. | Silent | :silent | false |
Boolean | Controll console output. |
Bug reports and pull requests are welcome on GitHub at https://github.com/a6b8/markdown-titles-to-svg-for-ruby. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the code of conduct.
- Font Types are limited to '.ttf' and '.otf'.
- Read only Markdown Files from Github.
The gem is available as open source under the terms of the MIT License.
Everyone interacting in the Statosio project's codebases, issue trackers, chat rooms and mailing lists is expected to follow the code of conduct.
Please ⭐️ star this Project, every ⭐️ star makes us very happy!