WordPress: Show source code - how it works
Source code can only be displayed in a detour in a WordPress. Here we explain how it works.
WordPress blog: Show source code - how it works
Wordpress already provides the option to display source code.
- As a rule, you cannot display source code such as HTML snippets directly or only poorly in a blog post, since the code is read directly.
- You can avoid this in Wordpress by enclosing the code with the [code] [/ code] tag.
- You have to specify the code language. For CSS, for example: [Code language = "css"] [/ code].
- WordPress can display the following languages directly: actionscript3, bash, clojure, coldfusion, cpp, csharp, css, delphi, erlang, fsharp, diff, groovy, html, javascript, java, javafx, matlab (keywords only), objc, perl, php, text, powershell, python, r, ruby, scala, sql, vb and xml.
- It looks completely like this: [Code language = "css"] Your CSS code could be here [/ code]
Valid source code for display in Wordpress
You can also change the code tags using various parameters.
- autolinks = "true" (true or false): links in the source code can be clicked. If you do not set this parameter, it is automatically activated (true).
- collapse = "false" (true or false): The source code must be clicked so that it is visible. The default is "false".
- firstline = "1" (numerical values): Here you define the number with which the line numbering of the code block should begin. It usually starts at 1.
- gutter = "true" (true or false): This allows you to completely hide the line numbering (false). By default it is activated (true).
- highlight = "2, 5, 7" (separate numerical values with comma): With this you can highlight individual lines of code.
- htmlscript = "false" (true or false): This will highlight any HTML / XML code. This is useful if you mix different languages such as HTML and PHP. The option is deactivated by default.
- light = "false" (true or false): This activates the "light" variant of the code block. This will hide line numbering and other functions. This is useful if you want to display little code. The function is normally not activated.
- padlinenumbers = "true" (true, false or numerical values): This defines the distance values of the code block. Usually these are regulated automatically (true), but you can also deactivate the distances (false) or enter any numerical value.
- title = "Code block title" (text input): Here you define a name for the code block. This is especially helpful when you use collapse to hide it. Simply enter any title.
Next, we will explain how you can integrate WordPress social media plugins and how you can activate a "Like" button in particular.