Well, that didn’t last long. I thought SyntaxHighlighter and Copy Code to Clipboard were great plugins for my Blog, but then I found Code Block Pro.
This plugin has so many features it is crazy. It is built on top of Visual Studio Code and handles every language and file type that VS Code can handle, and there are so many themes and features available, even in the free version.
One feature that my previous choices didn’t have without quite a bit of messing around was showing/hiding line numbers. I never liked that line numbers appeared on Powershell or Bash blocks. Now, it is just a single click away. Another great feature is the ability to blur out code and highlight specific areas to draw the reader’s eye to what is important – fantastic.
Here are a few examples of what it can look like: –
apiVersion: v1
kind: PersistentVolumeClaim
metadata:
name: pvc-homarr-icons
spec:
accessModes:
- ReadWriteOnce
storageClassName: longhorn
resources:
requests:
storage: 1Gi
apiVersion: v1
kind: PersistentVolumeClaim
metadata:
name: pvc-homarr-icons
spec:
accessModes:
- ReadWriteOnce
storageClassName: longhorn
resources:
requests:
storage: 1Gi
apiVersion: v1
kind: PersistentVolumeClaim
metadata:
name: pvc-homarr-icons
spec:
accessModes:
- ReadWriteOnce
storageClassName: longhorn
resources:
requests:
storage: 1Gi
apiVersion: v1
kind: PersistentVolumeClaim
metadata:
name: pvc-homarr-icons
spec:
accessModes:
- ReadWriteOnce
storageClassName: longhorn
resources:
requests:
storage: 1Gi
Another great feature is that the code widget remembers the latest settings you used and applies them automatically the next time you add a block – that is, it uses the sensible settings from the previous block – it doesn’t remember the previous settings regarding highlighting lines which is a very nice quality of life feature. This makes adding new sections much quicker than before.
One thing I didn’t realise at first is that the Dark Plus theme is almost identical to the theme I use inside Visual Studio and Visual Studio Code, so the code looks the same on the site, too.
Unlike my previous code blocks editor, the code looks the same when editing it in the WordPress admin site, too. Previously, the code was black text on a white background, which meant finding a block was a little more work when editing a post.
The toolbar that appears when you are editing a block has shortcuts to the block settings, which makes it much easier to navigate to the right areas to make changes.
All in all, it is a very nice addition to the site.