포럼의 입력 형식 개선

lacovnk의 이미지

여러가지 포매팅을 지원하고, syntax highlight를 개선하고 있습니다. :)
답글로 의견 남겨주시면 적극 반영하도록 하겠습니다.

사용 모듈
Syntax highlight

<code lang=ruby>
puts “hello world”
</code>

puts "hello world"

위와 같이 언어를 명시해서 쓰시면 됩니다. 기본 값을 text로 해두었는데.. C로 해둬야할까요? :)

허용 HTML 태그
<p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param>
lacovnk의 이미지

from Textile sample

  • 일부 파싱 제대로 안됨 – 심지어 sample 사이트 조차!
    • 복잡한 테이블 처리 오류
    • 연속된 리스트가 붙어서 나오지 않는 오류

——

This is a title

This is a subhead

This is some text of dubious character. Isn’t the use of “quotes” just lazy writing — and theft of ‘intellectual property’ besides? I think the time has come to see a block quote.

This is a block quote. I’ll admit it’s not the most exciting block quote ever devised.

Simple list:

  1. one
  2. two
  3. three

Multi-level list:

  1. one
    1. aye
    2. bee
    3. see
  2. two
    1. x
    2. y
  3. three

Mixed list:

  • Point one
  • Point two
    1. Step 1
    2. Step 2
    3. Step 3
  • Point three
    • Sub point 1
    • Sub point 2

Well, that went well. How about we insert an old-fashioned hypertext link? Will the quote marks in the tags get messed up? No!

This is a link

this is a header
this is a row
this is another row

An image:

optional alt text

  1. Librarians rule
  2. Yes they do
  3. But you knew that

Some more text of dubious character. Here is a noisome string of CAPITAL letters. Here is something we want to emphasize.
That was a linebreak. And something to indicate strength. Of course I could use my own HTML tags if I felt like it.

Coding

This is some code, "isn’t it". Watch those quote marks! Now for some preformatted text:

	$text = str_replace("<p>%::%</p>","",$text);
	$text = str_replace("%::%</p>","",$text);
	$text = str_replace("%::%","",$text);

This isn’t code.

So you see, my friends:

  • The time is now
  • The time is not later
  • The time is not yesterday
  • We must act
lacovnk의 이미지

This is an H1

This is an H2

This is an H1

This is an H2

This is an H6

This is an H1

This is an H2

This is an H3

This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.

Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.

Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

This is the first level of quoting.

This is nested blockquote.

Back to the first level.

This is a header.

  1. This is the first list item.
  2. This is the second list item.

Here's some example code:

return shell_exec("echo $input | $markdown_script");
  • Red
  • Green
  • Blue

  • Red

  • Green
  • Blue

  • Red

  • Green
  • Blue
  1. Bird
  2. McHale
  3. Parish
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
  • Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

This is a normal paragraph:

This is a code block.

This is an example inline link.

Use the printf() function.

http://example.com/

script 태그 안의 내용
puts "hello world"
lacovnk의 이미지

from http://en.wikipedia.org/wiki/BBCode
bolded text
italicized text
underlined text
strikethrough text
strikethrough text
http://example.org
Example

Quote:
quoted text

monospaced text
Large Text
(The unit of measurement varies with each BBCode variant and could represent pixels, points, or relative HTML sizes.)
Red Text
or

Red Text
or
Red Text
(Both HTML color names and hexadecimal color values are generally supported, although on some boards, you must omit the # from selecting a hexidecimal color.)
:)

[:-)]
this would be another way to use the and must be pre-configured for the forum administrator

(And other emoticons, depending on the variant)

table data

puts "hello world"

권순선의 이미지

좋네요~

freezm7의 이미지

좋습니다. 좋아요~~~

즐겁게 살아 볼까나~*

neocoin의 이미지

바라던 기능이었습니다. 도움말이 없길래 혹시나 하고 [code=ruby][/code] 이런식의 테스트를 해보곤 했죠. :) 최근 제 개인적으로 써서 업그레이드한 MoinMoin도 pygment로 거의 모든 언어 지원을 하지 너무 편하더군요. 소스가 자주 붙는 이곳은 정말 유용하겠네요.

vim 도 잘되네요. :)

 "screen
 syntax enable
 se bg=dark
 se laststatus=2
 se statusline=\(%n\)%<%f\ %h%m%r%=0x%B\ \ \ \ %-14.(%l,%c%V%)\ %P
 se nowrap
 se nu
 se cursorline
 if has("gui_running")
   se paste      "This option have side effect for fuf plugin in terminal
   se cursorcolumn
 endif
 
khris의 이미지

Markdown 매우 환영~

$ yaourt -S gothick elegant

───────────────────────
yaourt -S gothick elegant
khris'log

khris의 이미지

이것이 어떻게든 잘보이기 위해 애쓰기 위한 코드고,

`Markdown` **매우** 환영~

<code lang="bash">
$ yaourt -S gothick elegant
</code>

* [khris'log]("http://khrislog.net/)
* [Naver English dictionary bookmarklet]("http://bitbucket.org/khris/naver-endic-bookmarklet/)

이 아래가 원래 의도하던 버전입니다

`Markdown` **매우** 환영~

    $ yaourt -S gothick elegant

[khris'log](http://khrislog.net/)  
[Naver English dictionary bookmarklet](http://bitbucket.org/khris/naver-endic-bookmarklet/)

("http://khrislog.net/) 를 보시면 일단 없어도 될 " 가 http 앞에 있고, Markdown 에서는 줄 뒤에 공백 두개를 붙이면 강제 줄바꿈(<br />)가 됩니다. 근데 소스보기를 해 보니 <br />이 삽입되지 않더군요. <br />을 직접 입력해도 줄바꿈이 되지 않았습니다. 그래서 일단 리스트로 대체했고요...

Markdown의 Codeblock문법(공백 4개 들여쓰기)으로 출력할시에는 <pre><code> ... </code></pre> 식으로 되는데 비해 GeSHi는 <code> ... </code> 구조라서 레이아웃에 약간 차이가 나네요.

다양한 마크업 방식 지원해주셔서 감사합니다.

───────────────────────
yaourt -S gothick elegant
khris'log
Naver English dictionary bookmarklet

───────────────────────
yaourt -S gothick elegant
khris'log

lacovnk의 이미지

피드백 감사합니다

밤이 늦어서 -_- 나중에 살펴보겠습니다.

참고로 drupal에서 input filter를 조합해서 사용하고 있습니다. markdown 경우, markdown 처리 후 HTML 코드를 filtering한 후, geSHi를 이용해서 syntax higlight를 추가합니다.일단 언급하신대로, codeblock 의 구조가 달라서 생긴 문제입니다. 제가 코드를 손 봐서 바꿀수도 있겠죠? 음 -_-

또한 markdown 구현의 오류인지, 다른 input filter의 영향인지도 불분명한 상태라, 좀 살펴봐야겠습니다

unsouled의 이미지

Markdown 과 Syntax Highlight 에서 궁금한 게 있는데, 혹시 Markdown 에서 코드를 작성할 때 그 코드가 작성된 언어를 남길 수 있는 Markdown 문법이 있나요?

    $ yaourt -S gothick elegant

에서 이 코드에 적용할 문법이 bash 인지 어떤 다른 언어인지 알려줄 수 있어야 geshi 쪽에서도 처리할 수 있을텐데요..

Markdown 과 Syntax Highlight 를 사용하는 제 개인 블로그에서는

    #! ruby
    puts "Hello, world!"

와 같이 코드 안에 "#! 언어 이름"과 같이 입력을 하면 <pre><code class="ruby">puts "Hello, world!"</code></pre> 식으로 Markdown 처리 후 별도의 작업을 하는 방식으로 쓰고 있는데..
Markdown 만으로는 이게 안 되는 건지 궁금합니다.

hongminhee의 이미지

Markdown 스펙에서는 구문 강조에 대한 부분은 전혀 다루지 않습니다. (당연하지만…)

홍민희 (VLAAH, LangDev)

unsouled의 이미지

Markdown에서 특정 Element 의 class 를 지정해 줄 수 있는 방법이 있을까 하고 물어본 건데..
Markdown은 HTML과는 다른 별개의 마크업 언어이지, HTML 템플릿 엔진이 아니니까 없다고 이상할 건 없겠군요.
잠시 착각했네요.

hongminhee의 이미지

Markdown을 지원해주시다니 너무너무 감사합니다! (게다가 Markdown Extra!)

홍민희 (VLAAH, LangDev)

dalmagi의 이미지

저, 관련된 내용은 아니지만,
제가 쓰는 오페라 미니에서 kldp가 엉망으로 깨져서 들어올 수가 없는데 이것 좀 해결해주실 수 있으신가요?
노키아 기본 브라우저에서도 깨집니다. 노키아는 웹킷 기반으로 알고 있는데 아이폰 쓰시는 분들은 괜찮으신가요?

화이팅(fighting) 말고 화이트닝(whitening) 하면 안되나요.