IT issues

If you have ever created a web-site or run your own server I am just about certain that you will have come across operating systems issues of some sort. My aim on this page is to document some of the recurring issues that I have come across. Right now, I am trying to get animated GIFs running in WordPress. I haven’t had much luck incorporating them into this site’s theme, but I have attached an animated GIF in this page to see how the server copes with animations.

Adding Animated GIFs to WordPress Headers

This took a while because the struggle with IT issues occurs on two fronts: first you have to figure out how to create animated GIFs; second you then have to figure out how to get such a GIF into WordPress. For now I will give the short answer and can go into more detail later, when I have time.

For creating the animated GIF you will need GIF creation software. I use Photoshop, but I am sure there are other packages about. An animated GIF can essentially be thought of as a stack of images that an image viewer will play through one after the other. So in Photoshop you need to create such a stack of images and then export the images as an animated GIF. There are lots of sites on the internet that know Photoshop better than I do and they will take you through the intricacies of Photoshop that you will need to get through to produce a GIF.

It’s the part after that that is the real focus here. After having created an animated GIF and being able to bring it up in a browser and image viewer, how do you get that into WordPress? This is where there are some traps for the newcomer to animated gifs in WordPress. The main trap is that after you have uploaded the GIF into your media library, you need to attach it to something in WordPress. My first attempt at this was to create an animated Header–and you should be able to see that at the top of this page. There are two things you need to watch out for. The first is the animated GIF must be under 2MB. The second is that you need to attach the GIF to a page or header without cropping the GIF. As soon as you crop the image, it seems that WordPress will copy the first image of the stack, crop that image and then attach that image to the page or header. That’s right, cropping animations in WordPress will destroy your animations.

So before you export your GIF out of Photoshop, or whatever package you are using, make sure it is already cropped to fit into the header or page that you want to use the GIF. In the theme I am using on this WordPress site, the recommended image size is 1260 x 240 pixels. I set the size of my animation to around 1260 x 340 pixels. I used the recommended width because otherwise the page list under the header doesn’t line up with the header and it makes the top of the page look odd. The height is larger than the recommended height and so when you go to attach the image to the Header WordPress will bring up an option to crop it to the recommended size. Yep, go ahead and SKIP over that step. If you follow the WordPress option and crop it, you end up with a picture not an animated GIF, and of course if you don’t know that you can spend hours (or days for me) trying to find where the problem is. In fact it’s not even obvious it’s a problem, because in my case I assumed that perhaps this was a limitation of the basic WordPress software and I started to believe that I needed some sort of bolt-on. But in fact that isn’t the case, WordPress will support animated GIFs, just be careful how you set it up.


Changing the Order of Pages in WordPress

So you’ve created a new page in WordPress and  you go to check the web-site and it looks good, but the order in which the pages appear in your home page is not what you were expecting. So you look around for the option that lets you change the order of the pages but can’t find it. Yep, catches me out every time. Why? Because if you don’t change the order of the pages very frequently then you forget where you do that, and it isn’t where you would expect—perhaps developers need to pay more attention to good old principles of useability.

So where is the option? In fact when you are creating the new page it’s over on the right hand side of the screen–if you look closely you will see fields for setting a page number and parent page. The page number is 0 by default and so the new page will always be at the start of the list unless you specify otherwise. And if you have forgotten to look there and only notice the problem after you check the results after you have created the new page, you won’t find any options for moving the page from its location. You need to go back and edit the page again–but since you didn’t see it there to start off with it isn’t obvious that you need to go back there; which is why I get caught out every time I create a new page.

Anyway, if anyone from WordPress ever sees this post, I have on my wish-list a WYSWYG interface that shows you the page order and allows the user to move the page location in a graphical way after the page has been created. I can see that without such an interface this will become an issue as the website grows and becomes more complicated.


Is it Possible to create a loop out of an MP4 ?

When I exported the GIF of this clip from Photoshop, it produces a low quality infinitely looping GIF that is around 2MB. However, if I create a GIFV of the same clip (see below) it is under 400Kb, that’s incredibly smaller. So the question is, is it possible to use the GIFV (a highly optimised MP4 clip) as the basis of looping a video?





Reading Squid Proxy Server log files

So you can see the directory for the squid log files, but you can’t get into that directory. That’s because it is not human readable. If you want to see what’s being logged then you need to run a program to do that. So you need one of those bits of gibberish that’s a Linux command line to do that for you:

sudo tail -f /var/log/squid/access.log | perl -p -e ‘s/^([0-9]*)/”[“.localtime($1).”]”/e’

(no CRs or anything) The tail command reads the file and pipes it to perl that then formats it. If you are lucky you can cut and paste the gibberish into a Linux terminal. Or if you are cleverer than I am at the moment, you can right a little script to tidy this up. Be aware though that the command as shown above only shows the source and destination as being the next router, so there is something more needed if you want to see the origins or destination to the internet.