Just paid for Standard Upgrade, but print and html export not formatted...

Jeff Diamond's Avatar

Jeff Diamond

19 Sep, 2018 03:34 PM

I bought this software to create nice looking versions of markdown files to convert to html and pdfs. I chose this software based on the appearance of the Preview Pane - I particularly liked the GitHub format. But upon upgrading the program, I found that both html export and print did NOT produce versions anything like the Preview, as if the CSS stylesheet was missing. I looked at the preferences and searched online and cannot find any options to reflect the Preview style in the print or html style - I would have expected WYSIWYG output, as if I were doing a screen shot of the preview.

I'm attaching two screen shots. The first is how the document looks in Preview (the output I expect for print and html), and the second is how it looks when exported to html - print is no better.

Is something wrong with my installation? Clearly, users would expect both print and html export to look nice. Any help would be appreciated. Thank you.

  1. Support Staff 1 Posted by Fletcher on 19 Sep, 2018 03:39 PM

    Fletcher's Avatar

    Jeff,

    Thanks for the purchase!

    Do you have the preferences set to include the preview CSS when
    exporting? (Advanced Preferences)

    Otherwise, the export you get is whatever is specified in the document
    (which can include a CSS file reference in the `css` metadata:

    https://fletcher.github.io/MultiMarkdown-6/syntax/metadata.html#css

    Let me know if that doesn't solve your issue:

    Fletcher

  2. Support Staff 2 Posted by Fletcher on 26 Sep, 2018 01:28 PM

    Fletcher's Avatar

    Jeff,

    Just checking back in to make sure your problem was resolved.

    Thanks,

    Fletcher

  3. 3 Posted by Jeff Diamond on 26 Sep, 2018 01:36 PM

    Jeff Diamond's Avatar

    Thanks so much, Fletcher.  I appreciate the awesome customer support -
    always a mark of a great company.

    I am now able to get good html out, but I'm having issues with the print
    quality.  Do you have advice on how I could make alterations like
    increasing the font size?  Could I look at one of the CSS files and
    modify it?

    Sorry for being a newbie at this, but I'm greatful your product exists.
    - Jeff

  4. Support Staff 4 Posted by Fletcher on 26 Sep, 2018 01:57 PM

    Fletcher's Avatar

    Do you really mean "print quality"? (As in the text looks pixelated, or images come out distorted, etc.) Or do you mean that the styling does not match what you would like it to be? (e.g. is this a technical problem, or an artistic issue?) The rest of your question makes it sound more like an "artistic" issue...

    Assuming that is true, then yes -- you can do whatever you want with CSS. Composer is not intended to limit you to certain presets. It is designed to produce well formatted HTML (assuming proper input) so that you can use whatever CSS you like to style your document.

    The Preview preferences includes a button to take you directly to the CSS folder. I recommend copying one of the files that is close to what you want, and then making (and testing) incremental changes (to the copy) to get the results that you desire. Some of the examples by Brett Terpstra (e.g. Github and Pretentious) have some useful example sections for inspiration.

    If all you want is to change the size of the entire document you can modify the body section font (like in Github).

    Obviously CSS can be a complicated (but powerful) tool, but there is a ton of useful introductory information on the internet about it to help you get started.

    If in fact there is still a technical issue with Composer causing problems, let me know some more details and I can try to fix it.

    F-

  5. 5 Posted by Jeff Diamond on 26 Sep, 2018 02:04 PM

    Jeff Diamond's Avatar

    Thanks again for the fast response, Fletcher.  Yes - you are correct -
    it's an artistic (formatting) issue.  I'll check out the CSS's.
    - Jeff

  6. Support Staff 6 Posted by Fletcher on 26 Sep, 2018 02:09 PM

    Fletcher's Avatar

    PS> There is nothing special about CSS for Composer. Any CSS file you find on the internet will work, though you may have to adjust it to get the results you desire.

    The only thing special that I do is add some code to format CriticMarkup sections (e.g. <del>, <ins>, etc. You can find this in Basic.css and add it to any other file if you desire.

    I have adjusted this CSS to improve printing functionality (it will be included in Composer 4.5). The new version is below, just in case.

    del {
      background:#fae6e6;
      -webkit-print-color-adjust: exact;
    }
    ins {
      background:#ecfce6 !important;
      -webkit-print-color-adjust: exact;
    }
    span.critic.comment {
        color:#0000bb;
    }
    span.critic.comment::before {
        content:"{>>";
    }
    span.critic.comment::after {
        content:"<<}}";
    }
    mark {
        -webkit-print-color-adjust: exact;
    }
    
  7. 7 Posted by Jeff Diamond on 26 Sep, 2018 02:12 PM

    Jeff Diamond's Avatar

    Great!  I'm sadly no expert in html programming, but I'll give it my
    best. :)

  8. Support Staff 8 Posted by Fletcher on 26 Sep, 2018 03:31 PM

    Fletcher's Avatar

    When I taught myself, what helped me was to start simply (e.g. change
    the base font/size, margins, paragraph spacing.) Then I started digging
    into the more complex things.

    Sadly, it's a bit harder to look at example CSS on "corporate" sites
    these days (the CSS gets hidden inside javascript calls and other
    craziness). So you might be better off looking at older or smaller
    sites for examples.

    My site exposes CSS:

    http://fletcherpenney.net/css/main.css

    That leads you to three separate files, but the primary one is:

    http://fletcherpenney.net/css/less.css

    Maybe some of that can help offer some pointers.

    F-

  9. 9 Posted by Jeff Diamond on 26 Sep, 2018 04:01 PM

    Jeff Diamond's Avatar

    Wonderful. :) Thanks for the tips.
    - Jeff

    --
      Jeff Diamond
      [email blocked]

  10. Fletcher closed this discussion on 13 Oct, 2018 04:34 PM.

Comments are currently closed for this discussion. You can start a new one.

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