• Stars
    star
    13
  • Rank 1,507,725 (Top 30 %)
  • Language
    CSS
  • License
    MIT License
  • Created over 8 years ago
  • Updated about 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

GitHub Flavored Markdown Preview for TextMate 2

Version Plaftorm macOS macOS macOS macOS macOS

GitHub Flavored Markdown Editor and Preview for TextMate2

Write and preview your Markdown files like a Boss!

Requirements

Ruby is shipped with macOS. Current builtin ruby version (macOS Monterey) is 2.6.8. First, install bundler to your user folder;

$ gem install --user-install bundler

# find users path
$ ruby -r rubygems -e 'puts Gem.user_dir' # returns /Users/${USER}/.gem/ruby/2.6.0
$ export PATH="/Users/${USER}/.gem/ruby/2.6.0/bin:${PATH}" # add local user gem bin path to your shell environment

# or find it automatically
$ export PATH="$(ruby -r rubygems -e 'puts Gem.user_dir')/bin:${PATH}"

If you have already installed rbenv or rvm, you’re good to go.

Install and Update

Make sure that TextMate is not running. Add TM_RUBY environment variable to TextMate:

$ defaults write com.macromates.TextMate environmentVariables \
    -array-add "{enabled = 1; value = \"$(command -v ruby)\"; name = \"TM_RUBY\"; }"

Now clone the repo:

$ cd ~/Library/Application\ Support/TextMate/Bundles/
$ git clone https://github.com/vigo/textmate2-gfm-preview.git GFM-Preview.tmbundle
$ cd GFM-Preview.tmbundle/Support/
$ bundle config set --local path 'vendor/bundle'
$ bundle

That’s it! Bundle installed successfully! You can follow updates via git pull time-to-time.

$ cd ~/Library/Application\ Support/TextMate/Bundles/GFM-Preview.tmbundle
$ git pull origin main

TextMate Environment Variables

You can define;

  • TM_GFM_ZOOM_FACTOR: For zooming text.
  • TM_MARKDOWN_MATHJAX: For Mathjax support.
  • TM_MARKDOWN_MERMAID: For Mermaid support. (new!)
  • TM_GFM_FONT: For custom font which is installed to your ~/Fonts
  • TM_GFM_LINK_FONT_WEIGHT: Optional font-weight: css directive for a link tags.
  • TM_GFM_LINK_TEXT_DECORATION: Optional text-decoration: css directive for a link tags.

variables from TextMate > Preferences > Variables for customizing extra features. Or do it from shell:

# assuming that, `OpenSans` font already installed on your ~/Library/Fonts

defaults write com.macromates.TextMate environmentVariables -array-add \
    '{enabled = 1; value = "100%"; name = "TM_GFM_ZOOM_FACTOR"; }' \
    '{enabled = 1; value = 1; name = "TM_MARKDOWN_MATHJAX"; }' \
    '{enabled = 1; value = 1; name = "TM_MARKDOWN_MERMAID"; }' \
    '{enabled = 1; value = "OpenSans"; name = "TM_GFM_FONT"; }' \
    '{enabled = 1; value = "500"; name = "TM_GFM_LINK_FONT_WEIGHT"; }' \
    '{enabled = 1; value = "underline"; name = "TM_GFM_LINK_TEXT_DECORATION"; }'

Example Settings

Example Settings

Zooming

Without zoom (default/standard)

Without zoom

With 150% zoom:

150% zoom

You name it! Make it 300% if you like to! Now you can hit ⌃ + ⌥ + ⌘ + p or kntrl + alt + cmd + p

Editor Features

With the power or Redcarpet and Rouge gems, we have some special features in markdown operation!

Shortcuts Description
c + Insert code block. There are lots of languages supported. Thanks to rouge gem. List of languages are here.
+ C Convert selection to inline code.
+ H Convert selection to highlighted text.
+ S Convert selection to strikethrough text.
+ U Convert selection to underlined text.
table + Insert markdown table.
img + Insert markdown image.

Features

Mermaid Support (new!)

Add TM_MARKDOWN_MERMAID variable and set it to 1. Example mermaid git graph:

```mermaid
gitGraph
    commit
    commit
    branch develop
    checkout develop
    commit
    commit
    checkout main
    merge develop
    commit
    commit
```

or

```mermaid
sequenceDiagram
    Alice->>John: Hello John, how are you?
    John-->>Alice: Great!
    Alice-)John: See you later!
```

Mermaid related configuration via env-vars:

  • TM_MARKDOWN_MERMAID_SHOW_SEQUENCE_NUMBERS: true or false will (dis)allow sequence numbers on screen. (sequenceDiagram). Default value is false

Mathjax Support

Add TM_MARKDOWN_MATHJAX variable and set it to 1 for mathjax support. (TextMate > Preferences > Variables)

Example:

$ log\_232 = log\_22\^5 = 5 $

Strikethrough

You can strikethrough words.

You can ~~strikethrough~~ words.

Superscript

This is your 2^(nd) attempt.

This is your 2^(nd) attempt.

Underline

This is underlined but this is still italic

This is _underlined_ but this is still *italic*

Highlight

This is ==highlighted== text.

This is ==highlighted==

Quote

This is a "quote"

This is a "quote"

Footnotes

Click to jump footnote.1

Fenced Code Blocks

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html

Tables: Example 1

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |

Output:

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Tables: Example 2

| Name          | Description                 |
| ------------- | --------------------------- |
| Help          | ~~Display the~~ help window.|
| Close         | _Closes_ a window           |

Output:

Name Description
Help Display the help window.
Close Closes a window

Tables: Example 3

| Left-Aligned  | Center Aligned  | Right Aligned |
| :------------ |:---------------:| -------------:|
| col 3 is      | some wordy text |         $1600 |
| col 2 is      | centered        |           $12 |
| zebra stripes | are neat        |            $1 |

Output:

Left-Aligned Center Aligned Right Aligned
col 3 is some wordy text $1600
col 2 is centered $12
zebra stripes are neat $1

Change Log

2022-10-04

  • Add Mermaid renderer

2019-10-17

  • Add bumpversion support

2018-11-21

  • Update: Installation information, removed ruby version dependency

2018-11-02

  • Fix latest Safari update Version 12.0.1 (13606.2.104.1.2)
  • Version bump: 2.2.2

2018-10-18

  • Version bump: 2.2.1
  • Installation information update

2017-11-06

  • Version bump: 2.2.0
  • TM_GFM_LINK_FONT_WEIGHT and TM_GFM_LINK_TEXT_DECORATION environment variables are added.

2017-10-02

  • Update: t + ⇥ (3 spaces for nested list)
  • Fix: app.js remote image loading issue.

2017-09-29

  • Update: table + ⇥
  • Fix: README

2017-07-08

  • Ruby lib gfm.rb re-written from scratch!
  • Fixed: Live Preview!

2017-07-02

  • Removed: Pygments
  • New syntax highlighter: rouge
  • Updated to Ruby 2.4.0
  • Added: Front-Matter filter for Preview. Thanks to noniq for Markdown-Front-Matter
  • Added: Lots of Markdown Snippets!

2017-01-08

  • Fix: live preview.

2017-01-02

  • Fix: Broken footnotes due to base href.
  • New feature: Custom font-family via TM_GFM_FONT env-var.

2017-01-01

  • Support for relative image src: ![alt](picture.png "title") looks for picture.png in current folder.

2016-10-04

  • Fix zoom factor for TABLEs
  • Automatic refresh for Preview (comes with TextMate version 2.0-beta.12.21) when you save file.

2016-09-14

  • Added: Mathjax support.
  • Added more redcarpet features: Strikethrough, Superscript, Underline, Highlight, Quote, Footnotes. Please preview this readme file via bundle. GitHub doesn’t support some of the features (highlight, superscript, underline, footnote etc...)

2016-04-25

  • Added: TM_GFM_ZOOM_FACTOR for zoom options
  • Auto-save! If you open an existing file and hit preview, you don’t need to save!

2016-03-20

  • converted TM1 edition of this bundle to TM2
  • fixed: You don’t need to save before preview!

Contribute

PR’s are very welcome!

  1. fork (https://github.com/vigo/textmate2-gfm-preview/fork)
  2. Create your branch (git checkout -b my-features)
  3. commit yours (git commit -am 'added killer features')
  4. push your branch (git push origin my-features)
  5. Than create a new Pull Request!

Contributor(s)


License

This project is licensed under MIT.

Footnotes

  1. This is a footnote. 2

More Repositories

1

git-puf-noktalari

Günlük hayatta kullandığımız revizyon kontrol sistemi GIT ile ilgili küçük ipuçlarını anlatan yeni mini kitabım.
Ruby
425
star
2

kommit

Build your commit message without touching or editing your code!
Shell
204
star
3

ruby101-kitap

Türkçe Ruby kitabı
Ruby
197
star
4

dinozorus

1990'lı yıllara damgasını vuran efsane televizyon oyunu Dinozorus. Amiga 1200 - AGA
Assembly
134
star
5

turk-scene-tarihi

80'lerin ortasında başlayan, günümüz bilgisayar kültürünün neredeyse başlangıç noktası olan Türk SCENE/DEMOSCENE tarihçesi
85
star
6

lyk-2017

Linux Yaz Kampı 2017'de anlattığım konular.
41
star
7

django2-project-template

Django project/application starter for lazybones :)
Python
39
star
8

statoo

`statoo` is a super simple http GET tool for checking site health
Go
33
star
9

textmate-twitterbootstrap.tmbundle

TextMate bundle for Twitter's Bootstrap
HTML
33
star
10

awesome-c64

Commodore 64 related links such as C64 tools for Mac/Linux/PC, demoscene related stuff, coding tools, C64 utilities etc...
31
star
11

textmate-octopress.tmbundle

TextMate bundle for Octopress blog engine. http://octopress.org/
29
star
12

django-admin-list-filter

Dead simple autocompletion for Django admin `list_filter`.
Python
22
star
13

gh_issues

Manage GitHub issues from command-line (read only!)
Ruby
22
star
14

dotfiles-light

Just another but `lighter` version of BASH environment
Shell
20
star
15

dotfiles-universal

My old BASH dot-files... Try new one!
Shell
13
star
16

textmate2-python-fmt

Python FMT is a python linter/formatter/checker for TextMate.
Ruby
13
star
17

django-project-template

Project starter for Django 1.11.4 ... Batteries included :)
Python
9
star
18

textmate-hosts.tmbundle

TextMate bundle for /etc/hosts file
9
star
19

dotfiles-fever

Elegant BASH environment for macOS, Ubuntu and Gentoo
Shell
8
star
20

textmate-window-manager

Window manager/arranger for oldskool TextMate (1.5)
Shell
7
star
21

apm-bash-completion

Bash completion for Atom Package Manager (apm)
Shell
6
star
22

stormssh-completion

Bash competion for `sshstorm` (https://github.com/emre/storm)
Shell
6
star
23

devpod

Official website of devPod
HTML
6
star
24

textmate2-ruff-linter

Ruff linter for TextMate2. Linter and auto fixer for python!
Perl
5
star
25

ugur.ozyilmazel.com-v5

Kişisel websitem V4.0
HTML
5
star
26

lsvirtualenvs

Small commandline tool for `virtualenvwrapper`
Go
4
star
27

ghstars

Show GitHub stars count for user!
Go
4
star
28

git-init-githubrepo

Create git repository for GitHub style
Go
4
star
29

textmate2-tailwind-css

Tailwind CSS support for TextMate 2
Ruby
4
star
30

golang-notlarim

Golang geliştirme ile ilgili aldığım notlar
Ruby
4
star
31

git-tips

Git versiyon kontrol sistemi ile ilgili Türkçe dökümantasyon ve ipuçları
JavaScript
4
star
32

dox2008

2007-2008 yıllarında İstanbul Bilgi Üniversitesi, web departmanı için hazırladığım javascript ve html/css eğitimleri
JavaScript
4
star
33

textmate2-power-tools

Some useful TextMate2 snippets, commands etc...
Ruby
3
star
34

inspect-go

Ruby-ish Object#inspect tryouts for Golang!
Go
3
star
35

putio

Command-Line client for put.io platform (unofficial)
Go
3
star
36

textmate2-64tass-bundle

64tass Bundle for TextMate 2
2
star
37

sayisal_captcha

Çok basit şekilde iki basamaklı sayılardan random toplama ya da çarpma üreten bir sistem
Ruby
2
star
38

learning-stimulus-02

I'm learning stimulus, this is example 02
JavaScript
2
star
39

vigo

I'm a hustler baby!
2
star
40

textmate2-gomodifytags

TextMate2 implementation of Fatih’s gomodifytags
Shell
2
star
41

ruby101-kitap-kod

Ruby101 kitabında geçen kod örnekleri
2
star
42

els

Unix `ls` command alternative via Ruby :)
Ruby
2
star
43

pg16_django

3. Programlama Günleri / Karabük - Django ile tanışma
Python
2
star
44

vigo.io

Personal website
HTML
2
star
45

learning-stimulus-01

I'm learning stimulus, this is example 01
JavaScript
1
star
46

homebrew-git-init-githubrepo

brew tap for `git-init-githubrepo`
Ruby
1
star
47

textmate2-bootstrap3

Bootstrap 3's helpers for TextMate2
1
star
48

uptimerobot_cmd

Command-line client for Uptimerobot service
Ruby
1
star
49

stringutils-demo

A basic golang package for demo purpose only...
Go
1
star
50

textmate1-twitter-bs3.tmbundle

Twitter Bootstrap 3 bundle for TextMate1 (yes the oldest TextMate)
1
star
51

try_git

1
star
52

dji18njs

Modified and hardcore changed version of Django's i18n-javascript function. Can be usable as JavasScript Template engine. If you familiar with python's "format text" you will love this!
JavaScript
1
star
53

homebrew-lsvirtualenvs

brew tap for lsvirtualenvs
Ruby
1
star
54

amiga-ascii.tmbundle

Oldskool Amiga ascii/azki/nfo/diz support for TextMate with real Amiga fonts
1
star
55

vigo.github.com

My developer home page...
HTML
1
star
56

ugur.ozyilmazel.com

Kişisel web sitem
HTML
1
star
57

textmate-nanorc.tmbundle

.nanorc bundle for TextMate
Ruby
1
star
58

homebrew-statoo

brew tap repo for `statoo`
Ruby
1
star
59

my-custom-textmate1-bundle

Many snippets and my custom scratch-pad for TextMate1.
CSS
1
star
60

homebrew-ghstars

Brew tap for ghstars cli
Ruby
1
star