We have launched a new online shop:
Stunning Hair and Beauty. The website features hair products which can be purchased online. We worked with the client to come up with a design that would have the impression of a quality product.
The shop features online ordering and the ability in the admin to add / edit and remove products and details.
Already the shop has started to receive orders and we are working with the client on ways of increasing conversion rates.
We were looking for a way to integrate a facebook gallery into a clients website, so that they could update the gallery on there facebook page and that be transfered to the gallery on their own website.
The way of approaching this was by using the facebook graph api. This allows you to get information from a facebook page and into your own website.
The first thing to do is look at facebook's api page, which is here: http://developers.facebook.com/docs/reference/api/
You will need to login to facebook to be able to see the api page.
The next thing you need is the id of the gallery [theid], this can be found in the url of the gallery. There are a few numbers but the one that you want is normall after the "a." and the "." before the user id. If you copy that then use the following url:
https://graph.facebook.com/[theid]/photos
This should give you a list of the photos in an array. The trick is then to use the array in either JSON or php as below,
<?php
$jsonurl = "https://graph.facebook.com/[theid]/photos";
$json = file_get_contents($jsonurl,0,null,null);
$json_output = json_decode($json);
$json_output = json_decode($json, true);
echo '<pre>';
print_r($json_output);
echo '</pre>';
echo $json_output['data'][0]['images']['0']['source'];
?>
Or if you want to use javascript an example would be:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/
1.4.2/jquery.min.js"></script>
</head>
<body onLoad="fbFetch()">
<div>Loading...</div>
<script>
function fbFetch(){
//Set Url of JSON data from the facebook graph api. make sure callback is set with a '?'
to overcome the cross domain problems with JSON
var url = "https://graph.facebook.com/198234086888111/photos?limit=5&callback=?";
//Use jQuery getJSON method to fetch the data from the url and then create our unordered list
with the relevant data.
$.getJSON(url,function(json){
var html = "<ul>";
//loop through and within data array's retrieve the message variable.
$.each(json.data,function(i,fb){
html += "<li><img alt='"+ fb.from.name +"' height='" + fb.height + "' width='" +
fb.width + "' src='" + fb.picture + "'/></li><div style='clear:both;'> </div>";
});
html += "</ul>";
//A little animation once fetched
$('.facebookfeed').animate({opacity:0}, 500, function(){
$('.facebookfeed').html(html);
});
$('.facebookfeed').animate({opacity:1}, 500);
});
};
</script>
</body>
</html>
That's a quick guide to using images but you can use other things as well using the technique above but replacing the photos in the call url with other facebook calls such as:
feed |
The Page's wall |
No access token required |
An Array of Post objects |
picture |
The Page's profile picture |
No access token required |
Returns a HTTP 302 with the URL of the user's profile picture |
tagged |
The photos, videos, and posts in which the Page has been tagged |
No access token required |
An heterogeneous array of Photo, Video or Post objects |
links |
The Page's posted links |
No access token required |
An array of link objects |
photos |
The Page's uploaded photos |
No access token required |
An array of Photo objects |
groups |
Groups the Page belongs to |
No access token required |
An array containing group id, version, name and unread fields |
albums |
The photo albums the Page has uploaded |
No access token required |
An array of Album objects |
statuses |
The Page's status updates |
No access token required |
An array of Status message objects |
videos |
The videos the Page has uploaded |
No access token required |
An array of Video objects |
notes |
The Page's notes |
No access token required |
An array of Note objects |
posts |
The Page's own posts |
No access token required |
An array of Post objects |
events |
The events the Page is attending |
No access token required |
An array containing event id, name, start_time, end_time, location and rsvp_status |
checkins |
Checkins made by friends of the current session user |
Requires friends_checkins permissions |
An array of Checkin objects |
New packaging365 website has been launched, designed and developed by CJB Interactive. The online packaging shop sells a variety of boxes and packaging and includes a create your own boxes section in which custom sized boxes can be created and ordered online.
To view the
packaging shop.
The custom box creator works out the costings for the box that the customer creates and then allows the customer to order and buy the required amount of boxes online.
The shop was designed by CJB Interactive for the client using the fresh take on packaging concept as the starting point. A secure checkout is used to make ordering by the customer really easy and secure, giving the customer confidence in the shop and increasing orders taken. We are also working with Packaging365 to build the shop into a leading online packaging shop in the UK.
We also were involved in the Ebay and Amazon setup giving multiple selling channels and increasing awareness of the company.
For more information about our online shops and ecommerce projects please just contact us.
We have launched a new website, called Tej and co. Working with a designer we built the website using Wordpress CMS so that the client could edit and add to the website in an online admin.
The website is:
http://www.tejandco.co.uk/.
If you are looking for a website for your company or organisation then please contact us today and see what we can offer.
At CJB Interactive we have been building websites for all different businesses across many different sectors. We work with start-ups, to help launch their business and also more established companies, working with them to grow their online presence.
Our
web design services can make sales and help grow your business. Growing your business online makes use of the still growing number of people that are using the Internet to find products, services and organisations. Having the right impression and making sure you are found is an important part of business.
Using our knowledge of the web and social media, we work hard for your company building a website that performs brilliant and looks great.
If you would be interested in our service, then please contact us to start talking about how our web design, online marketing and online strategy services can be of use to you. We have many great stories of clients who have gone from a couple of enquiries on their website, to having the web as the most important lead and sales generating part of their business.
For more information view our
web design west midlands site.
More Articles
