search

urvanov-ru / crayon-syntax-highlighter

Syntax Highlighter supporting multiple languages, themes, fonts, highlighting from a URL, local file or post text.
https://wordpress.org/plugins/urvanov-syntax-highlighter/
GNU General Public License v3.0
60 stars 11 forks source link

Integration with WordPress page builder plugins #36

Open rieckpil opened 2 years ago

rieckpil commented 2 years ago

Thanks a lot for all your efforts in making the Crayon plugin work seamlessly with recent WordPress and PHP versions 💯

I don't have much experience with WordPress plugin development but wanted to ask what it would take to make the plugin work with other WordPress page builder plugins (Thrive Architect to be specific). Which scripts/resources would I have to include/enqueue for pages that are generated with a page builder? I don't need the widget for creating a new code snippet, adding the raw HTML via <pre>...</pre> would work for me if it then highlights the syntax correctly 👍

If you could lay out a possible integration on a high level, that'd be great 🙌🏻

urvanov-ru commented 2 years ago

Hi, @rieckpil I think, this files should be enough: wp-content/plugins/urvanov-syntax-highlighter/js/min/urvanov_syntax_highlighter.min.js wp-content/plugins/urvanov-syntax-highlighter/css/min/urvanov_syntax_highlighter.min.css wp-content/plugins/urvanov-syntax-highlighter/themes/classic/classic.css wp-content/plugins/urvanov-syntax-highlighter/fonts/monospace.css

rieckpil commented 2 years ago

Thanks for the quick response! Is there any queuing mechanism for WordPress to include the resource for the plugin that I should use or should I just manually ensure that those static files are part of each <head> section?

urvanov-ru commented 2 years ago

@rieckpil I recommend you use wp_enqueue_script and wp_enqueue_style

rieckpil commented 2 years ago

I've added those three stylesheets and one JavaScript to my custom page that is built with a page builder plugin (Thrive Apprentice):

grafik

and added the code snippet by hand with a <pre> element and a WordPress content widget to the page but still don't see the Highlighter plugin convert it to the correct format:

grafik
urvanov-ru commented 2 years ago

This is strange. Maybe there are some errors in Browser console? You can try to debug the script in urvanov_syntax_highlighter.min.js especially:

 $(document).ready(function () {
        UrvanovSyntaxHighlighterSyntax.init();
    });
urvanov-ru commented 2 years ago

Oh. I understand. There should be some code in PHP side.

urvanov-ru commented 2 years ago

It is not just Javascript highlighting. I was mistaken

rieckpil commented 2 years ago

What PHP code would I need to add to those pages?

urvanov-ru commented 2 years ago

In old Crayon there were possible to use it without any wordpress: https://github.com/aramk/crayon-syntax-highlighter/blob/master/util/external_use.php

In this forked version the code should be the same but with prefix UrvanovSyntaxHighlighter instead Crayon. You can try to adapt it. Unfortunately, I don't know how Thrive Architect works.

You can try to check "Capture pre tags as Crayons" settings. Maybe it works already? Maybe it just turned off? I don't sure about Thrive Architect or any other page builders. I don't know how it works.. But the highlighting works for comments and standard posts of any type with just pre tag.

Or it can be harder then we thought at the beginning

rieckpil commented 2 years ago

Thanks for laying out potential next steps. I'll give it a try.

btw. do you have a donation link for accepting USD or a PayPal account? The link on the WordPress plugin page is only for ₽/RUB.

urvanov-ru commented 2 years ago

You can try here: https://paypal.me/urvanov

rieckpil commented 2 years ago

I just tried to donate money but PayPal canceled the request with "The recipient can currently not receive money" 😓

urvanov-ru commented 2 years ago

lol

urvanov-ru commented 2 years ago

Maybe it is just some restrictions 'cause I am in Russia.

rieckpil commented 2 years ago

Okay, damn :/ Then I'll try it again in some weeks 👍