Adding Prism.js Code Highlighting to Hugo (or any other markdown based site)

Adding Prism.js Code Highlighting to Hugo (or any other markdown based site)

Friday, Apr 12, 2019
Adding a code highlighter is a really nice way to both show code on your site in a more decorative way, but also to make it easier for users to reproduce what you may be asking them to do. I recently (around February) rebuilt my Drupal site into Hugo and when migrating the content, one of the core things I wanted to do was get really nice highlighting of code, especially as I use my blog to remember things that I was doing 2, 3, 4, 5 years ago. ...

Read more
Starting Docker: Running NPM, Yarn, Composer and Wraith inside containers

Starting Docker: Running NPM, Yarn, Composer and Wraith inside containers

Wednesday, Dec 14, 2016
As we have already discussed Docker is a great way to isolate your environment and stop items from crashing into each other. Following on from my last post about running tools from inside a container, we looked at running stuff into your container. Now I am going to have some real life examples. I already expect that you know how to mount your files/directories into the container (-v) and how to assign your workdir (-w), so if you don’t have a look at the last post. ...

Read more
Dynamically Hide Tick Labels When Using Flot Chart Categories

Dynamically Hide Tick Labels When Using Flot Chart Categories

Tuesday, Mar 3, 2015
By default, Flot with the Flot categories plugin doesn’t allow for you to use the ticks or tickSize option to show less ticks when there are too many data points on the x-axis for all of the labels to fit. Our initial thought was to attempt to achieve this using a Ticks function inside the axis options. Unfortunately, this proved to be impossible due to the fact that the function appeared to run once for every tick on the axis, which would make it unworkable once we added the necessary computation. ...

Read more
Using CKEditor Styles in Drupal

Using CKEditor Styles in Drupal

Wednesday, Nov 12, 2014
For a recent project, we’ve been trying to find an easy way of allowing our client’s staff members to create and edit content using a WYSIWYG editor. However, they also wanted a fair degree of control over the layout of the content, without using any html editing. To achieve this, we decided to create a solution inside the WYSIWYG editor in order to keep the user interface as simple as possible. ...

Read more
Collapsible Fieldsets in Drupal 7 Nodes

Collapsible Fieldsets in Drupal 7 Nodes

Monday, Mar 12, 2012
After struggling with various adoptions for getting collapsible fieldsets to work within nodes for Drupal 7 I came across a final solution. Make adjustments to template.php (or in a module if you prefer): function THEMENAME_preprocess_html(&$variables){ // This function looks for node 1 and only adds the javascript for this. // However it can be extended in different ways if required if ($variables['node']['nid'] = 1){ drupal_add_js('misc/form.js'); drupal_add_js('misc/collapse.js'); } } In D7 you must also make sure that your legend contains a span with class fieldset-legend, and that your content is contained in a div with class fieldset-description, and that you include misc/form. ...

Read more
jQuery UI tabs inside a Drupal node

jQuery UI tabs inside a Drupal node

Monday, Mar 12, 2012
Following up on my previous post about collapsible fieldsets in drupal 7 nodes I recently wanted to just add some jQuery UI tabs to another node, and taking inspiration from my previous post about collapsible fieldsets in Drupal 7 nodes, made a little few edits to the template.php to achieve this as well. I actually made this to display vertical tabs from jquery ui, which is why the ui-tabs-vertical class has been added to the JavaScript, so if you don’t want that then just remove it. ...

Read more