or Create a profile

Home → Questions →

Sublime Text 3 useful plugins for markdown editing

cksachdev's Avatar

cksachdev

03 Jan, 2015 06:52 PM

Could you please recommend some useful plugins for Sublime Text 3, to efficiently edit the markdown files.

1. Table Editor (Allows you to efficiently edit and format the text table)
2. For placing images?
3. Any plugin or theme to show bootstrap style warning/comments/suggestions classes? (in Marked 2 app)
4. Slider in markdown?

If there is a list present already, please share the link for the same. I am not able to find that in Knowledge Base.

  1. 1 Posted by cksachdev on 03 Jan, 2015 06:57 PM

    cksachdev's Avatar

    5. Place a youtube or vimeo video in markdown with feature to specify the start and end time and no video controls except play/pause. (Too specific to my needs)
    6. Place a soundcloud audio clip or any audio clip with playback controls.

  2. Support Staff 2 Posted by Brett on 03 Jan, 2015 06:59 PM

    Brett's Avatar

    For almost all of these there is no Markdown equivalent, but Markdown
    works with HTML snippets, so any embed code you have you can just drop
    into your Markdown file.

  3. 3 Posted by cksachdev on 03 Jan, 2015 07:04 PM

    cksachdev's Avatar

    There are certain jquery plugins, but to use those, I will need jquery to be included. Could you please elaborate on how I can achieve this? For Warning/Comments and Suggestions style, isn't this which can be done in CSS? I am new to markdown, so I am looking for a more elaborate answer on its limitations.

    Thanks for your quick responses.

  4. Support Staff 4 Posted by Brett on 03 Jan, 2015 07:31 PM

    Brett's Avatar

    jQuery is built into the Marked preview, but to use it in export you'll
    need to add a `<script>` tag, just like in any HTML file. And yes, you
    can achieve the warnings, comments, etc. with CSS, for which you'll need
    a custom style and the markup required by the CSS to signify the markers
    (using HTML).

  5. 5 Posted by cksachdev on 03 Jan, 2015 07:52 PM

    cksachdev's Avatar

    I tried embedding the embed tag from youtube by getting the embed code(This gave me iframe code) it shows the block but video player is not getting loading in marked 2 app. How I can inline play the youtube video in markdown?

  6. Support Staff 6 Posted by Brett on 03 Jan, 2015 09:11 PM

    Brett's Avatar

    If it's a standard youtube embed, you need to swap // in the url for
    https:// to get it to play outside of a web browser.

    -Brett

  7. 7 Posted by cksachdev on 04 Jan, 2015 02:18 PM

    cksachdev's Avatar

    Doesn't seem to work for me. Now I get a black box, but it doesn't shows up any youtube player controls.

    Here is the embed code copied from youtube:
    <iframe width="420" height="315" src="//www.youtube.com/embed/2E71CufIHN8" frameborder="0" allowfullscreen></iframe>

    In the markdown replaced // with https://
    <iframe width="420" height="315" src="https://www.youtube.com/embed/2E71CufIHN8" frameborder="0" allowfullscreen></iframe>

    In the generated markup in marked app, it looks as below:
    <p><iframe width="420" height="315" src="https://www.youtube.com/embed/2E71CufIHN8" frameborder="0" allowfullscreen></iframe></p>

    Could you provide an example on how I can use jQuery plugins inside my markdown.

    Thx in advance.

  8. 8 Posted by cksachdev on 04 Jan, 2015 03:03 PM

    cksachdev's Avatar

    To test the custom CSS styles, I have done the following in my markdown file:

    <html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js">
</head>
#Class 1

    


    <button type="submit" class="btn btn-info">Submit</button>

    Problem: My button, doesn't get the css from bootstrap. What I am doing wrong here?

    Question: I had to remove the body tag, otherwise the entire content was getting a dark background(code snippet theme). What am I doing wrong here? Can I include the jQuery plugins in a similar fashion? An example will help me get going.

    Thx

  9. Support Staff 9 Posted by Brett on 04 Jan, 2015 06:34 PM

    Brett's Avatar

    I'm sorry, but this is all well outside of both what Markdown is
    designed to do, and what I'm able to support.

    I can tell you that Marked is making its own body (and other container)
    tags, so you shouldn't include anything other than block-level tags in
    your document. Marked also overrides stylesheets in the document and
    uses what you have set up in the Style preferences, so custom styles
    should be added there.

    Your link to the bootstrap stylesheet is also a javascript file, so
    that's not going to work for you.

    I'm not certain what you want to do with jQuery in your file, but any
    jQuery you try to run is going to require accompanying markup, which
    Markdown isn't really good for creating.

    Marked _can_ open HTML files, so if you build out an entire page you can
    preview it and update it live, but it won't be rendering Markdown at
    that point.

    -Brett

  10. 10 Posted by cksachdev on 05 Jan, 2015 07:17 AM

    cksachdev's Avatar

    Thanks for your response. I looked at the MultiMarkDown syntax and it mentions that I can include external CSS file via CSS: metadata. So, I was trying to include that and then use the styles from bootstrap for alert, warning and other common classes for text formatting. e.g.

    Example of the successful alert box

    Thanks for identifying that its a javascript link :) I replaced it with a CSS, that didn't work. Then I included the CSS in the Custom CSS directory of Marked2app. but still I can't get the styles to work either in

    or

    .

    So, Marked2App doesn't support full MMD syntax? or I am doing this entirely wrong?

  11. 11 Posted by cksachdev on 05 Jan, 2015 07:18 AM

    cksachdev's Avatar

    Surprisingly the code worked in this comment section :) Pasting it here again, so how I can get this working in marked2 app??

    <div class="alert alert-success">Example of the successful alert box</div>

  12. Support Staff 12 Posted by Brett on 05 Jan, 2015 01:16 PM

    Brett's Avatar

    Marked 2 doesn't support external stylesheets, everything else is fully
    supported. You might try pasting the alert classes to the Additional CSS
    box under Style and then using a default theme as the base.

    -Brett

  13. 13 Posted by registration on 21 Nov, 2017 05:10 PM

    registration's Avatar

    The Sublime plugin "MarkdownEditing" was originally written by Brett, the author of Marked. That's a good starting point.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

  • New Issue

  • Conversation Started

    A conversation has been started with the Marked staff to resolve this discussion.

  • Close the discussion

Private Permissions

This discussion is private. Only you and Marked support staff can see and reply to it.

Public Permissions

This discussion is public. Everyone can see and reply to it.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac

Recent Discussions

25 Mar, 2025 03:35 PM Font size far too large when exporting
25 Mar, 2025 03:32 PM All should be well, but no custom pdf is produced
25 Mar, 2025 03:30 PM Scrivner preview does not work as of version 3.4
20 Mar, 2025 06:58 AM Crash on start-up
16 Mar, 2025 04:48 PM Marked 2 beachballing when selecting the "Additional CSS: Edit CSS" button in the Marked 2 preferences

Recent Articles

Intra-document links in exported PDFs
Using Ulysses with Marked
Fenced code blocks inside indented code blocks
Using JavaScript in Marked
Custom CSS: Writing custom CSS for Marked