Method 1: Using Elementor's HTML Widget
Open Elementor Editor: Edit the post or page where you want to add the code snippet.
Add HTML Widget: Drag and drop the HTML widget to the desired location.
Insert Code: In the HTML widget, use the <pre> and <code> tags to format your C# code. Here’s an example:
<pre><code class=”language-csharp”>
using System;
namespace HelloWorld
{
class Program
{
static void Main(string[] args)
{
Console.WriteLine(“Hello, World!”);
}
}
}
</code></pre>
It will display like below code:
using System;
namespace HelloWorld
{
class Program
{
static void Main(string[] args)
{
Console.WriteLine("Hello, World!");
}
}
}
Method 2: Using Free Visual Studio 2022
If you are reading this post, you may already have Visual Studio installed. If not, simply install Visual Studio 2022 Community Edition.
Many startups are unaware of the power of this mature coding platform, often mistaking it for a paid application. This may be due to the cross-platform version of Visual Studio Code.
Visual Studio 2022 is free and has all the functionalities required to build or rewrite any application, even Facebook, PayPal, Amazon, or even Android, without purchasing the paid version. The paid version is only needed to enhance some productivity features.
Once Visual Studio is installed ensure you add the “Productivity Power Tools 2022.” After adding, you need to restart Visual Studio 2022.
Next, add or open a file that has the code you want to display. Select the code block. Then select the menu “Edit” and “Copy HTML markup” from the top menu.
Finally, paste into your WordPress Elementor Text. Make sure to select “Text” instead of “Visual”.
using System; namespace PowerOfVisualStudio { class Program { static void Main(string[] args) { Console.WriteLine("Hello, Visual Studio 2022 !"); } } }
These methods should help you display your C# code snippets beautifully in your Elementor WordPress blog.