DOCSEARCHbyAlgolia
Submit Docs

markdown-pdf

repository·master·Indexed 25 days ago

https://github.com/alanshaw/markdown-pdf

A Node.js module and CLI tool that converts Markdown files to PDF. It works by converting Markdown to HTML (styled with HTML5 Boilerplate) and rendering the result using PhantomJS. It supports programmatic use via streams and a fluent API, as well as a command-line interface with options for paper format, orientation, custom CSS, and Remarkable parser configuration.

Tokens
6.3K
Snippets
10
Records
39
Agent score
83%

What's inside markdown-pdf

  1. Understand the HTML5 Boilerplate directory structure

    master

    A standard HTML5 Boilerplate project follows this directory layout:

    .
├── css
│   ├── main.css
│   └── normalize.css
├── doc
├── img
├── js
│   ├── main.js
│   ├── plugins.js
│   └── vendor
│       ├── jquery.min.js
│       └── modernizr.min.js
├── .htaccess
├── 404.html
├── apple-touch-icon-precomposed.png
├── index.html
├── humans.txt
├── robots.txt
├── crossdomain.xml
└── favicon.ico

  2. Set X-UA-Compatible for Internet Explorer

    master

    To ensure Internet Explorer uses its latest rendering engine (edge mode), include the following meta tag.

    Note: This line can break validation. It is recommended to remove this line from the HTML and instead use .htaccess or server-side configuration to send the X-UA-Compatible: IE=edge header.

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

  3. Run a local server for testing protocol-relative URLs

    master
    Because the project uses protocol-relative URLs (e.g., //cdn.example.com), viewing files directly from the local file system in a browser may cause the browser to attempt to fetch CDN files from your local machine, resulting in errors. To test pages correctly, use a local web server.

  4. Add News Feeds (RSS, Atom, Pingback)

    master

    You can link news feeds to your website using <link> elements in the HTML <head>.

    • RSS: Use rel="alternate" and type="application/rss+xml".
    • Atom: Use rel="alternate" and type="application/atom+xml".
    • Pingback: Use rel="pingback" to notify your server when other sites link to yours.

  5. Configure Social Network Metadata

    master

    Control how your content appears when shared on social platforms using Open Graph (Facebook) and Twitter Cards.

    Facebook Open Graph

    Use og: properties to define the title, description, and image for shared links.

    <!-- Facebook Open Graph -->
<meta property="og:title" content="">
<meta property="og:description" content="">
<meta property="og:image" content="">

<!-- Twitter Cards -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@site_account">
<meta name="twitter:creator" content="@individual_account">
<meta name="twitter:url" content="http://www.example.com/path/to/page.html">
<meta name="twitter:title" content="">
<meta name="twitter:description" content="">
<meta name="twitter:image" content="http://www.example.com/path/to/image.jpg">

  6. Configure DNS prefetching

    master

    DNS Prefetching informs the browser of domain names referenced on a site so it can resolve the DNS in advance, speeding up subsequent requests.

    Explicit Prefetches

    Use <link rel="dns-prefetch" href="//example.com"> to queue domains for prefetching, especially for resources outside your HTML (like CDNs or remote APIs). For best performance, place these immediately after your <meta charset> element in the <head>.

    Disable Implicit Prefetching

    Browsers automatically prefetch domains found in anchor tags. To disable this behavior, use:

    WARNING: Disabling this may slow down your site if you rely on foreign domains.

    <!-- Explicit prefetch example -->
<link rel="dns-prefetch" href="//example.com">
<link rel="dns-prefetch" href="//ajax.googleapis.com">

<!-- Disable implicit prefetching -->
<meta http-equiv="x-dns-prefetch-control" content="off">

  7. Implement Modernizr for feature detection

    master

    Modernizr is a JavaScript library that adds classes to the html element based on feature test results, allowing you to target CSS and JavaScript based on browser support.

    Critical Loading Requirement: The Modernizr script must be loaded synchronously at the top of the document (before the browser begins rendering) to ensure browsers lacking HTML5 support can handle elements properly. Other JavaScript files should generally be loaded at the end of the page to minimize impact on load times.

  9. Prevent Skype from formatting phone numbers

    master

    If the Skype browser extension is causing phone numbers to appear oversized or highlighted, you can use the following CSS to disable Skype's automatic formatting:

    span.skype_pnh_container {
    display: none !important;
}

span.skype_pnh_print_container {
    display: inline !important;
}

  10. Install Chrome Web Store apps and iOS Smart App Banners

    master

    Enable direct app installation or unobtrusive app promotion using specific meta and link tags.

    • Chrome Web Store: Use rel="chrome-webstore-item" to allow users to install apps directly from your site.
    • iOS Smart App Banners: Use the apple-itunes-app meta tag to allow users to download or open your iOS app without intrusive modals.

  11. Configure Search Engine behavior

    master

    Control how search engines interact with your site using HTML meta and link tags.

    • Sitemaps: Direct search spiders to your XML sitemap.
    • Indexing: Hide specific pages (like 'Contact Us') from being indexed by search engines.
    • Search Plugins: Provide an XML file to enable browser-based search for your site.