Asked Oct 5th, 2017 6:29 AM 303 1 1
  • 303 1 1
+1

[Viblo] Cho em hỏi viblo dùng markdown editor nào vậy ạ?

Share
  • 303 1 1

Cho phép em hỏi vi blo đang dùng markdown editor nào vậy ạ? làm sao để có thể thêm dc những tag mới như là:

  • Youtube embed {@youtube: Youtube ID or URL}
  • Vimeo embed {@vimeo: Vimeo ID or URL}
  • Slideshare embed {@slideshare: Slideshare ID or URL}
  • Google Slides embed {@googleslide: Public Google Slides URL}
  • Codepen embed {@codepen: Codepen ID or URL}
  • Gist embed {@gist: Gist ID or URL}

Rất mong mọi người giúp đỡ ạ. Em cảm ơn cả nhà nhiều lắm ạ!!!! :man_gesturing_ok_tone1:

Nguyen Quang Huy @quanghuy1294
Oct 5th, 2017 6:31 AM

anh @thangtd90 ơi có thể trả lời giúp em được ko ạ

0
| Reply
Share

1 ANSWERS


Answered Oct 5th, 2017 6:39 AM
Accepted
+7

Xin chào bạn.

VibloViblo thực hiện việc render Markdown bằng Javascript, sử dụng open source Remarkable. Bạn có thể check demo của Remarkable tại đây

Để có thể thêm các cú pháp đặc biệt, với mục đích support thêm rich contents, Viblo có sử dụng remarkable-embed

Hy vọng câu trả lời có thể giúp ích được cho bạn 😃

Share
Nguyen Quang Huy @quanghuy1294
Oct 5th, 2017 9:46 AM

Em cảm ơn @VibloTeam nhiều ạ

0
| Reply
Share
Nguyễn Minh Tuấn @minhtuancnttk39
Jun 22nd, 2018 4:01 PM

Em đã check và vẫn chưa biết cách install và conf sao cho render hiển thị được hết ạ.. Mong Viblo team giúp đỡ ạ.

0
| Reply
Share
Jun 23rd, 2018 1:46 AM

@minhtuancnttk39 Ý bạn là bạn chưa install, và sử dụng được được package Remarkable với remarkable-embed à? Cụ thể bạn đang gặp vướng mắc ở bước nào, và có lỗi gì nhỉ?

0
| Reply
Share
Nguyễn Minh Tuấn @minhtuancnttk39
Jun 23rd, 2018 1:23 PM

Dạ, khi e vào documentation của Remarkable thì hiển thị là import ...

import Remarkable from 'remarkable';
import { Plugin as Embed, extensions } from 'remarkable-embed';

const md = new Remarkable()

const embed = new Embed()
embed.register('youtube', extensions.youtube)

md.use(embed.hook)
md.render('This vid is gr8 m8 {@youtube: dQw4w9WgXcQ}')

// Output: '<p>This vid is gr8 m8 </p><iframe type="text/html" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0"></iframe>'

Như thế, mình phải code đoạn đó như thế nào ạ...

E chưa quen với những plugin như thế này...

Em cám ơn Viblo team

0
| Reply
Share
Jun 26th, 2018 8:16 AM

@minhtuancnttk39 À đoạn code trên là dùng cú pháp ES6 bạn ạ, xong bạn cần một công cụ bundler, ví dụ như webpack, hay gulp, để transform từ ES6 về ES5 để có thể chạy được trên các trình duyệt cũ hơn.

Viblo's Javascript SDK thì được viết bằng Typescript, xong cũng cần phải chạy webpack để transform codes.

Nếu bạn chưa quen với mấy khái niệm này thì có thể bắt đầu tìm hiểu bằng:

và còn rất nhiều các bài viết khác về các chủ đề này trên Viblo, bạn có thể tìm và tham khảo qua nhé 😉

+1
| Reply
Share
Huu Hung @huuhung96
Feb 13th, 2019 3:39 AM

@VibloTeam Có cách nào để có thể sử dụng Remarkableremarkable-embed trong ứng dụng rails không ạ ?

0
| Reply
Share
Feb 20th, 2019 2:53 AM

@huuhung96 Remarkableremarkable-embed thì đều là những package javascript thôi, nên bạn có thể dùng ở bất kỳ ứng dụng nào, PHP, Rails, hay Nodejs cũng được mà 😄

Có điều nó sẽ thực hiện việc render Markdown ở phía client (bằng Javascript), nên nếu bạn muốn render Markdown ở phía server (để tối ưu hoá cho SEO chẳng hạn), thì bạn cần làm cả Server Side Rendering nữa.

0
| Reply
Share