How to easily add custom code - # 4 Code Snippet

Without destroy your site

Συχνά ενώ διαβάζετε διάφορα άρθρα για Code Snippet στην σελίδα μας ή στο Google για το WordPress , μπορεί να σας ζητηθεί να προσθέσετε προσαρμοσμένο κώδικα στο αρχείο functions.php του θέματος σας ή σε ένα συγκεκριμένο σημείο στον ιστότοπο σας. Το πρόβλημα είναι ότι ακόμη και το παραμικρό λάθος μπορεί να καταστρέψει τον ιστότοπο σας – Code Snippet. Σε αυτό το άρθρο, θα σας δείξουμε έναν εύκολο τρόπο για να προσθέσετε προσαρμοσμένο κώδικα (Code Snippet) στο WordPress χωρίς να φοβάστε αν χαλάσει ο ιστότοπο σας.

Το πρόβλημα είναι ότι ακόμη και ένα μικρό λαθάκι στο προσαρμοσμένο κώδικα μπορεί να χαλάσει τον ιστότοπό σας στο WordPress και να τον κάνει απρόσιτο. – Code Snippet

The other problem is that if you add multiple pieces of code to an add-on for your site, then the file can become difficult to manage and get lost.- Code Snippet

Recently, while looking for a super solution, we discovered an easy and fast way for users to add and manage their code in WordPress.

Let's take a look at 4 of the best Plugins to insert code into your page.

• Code Snippets
• SyntaxHighlighter Evolved
• Enlighter
• Syntax Code Highlighter

1. Code Snippets

When you see a plugin called simply code snippet, there is a good chance you know what it does. Fortunately for all of us, it came to make our lives easier. One of the distinctive features of this plugin is that not only are the displayed lines of code formatted for easy reading and copying, it also comes with a custom code description field so you can easily track what each code does.

We appreciate that this plugin provides you with a complete list of all code snippets on your site (those created with this plugin, that is) so that any updates or modifications that need to be made are quick and easy without having to search and find which post or page contains it. This also allows you to use the same snippets in more than one location.

Price: FREE More information

2. SyntaxHighlighter Evolved

SyntaxHighlighter Evolved is easy to use and install. Basically, you can paste the code into the blank field and the plugin gets it from there. It will display the code fully highlighted and formatted for your readers. You can adjust various settings such as color, formatting in the add-on settings.

You can also click on the code snippet that appears and copy it for your own use. Also, when you click on the code block, it displays a plain text version of the code that makes it easy to copy and paste. The last thing a person looking for code needs is to have to reconfigure it and locate it themselves.

The add-in also runs various shortcode parameters, which means you just need to enter a shortcode into a post or page and then customize different elements in each snippet. It is as easy, fast and simple as most other Gutenberg custom blocks. But again the number # 1 for us is the code snippet but it is a second alternative.

Price: FREE More information

3. Enlighter

With the support of EnlighterJS, it gives you control over how code snippets appear on your site. A big advantage to this is how you can add code to your block bar. Most of the code snippet add-ons only allow block formatting. (edit via real Block Editor.) This feature helps a lot in the readability of your posts and your explanation of the code, as it makes it easier for you to include only part of a complete snippet within a specific line, function, or phrase.

Επιπλέον, αυτό είναι ένα από τα λίγα πρόσθετα που έχουν επισήμανση “γενικής γλώσσας”, πράγμα που σημαίνει ότι δεν θα εμφανίζεται απλά ως απλό κείμενο. Αυτό και μόνο κάνει το Enlighter που αξίζει να το ελέγξετε λόγω του πόσο ευανάγνωστο κάνει κάθε γραμμή κώδικα που τοποθετείτε στον ιστότοπο σας.

Price: FREE More information

4. Syntax Code Highlighter

Syntax Code Highlighter uses an editor to render code snippets on WordPress posts and pages. Going to Block Editor, you just need to paste the code you want to appear and place some of the settings on the right sidebar, using metabolic boxes and details. This makes it easy to highlight and identify the snippet of code that the user sees.

With this add-on, you do not have to rely on any predefined styles to color the highlighted snippets. While the add-on contains defaults, you can change the color setting of the code using CSS in a file included in the add-on. This level of customization is nice when your site has a specific aesthetic or you are focusing on a specific type of development. By using CSS to customize the displayed blocks of code, you can give the users who come to your site the best possible experience, both in terms of visibility and usability.

Price: FREE More information

We hope this article helped you understand the more plugins you need to easily add custom code to WordPress.