Posts Tagged ‘Website’

< Older Entries


Displaying your latest statuses from Twitter February 6th, 2013

After a couple of years at IE I’ve moved on to pastures new and started work as a technical consultant at Farringdon based tech agency Amido. This move has allowed me to finally return to the LAMP stack after a two year absence and it feels good. In celebration of that here’s a little PHP something.

Latest Tweets from @scriptic

Amazing long weekend in Bude, sun, sea and sand!
May 06, 2013

Mouse Taxidermy! The new @WeAreAmido London office mascot. http://t.co/GNnOxPMTxG
May 03, 2013

Feeling pretty virtuous after first cycle commute into central London this morning. Hope my legs are up to the return journey.
May 01, 2013

So at some point between me implementing my new theme and a couple of weeks ago the Twitter feed on this site stopped working. After a little investigation I discovered that Twitter have changed the way their APIs work so I had to rebuild the functionality in my theme. Now with version 1.1 of the Twitter API it’s nice and easy, as long as you use OAUTH, to embed tweets on your page ready formatted with all the bells and whistles in place. It looks great but I guess not everyone, including me, wants that – so, after some very brief research garnered no results in regards to returning just a block of HTML for the status rather than the whole widget, I decided to cobble something together myself. A process which I shall share with you now.

First off, I didn’t do all this alone – I used the very handy tmhOAuth library by Matt Harris to take care of the authentication stuff, so you’ll need to grab that before we begin (it’s also included in this handy download of all the code you see here ready to go). While we’re on the subject you’ll also need to do all the Twitter application prep work before this’ll work. You can learn about that here.

So once you’ve got all that sorted we need to write some code. First off you need to call the Twitter API and grab your JSON object using ‘user_timeline’. The two variables in the request are your Twitter username and count, which is the number of tweets you wish to return.

<?php
	// Require files from the OAuth library
	require 'tmhOAuth.php';
	require 'tmhUtilities.php';
	function getTweets(){
            //OAuth
            $tmhOAuth = new tmhOAuth(array(
                'consumer_key'    => 'YOUR CONSUMER KEY',
                'consumer_secret' => 'YOUR CONSUMER SECRET',
                'user_token'      => 'YOUR USER TOKEN',
                'user_secret'     => 'YOUR USER SECRET',
            ));
            // Request
             $code = $tmhOAuth->request('GET', $tmhOAuth->url('1.1/statuses/user_timeline'), array('screen_name' => 'username', 'count' => 3));
            $response = json_decode($tmhOAuth->response['response']);
	}
?>

So that’ll return a handy JSON object with everything you need to retrieve your Twitter stream, now if you want to just embed Twitters beautiful widgets you can grab the status ID from that object and use oembed but all I want is the tweet text and the date. Fortunately both of these are included in the object and can be extracted like so:

<?php
	foreach($response as $obj){
            echo $obj->text . '<br />';
            echo $obj->created_at . '<br /><br />';
	}
<?

All good, except you’ll notice that all you have is a couple of raw text strings, for my purposes I’d like the time stamp to be a little simpler and obviously I’d like all the hash-tags, mentions and links to be in-tact and working. So date first – we can just write a little function to extract and re-order the bits you want.

<?php
	echo formatdate($obj->created_at);
	function formatdate($date){
            $dateseg = explode(' ', $date);
            return $dateseg[1] . ' ' . $dateseg[2] . ', ' . $dateseg[5];
	}
?>

This just explodes the date string into separate elements and then reorders it into a nice simple ‘Jan 09, 2013’ type format. When that’s done we need to tackle the more complicated task of ensuring all the links come out intact. Fortunately that JSON object we retreived earlier contains all the information you need to do that – each hash-tag, mention and link has it’s own little array containing display text, shortened link and full link – so all we need to do is scan through our tweet and do some text replacing:

<?php
	echo formattweet($obj->entities->urls, $obj->entities->user_mentions, $obj->entities->hashtags, $obj->text);
	function formattweet($links, $mentions, $hashtags, $tweet){
            $buildtweet = $tweet;
            foreach($links as $link){
                $buildtweet = str_replace($link->url, '<a href="' . $link->url . '" target="_blank">' . $link->display_url . '</a>', $buildtweet);
            }
            foreach($mentions as $mention){
                $buildtweet = str_replace($mention->screen_name, '<a href="http://twitter.com/' . $mention->screen_name . '" target="_blank">' . $mention->screen_name . '</a>', $buildtweet);
            }
            foreach($hashtags as $hashtag){
                $buildtweet = str_replace($hashtag->text, '<a href="http://twitter.com/search?q=%23' . $hashtag->text . '&amp;src=hash" target="_blank">' . $hashtag->text . '</a>', $buildtweet);
            }
 
            return $buildtweet;
	}
?>

And now we have a nice simple block of HTML containing your tweet which you can embed and display any way you like. Which is exactly what I’ve done at the top of this post and, when I get around to it, on the sidebar of this theme. If you happen to know that there’s a much simpler, ready made, way of achieving this then please let me know so I can take this post down and save myself some embarrassment.

Thanks all!

Tags: , , , , , , , , , , ,
Posted in Dynamic content, HTML, PHP, Web | No Comments »


Wedpings! February 18th, 2012

screenshot of our wedpings wedding page

www.wedpings.com/siandkasia

Sorry for the gap, and no Christmas post – a terrible state of affairs. Never mind though, here’s something to cheer you up – it’s our wedding page. The first entry on wedpings.com. A little side project for me which I intend to turn into a sort of social network for wedding planning. There’s not much there at the moment, as you’ll see if you visit the home page, but the intention is to start adding features soon. User accounts, wedding list organisation and RSVPs, photo galleries, venue information and maps – that sort of thing. To be honest I haven’t really spec’d it out yet but hopefully i’ll get round to it eventually. Drop me an email if you’d be interested in using such a service :) .

For now our page is just a bit of HTML and jQuery with a simple RSVP form – it just sends us an email with a yes or no. Nothing fancy but I was quite pleased with the design. Hopefully in a few months there’ll be a new Wedpings post announcing a proper site. We’ll see.

To the happy couple!

Tags: , , , , , ,
Posted in Design, HTML, Javascript, jQuery, Web, Website | No Comments »


Website Roundup February 18th, 2011

screenshot of the Asteral web site

www.asteral.com | www.london-bathrooms.co.uk

Not much to report this month i’m afraid, it’s far too early in the year for anything exciting. Plus our central heatings been on the blink since before Christmas and I find it hard to motivate myself when i’m freezing cold. Work wise i’m not doing anything postable sadly due to the nature of the new job – although I’m currently working on my first mobile web app so hopefully i’ll be able to put up a link to that at some point.

Anyway – with that in mind i’m posting a couple of sites i’ve worked on that have gone live recently. The first one is the Asteral web site which i completed just before I left The Crocodile and which, for some reason, has only recently gone live.

The Asteral site is built in Expression Engine and incorporates 3 levels of navigation, which was quite tricky to acheive. It also utilises the indispensible Freeform plugin to incorporate a contact form and newsletter sign-up.

screenshot of the London Bathrooms web site

The second site is a smaller site I designed and built for a London based Bathroom company (called, fittingly, London bathrooms). I also created the London Bathrooms logo, which featured in a recent post.

This is a fairly standard small site with information about the company, some work samples and testimonials and a contact form. Which you should definately use if you need a Bathroom fitted in London (or the surrounding area).

Since spring is already in the air I’m hoping the next post will be a total break from the norm and be about the landscaping of my garden which I started last year and which ground to a halt over winter. Not just a one trick pony!

Anyway, it’s been a pleasure as always.

Tags: , , , , , ,
Posted in CMS, Design, Dynamic content, Expression Engine, Forms, HTML, Web, Website | No Comments »


New Year, New theme January 7th, 2011

Happy New Year loyal readers (cough). Here’s a short post to introduce Scriptic’s new (and my first) custom theme. I hope you like it. I haven’t tested it in IE6 yet – if Google are allowed to stop supporting it then so am I – but if you’re visiting in that particular browser then, for a start, you’ll be seeing some nasty PNG issues. Upgrade for god’s sake. What’s the matter with you? Other browsers, however, are tried and tested – so you shouldn’t see any issues.

There are, i’ve already noticed, some aesthetic issues with a few of my previous posts now i’ve upgraded so i’ll be going through them and sorting them out slowly over the next few weeks as well as checking that everything else looks and works as it should. If you notice anything while browsing please let me know.

The end :) bye for now!

p.s. This theme is pretty bespoke but if you want the files then just let me know.

Tags: , , , , , ,
Posted in CMS, Design, HTML, Website, WordPress | No Comments »


London Bathrooms logo December 7th, 2010

Here’s something a little bit different – a logo I designed for my brothers bathroom fitting service. Some time ago (presumably before the birth of Scriptic as it’s not on here) I created a website for the company but it was branded with the Landricombe and Son logo. Recently he decided he wanted a seperate logo for London bathrooms to differentiate the companies a bit more – so here it is. I’m quite pleased with it – I made those bubbles myself :)

London Bathrooms logo

Magnificent isn’t it? It’s certainly a huge improvement on the intermediary one which you might be priviledged enough to see, if you visit the site, before it’s binned forever when this new one goes live.

Tags: , , , , , ,
Posted in Design, HTML, image, Web, Website | No Comments »


< Older Entries