Tag Archives: Github

Insert Gists without JavaScript

Leave a reply

If you would like to insert Github’s Gists into your blog posts or pages but don’t want the overhead or potential security implications of loading some JavaScript from a third party then it is relatively straight forward to get around.

Here is a gist I have created just for this post – https://gist.github.com/tosbourn/4949176

And here is the JavaScript file I am meant to include;

<script src=”https://gist.github.com/tosbourn/4949176.js”></script>

But instead of including it, lets visit the JavaScript file at https://gist.github.com/tosbourn/4949176.js

Well, well, well! Looks like it is just some Document.Writes, those guys are pretty easy to work with, so lets copy the entire thing and paste it into a text editor.

Once in the text editor we need to run a find and replace on a three things;

  1. Find any reference of \n and remove it.
  2. Find any reference of \ and remove it.
  3. Find any double spaces and remove them.

Then just remove the document.write(' and '); from the start and end of the two lines.

You are left with something like this;

<link href="https://gist.github.com/assets/embed-0af287a4b5c981db301049e56f06e5d3.css" media="screen" rel="stylesheet" />
<div id="gist4949176"><div><div><div><table cellpadding="0" cellspacing="0"><tr><td><span id="file-gistfile1-txt-L1" rel="file-gistfile1-txt-L1">1</span><span id="file-gistfile1-txt-L2" rel="file-gistfile1-txt-L2">2</span><span id="file-gistfile1-txt-L3" rel="file-gistfile1-txt-L3">3</span></td><td><pre><div id="file-gistfile1-txt-LC1">Here is my Gist!</div><div id="file-gistfile1-txt-LC2">Look at it!</div><div id="file-gistfile1-txt-LC3">Gisting all over the place</div></pre></td></tr></table></div></div><div><a href="https://gist.github.com/tosbourn/4949176/raw/678465ea9db744f03fa7628745942fae281d1123/gistfile1.txt" style="float:right">view raw</a><a href="https://gist.github.com/tosbourn/4949176#file-gistfile1-txt" style="float:right; margin-right:10px; color:#666;">gistfile1.txt</a><a href="https://gist.github.com/tosbourn/4949176">This Gist</a> brought to you by <a href="http://github.com">GitHub</a>.</div></div></div>

Now we are almost there, we could include this on our page and no JavaScript would run, but we do still need to go across to Github to grab the CSS file and of course there will be a slight performance hit with that, so lets go on over to https://gist.github.com/assets/embed-0af287a4b5c981db301049e56f06e5d3.css and grab the CSS.

Now we simply replace the first line of our code from the link element to a style block and include the CSS, now all that is left is to copy and paste this code from our text editor into our website.

Here is the result sans external calls;

123
Here is my Gist!
Look at it!
Gisting all over the place
view rawgistfile1.txtThis Gist brought to you by GitHub.

I think it works well and you can’t deny the performance benefits.

You can also make this process a bit smoother by requesting the .json or .txt versions of the Gist, in our example change .js to either .json or .txt, like so: https://gist.github.com/tosbourn/4949176.txt

Thanks so much to PunKeel for suggesting the .json or .txt variants.

Share this on

I have added Buffer to my no-js social shares

Leave a reply

I am a massive fan of Buffer for sharing and scheduling social media updates, if you haven’t tried it before you really should, it is free and takes seconds to set up.

Today on Twitter I asked @bufferapp if they had a way you can send updates to your stream without requiring JavaScript and they got back to me really quickly explaining you could.

I am glad they do, it means I can add in Buffer as a social share button down at the bottom of this post and in my github repository.

Here is the code to achieve it if you were wondering and didn’t want to check out my code.

<a href="http://bufferapp.com/add?text=Tosbourn&url=http://tosbourn.com">Buffer</a>

Share this on

If you store WordPress code on Github think about your wp-config.php

Leave a reply

If you store WordPress code on Github inside of a public repository all your code is public. Most people know and accept this, but people either don’t realise that their database credentials get stored inside the php file wp-config.php or they do and forget to exclude it from their repository.

This means that if you do a simple Google search for site:github.com master/wp_config.php password blob DB_PASSWORD you will find a whole rake of folk with their passwords on display.

Obviously it is impossible to tell if they are just sample details or real details, but it is still crumby practice and if you do it you really need to stop now.

I will be contacting people I find to let them know, but please pass this message on to any WordPress/GitHub users you know.

Share this on

Git branches seem to be case insensitive

Leave a reply

Git branches appear to be case insensitive, which isn’t a problem in and of itself, but if you clone a remote branch from github like this:

git checkout -b my_new_branch /origin/My_New_Branch

Git will see your new branch as my_new_branch* and when you pull it will check origin/My_New_Branch which is totally correct and sane, but if you do a push it seems to want to push to a new branch in github called my_new_branch which will get super confusing if multiple people need to access this branch.

The ideal fix for this is prevention – just don’t create a new local branch with a different name to your remote branch, but let’s say you do?

Creating a new branch with the correct case will not work because git is case insensitive and will see both my_new_branch and My_New_Branch as the same thing, instead you need to rename your current branch using a middle step. Luckily like most things in git this is very straightforward;

git branch -m my_new_branch tmp_branch (will rename your lowercase branch to tmp_branch)

git branch -m tmp_branch My_New_Branch (will rename to your desired CamelCase branch!)

Now your pushes should go to the correct branch.

*Disclaimer – My_New_Branch is a terrible name for a branch, always be descriptive and imagine you are naming it for someone else who doesn’t know the project to read.

Share this on

PHP – Turn UK Date into US Date

23 Replies

This is something I find myself needing to do quite frequently. You deal with UK dates as input and output of a system but somewhere in the middle they need to convert to US dates.

A quick way to shove a UK Date into a US format is to to an explode on the UK date by whichever separator it is using (normally ‘/’, sometimes ‘-’) then glue the bits back together with the second element swapped with the first (moving month and day around).

I have compiled this into a quick method:

/**
* A very simple function to change the date from the UK
* format to the American format.
*
* @param string $uk_date Assumed to be in the format day month year
* @param string $separator_input What divides the date up goung in.
* @param string $sepatator_output What divides the date up going out.
*
* @return string The date formatted to suit the US formatting.
*
* @author Toby Osbourn 
*/

function makeUSDate($uk_date, $separator_input = '/', $sepatator_output = '/')
{
    list($day, $month, $year) = explode($separator_input, $uk_date);
    return $month.$sepatator_output.$day.$sepatator_output.$year;
}

This is also part of my Useful PHP Functions file on Github.

Share this on