WordPress Keyboard Shortcuts Hacks.

I have been using WordPress for a while now, usually intermittently to write some posts and I also use Blogger. I do find some of the methods of altering basic text a bit of a pain, and am pretty disappointed with some of the Keyboard Shortcut s that are on offer:

 Display these keyboard shortcuts for WordPress. Shift+Alt+H 

I saw this video which I thought was great for uses for text expander, the WordPress area is about 13 1/2 minutes in:

And in the video he uses shortcodes in WordPress. He’s using the Shortcode Ultimate Add-in which I thought was a really useful tool and started to develop some in the text expander app I use which is aText. So I wrote a bunch of snippets for that to use with aText.

WordPress Shortcode Ultimate Plugin & aText Text expander

I found that the free Shortcode Ultimate Add-in Headers were awful, I presume to encourage you to purchase the Pro version, fair enough. So I cherry picked the shortcodes that I liked and was happy using them, but still was not happy with the headers.

An example of an aText shortcode :

\l    (this is Keyboard Shortcut) 
[su_list icon="icon: star" icon_color="#ffde0f"]
<ul>
 	<li><atext contenteditable="false" name="List 1" width="100" type="field" flags="4">✎List 1</atext></li>
 	<li><atext contenteditable="false" name="List 2" width="100" type="field" flags="4">✎List 2</atext></li>
 	<li><atext contenteditable="false" name="List 3" width="100" type="field" flags="4">✎List 3</atext></li>
</ul>
[/su_list][su_spacer]

I next started looking at some old WordPress videos where the classic editor allowed for Visual & Code editors , I’d sort of forgotten the code Editor in the new Guttenburg layout and when I looked at how to switch between the two I thought the process was quite painful. But when looking at headers I saw the code was quite simple, so I made an aText script to allow me to put in a header but it didn’t work. The reason being that it takes a long time for it to send the text to the screen if you are in visual Editor rather than in Code Editor. So what it types out is the string of what you sent. To be able to use this script in aText you’d need to somehow use the clipboard as I found, if you had the header text code in clipboard and pasted it into Visual Editor it worked without any problem.

Using AutoHotKeys instead of aText

I tried messing with aText but could not get the combination to work in that program so used AutoHotKeys instead and that worked fine. I added it to my general AHK script. But this had me coding in 2 places, so I wondered if I could but it back into aText. I then realised that I had AHK script in my pro version of aText, so could keep all the scripts in one place.

aText pro with AutoHotKey Scripting

I was so impressed with aText I bought the annual license for it (for $5US it allows you to put it onto 3 pc’s for a year- get from aText site not Microsoft store that only gives you one pc license for $5US) and one of the features of the pro version is that it will run code in batch, python, vba, and you can add custom programs, I added AHK to it so can use it through that method.

/3 (this is Keyboard Shortcut) 
InputBox, H3Title , H3 Header, Text for Title
clipboard =<!-- wp:heading {"level":3} --><h3 id="">%H3Title%</h3><!-- /wp:heading -->
Send, ^v
return

A later feature that I’m using at present in WordPress is colouring the background of headers, so have

/13  (this is Keyboard Shortcut) 
InputBox, H3Title , H3 Header, Text for Title
clipboard =<!-- wp:heading {"level":3,"backgroundColor":"luminous-vivid-amber"} --><h3 class="has-luminous-vivid-amber-background-color has-background" id="">%H3Title%</h3><!-- /wp:heading -->
Send, ^v
return

I also decided to remap the Keyboard Shortcut for getting into code editor from Visual editor in AutoHotKey using :

/m  (this is Keyboard Shortcut) 
send, ^+!m (^=Ctrl, +=Shift, !=Alt in ahk script)

So looking at the code editor I’m able to see what the code needs to look like, and as long as I put them all on one line then I can push it to clipboard and then paste it into the visual editor.

Images hard to do

Images need to be loaded from PC up to server and then they are cataloged in the database. Then you can use that URL to link to the image. I did try and make a Keyboard Shortcut that would upload an image but decided that was a bit complex.

Spans don’t seem to paste in visual editor but work in code editor

Another thing I found is was I highlighed the background of some text using the colour tools in the block column on the left and then went to code editor to copy that code for putting on a Keyboard Shortcut but it only made the text bold and the background colour did not come through. This is because the span tags were converted to strong tags when pasting into visual editor.

so not all things are simple

aText Case sentive settings need to be turned off for shortcodes

I was pasting in some shortcodes and when previewing some didn’t work. I found out that on inserting the code the first letter was changed to upper case then the shortcode didn’t work, so I have to change the section where the Keyboard Shortcuts for WordPress shortcodes were held to make sure that that section did not change the case on insert.

End Comment

Overall I’m pleased with the Keyboard Shortcuts for shortcodes and for AutoHotKey scripts. Whilst making the video I moved the AutoHotKey script into aText and that worked , then I found, in the settings, in advanced section that you could choose for snippet inserts to be pasted from clipboard. As soon as this was done I could keep all the code in aText without resorting to AutoHotKey.

Its still good to know that AutoHotKeys was able to give me a foothold to be able to do that process, then I could refine it inside aText.

I will have to find a more convenient key for deleting a line rather than Shift+Alt+Z, which is an awkward hotkey to use. I’ll think about it for a while.

Video of process