Support » Plugin: Enlighter - Customizable Syntax Highlighter » Plugin seems to behave like preformatted on the same page

Plugin seems to behave like preformatted on the same page

  • aclassifier

    (@aclassifier)


    11 months ago

    I assume that I have not been able to install this plugin correctly?

    I am using Twenty Twelve.

    The example shows XC code, not C.

    My goal was to get full horisontal scroll, and line numbers.

    It looks like with my install of Enlighter, the <pre> and the <pre data-enlighter-language="c"> look the same. Or is it if <pre> comes after the <pre data-enlighter-language="c">?

    I am confused. I test with Safari on a Mac by making the window more and more narrow.

    I also see that a long — line would wrap. I don’t want that.

    Aside: Would it be better to install the 4.0 beta version and forget about this? I would only use it in this example and another example, so it would be easy to fix later on, should I stay with 3.00. I assume using a beta is even more work.

    • This topic was modified 11 months ago by aclassifier.
    • This topic was modified 11 months ago by aclassifier.
    • This topic was modified 11 months ago by aclassifier. Reason: Just trying to make my not taken!

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • aclassifier

    (@aclassifier)

    11 months ago

    I did severeal modifications to the original posting yesterday because I struggled with getting the “pre” type html not taken by the forum sw. I think labeling them as code worked: <pre>. But there is no preview here. But my question still remains.

    • This reply was modified 11 months ago by aclassifier. Reason: Labeling as code seems to always work
    Plugin Author Andi Dittrich

    (@andi-dittrich)

    11 months ago

    Dear @aclassifier,

    you didn’t use the Enlighter editing plugins (Gutenberg, TinyMCE, Shortcodes, Markdown) – instead you’re using plain html to highlight the code – this is strongly NOT RECOMMENDED within wordpress.

    in case you wan’t to use plain html (without any editor) you have to add the class “EnlighterJSRAW” to each codeblock or modify the selectors on the Enlighter settings page Enlighter -> Options -> Advanced.

    the additional class is used to avoid conflicts with existing pre/code tags on your site.

    aclassifier

    (@aclassifier)

    11 months ago

    Thanks!

    I am using the standard editor (aside:) since Gutenberg (when I tried it last some months ago) destroyed my references lists [1]

    So, with standard editor, do I install all of TinyMCE, Shortcodes, Markdown – or just one of them?

    The advanced option was set on “pre.EnlighterJSRAW”, but removing the “pre.” did not seem to make any changes(?) (Capital ‘J’ in there?)

    [1] https://www.teigfam.net/oyvind/home/publishing/061-wordpress/#gutenberg_editor

    Plugin Author Andi Dittrich

    (@andi-dittrich)

    11 months ago

    please read the docs howto use Enlighter with TinyMCE: https://github.com/EnlighterJS/Plugin.WordPress/blob/v3/docs/Usage_VisualEditor.md

    if you’re not familiar with css/js please leave the selectors to their default values

    aclassifier

    (@aclassifier)

    11 months ago

    Thanks! I will! I will come back here with the results and close the case then!

    aclassifier

    (@aclassifier)

    11 months ago

    Perfect! I now have your plugin up! I have updated at the original url in my initial post.

    But my whole point was to let long lines not wrap, and then do a horisontal scroll instead. How do I set this?

    Plugin Author Andi Dittrich

    (@andi-dittrich)

    11 months ago

    try one of the solutions posted in https://github.com/EnlighterJS/Plugin.WordPress/issues/31 or use Enlighter v4-beta1

    aclassifier

    (@aclassifier)

    11 months ago

    I tried to add that code in style.css (for my Twenty Twelve Child) (not styles.css):

    .EnlighterJS{
    width: auto !important;
    overflow-x: scroll !important;
    word-wrap: normal !important;
    }
    .EnlighterJS li{
    white-space: pre !important;
    }

    But I saw no change.. I also tried to empty buffers in Safari. Neither works in Chrome.

    Plugin Author Andi Dittrich

    (@andi-dittrich)

    11 months ago

    it mostly depends on your theme style/layout which variant works with EnlighterJS v2 (Enlighter v3).

    To avoid such issues EnlighterJS v3 (Enlighter v4) is re-created from scratch with build-in options

    aclassifier

    (@aclassifier)

    11 months ago

    Fair enough. I will install v4 when it’s not beta. The line numbers now to some degree help. I trie the other suggestions as well, none seemed to work for me. I like long lines, screens are not 80 chars any more..

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Plugin seems to behave like preformatted on the same page’ is closed to new replies.

Views