diff --git a/causality-admin.js b/causality-admin.js
new file mode 100644
index 0000000..789b50f
--- /dev/null
+++ b/causality-admin.js
@@ -0,0 +1,16 @@
+var causalityAddOverlayField = function(e) {
+	jQuery("#causality_overlay_fields").append("<div class='causality_overlay_field'><b>Title</b><input type='text' class='causality_overlay_title' value=''><b>URL</b><input type='text' class='causality_overlay_url' value=''></div><br>");
+	e.preventDefault();
+}
+
+jQuery("#causality_settings_form").submit(function(event) {
+	overlays = {};
+	jQuery.each(jQuery(".causality_overlay_field"), function(i, f) {
+		title = jQuery(this).find(".causality_overlay_title").val();
+		url = jQuery(this).find(".causality_overlay_url").val();
+		if (title && url) {
+			overlays[title] = url;
+		}
+	});
+	jQuery("#causality_overlays").val(JSON.stringify(overlays));
+});
\ No newline at end of file
diff --git a/causality.css b/causality.css
index abbc5f1..6e65b11 100644
--- a/causality.css
+++ b/causality.css
@@ -5,4 +5,7 @@
 .jcrop-holder div div .jcrop-tracker {
 	background-size: cover;
 }
+
+#causality_upload, .causality-button, #causality_output, #causality_jcrop_container {
+	display: none;
 }
\ No newline at end of file
diff --git a/causality.js b/causality.js
index 6a52881..4afe6c7 100644
--- a/causality.js
+++ b/causality.js
@@ -1,45 +1,87 @@
-var jcrop_api;
+var jcrop_api, causalityStyle;
+
+var causalityActivateUpload = function() {
+	jQuery("#causality_activate_upload, #causality_facebook_login").fadeOut(function() {jQuery("#causality_upload").fadeIn();});
+}
+
+var causalityInitFacebookSDK = function() {
+	jQuery.ajaxSetup({ cache: true });
+	jQuery.getScript('//connect.facebook.net/en_US/sdk.js', function() {
+		FB.init({
+			appId: causality_fb_app_id,
+			version: 'v2.7'
+		});
+	});
+}
+
+var causalityFacebookLogin = function() {
+	FB.getLoginStatus(function(response) {
+		if (response.status === 'connected') {
+			causalityGetFacebookPhoto();
+		} else {
+			FB.login(function() {
+				causalityGetFacebookPhoto();
+			});
+		}
+	});
+}
+
+var causalityGetFacebookPhoto = function() {
+	FB.api('/me/picture?width=960&height=960', function(response) {
+		if (response && !response.error) {
+			casualityInitCropInterface(response.data.url);
+		}
+	});
+}
 
 var casualityUploadHandler = function() {
-	input = this;
+	var input = this;
 	if (input.files && input.files[0]) {
+		causalityReadFile(input.files[0]);
 		casualityInitCropInterface(input.files[0]);
 	}
 };
 
-var casualityInitCropInterface = function(file) {
+var causalityReadFile = function(file) {
 	var reader = new FileReader();
-	reader.onload = function (e) {
-		var read = e.target.result;
-		profileImage = new Image();
-		profileImage.id = 'causality_jcrop_img';
-		profileImage.onload = function() {
-			jQuery("#causality_jcrop").append(profileImage);
-			console.log(jQuery(".entry-content").width());
-			jQuery("#causality_jcrop").Jcrop({aspectRatio: 1, trueSize: [profileImage.naturalWidth, profileImage.naturalHeight]}, function() {
-				jcrop_api = this;
-			});
-			var dim = jcrop_api.getBounds();
-			var x = 0, y = 0, x_ = dim[0], y_ = dim[1];
+	reader.onload = function(e) {
+		casualityInitCropInterface(e.target.result);
+	}
+	reader.readAsDataURL(file);
+};
+
+var casualityInitCropInterface = function(imagesrc) {
+	jQuery("#causality_facebook_login, #causality_activate_upload, #causality_upload").fadeOut(function(){jQuery("#causality_jcrop_container").fadeIn()});;
+	jQuery("#causality_jcrop_container").html('<div id="causality_jcrop"></div>');
+	profileImage = new Image();
+	profileImage.crossOrigin = "Anonymous";
+	profileImage.id = 'causality_jcrop_img';
+	profileImage.onload = function() {
+		jQuery("#causality_jcrop").html(profileImage);
+		jQuery(profileImage).width(jQuery(profileImage).width()); //Set the width to an explicit px based on current width (which should be max-width: 100%). This is required because jCrop computes the max-width wrong (ignores padding).
+		jQuery("#causality_jcrop").Jcrop({aspectRatio: 1, trueSize: [profileImage.naturalWidth, profileImage.naturalHeight]}, function() {
+			jcrop_api = this;
+		});
+		var dim = jcrop_api.getBounds();
+		var x = 0, y = 0, x_ = dim[0], y_ = dim[1];
 
-			var x_r = (x_ / 1) - y_;
-			var y_r = (y_ / 1) - x_;
+		var x_r = (x_ / 1) - y_;
+		var y_r = (y_ / 1) - x_;
 
-			if (x_r > 0) {
-			    x = x_r / 2;
-			}
-			if (y_r > 0) {
-			    y = y_r / 2;
-			}
+		if (x_r > 0) {
+		    x = x_r / 2;
+		}
+		if (y_r > 0) {
+		    y = y_r / 2;
+		}
 
-			jcrop_api.setSelect([x, y, dim[0], dim[1]]);
-		};
-		profileImage.src = read;
+		jcrop_api.setSelect([x, y, dim[0], dim[1]]);
+		jQuery("#causality_crop").fadeIn();
 	};
-	reader.readAsDataURL(file);	
+	profileImage.src = imagesrc;
 };
 
-var casualityCrop = function() {
+var causalityCrop = function() {
 	var selection = jcrop_api.tellSelect();
 	console.log(selection);
 	causalityRenderProfile(selection.x, selection.y, selection.w, selection.h, selection.x2, selection.y2);
@@ -56,10 +98,32 @@ var causalityRenderProfile = function(x, y, w, h, x2, y2) {
 		ctx.drawImage(profileImage, x, y, w, h, 0, 0, 960, 960);
 		ctx.drawImage(overlayImage, 0, 0, 960, 960);
 		data = canvas.toDataURL();
-		jQuery("#causality_output").html('<img src="' + data + '" width="500px" height="500px"/>');		
+		jQuery("#causality_output").html('<img src="' + data + '" width="500px" height="500px"/>');
+		jQuery("#causality_jcrop_container, #causality_crop").fadeOut(function() {jQuery("#causality_output, #causality_overlay").fadeIn();});;
 	};
 
 };
 
+var causalitySetOverlay = function(url) {
+	causality_overlay = url;
+	if (!causalityStyle) {
+		causalityStyle = document.createElement('style');
+		causalityStyle.type = 'text/css';
+		jQuery("head").append(causalityStyle);
+	}
+	jQuery(causalityStyle).html(".jcrop-holder div div .jcrop-tracker{background: url('" + causality_overlay + "');");
+	if (jQuery("#causality_output").html()) {
+		causalityCrop();
+	} else {
+		jQuery("#causality_overlay").fadeOut(function(){jQuery("#causality_facebook_login, #causality_activate_upload").fadeIn();});
+	}
+}
+
 jQuery('#causality_upload').change(casualityUploadHandler);
-jQuery("#causality_crop_button").click(casualityCrop);
+jQuery("#causality_crop").click(causalityCrop);
+jQuery("#causality_overlay").change(function() {
+	if (this.value) {
+		causalitySetOverlay(this.value);
+	}
+});
+causalityInitFacebookSDK();	
diff --git a/causality.php b/causality.php
index 8000e7e..e6e1683 100644
--- a/causality.php
+++ b/causality.php
@@ -39,9 +39,9 @@ function causality_settings_init() {
 	);
 
 	add_settings_field(
-		'causality_image_url',
-		'Campaign image URL',
-		'causality_settings_image_url_render',
+		'causality_fb_app_id',
+		'Facebook App ID',
+		'causality_settings_fb_app_id_render',
 		'causality_settings',
 		'causality_settings_section'
 	);
@@ -51,7 +51,11 @@ function causality_settings_init() {
 	);
 
 	register_setting(
-		'causality', 'causality_image_url'
+		'causality', 'causality_overlays'
+	);
+
+	register_setting(
+		'causality', 'causality_fb_app_id'
 	);
 }
 
@@ -64,21 +68,38 @@ function causality_settings_title_render() {
 	echo "<input type='text' name='causality_title' value='$setting' />"; // XSS ok.
 }
 
-function causality_settings_image_url_render() {
-	$setting = esc_attr( get_option( 'causality_image_url' ) );
-	echo "<input type='text' name='causality_image_url' value='$setting' />"; // XSS ok.
+function causality_settings_overlays_render() {
+	$setting = get_option( 'causality_overlays' );
+	echo "<input type='text' id='causality_overlays' name='causality_overlays' value='$setting' style='display: none;'/'>"; // XSS ok.
+	echo '<div id="causality_overlay_fields">';
+	if ( $overlays = json_decode( $setting, true ) ) {
+		foreach ( $overlays as $title => $url ) {
+			echo "<div class='causality_overlay_field'><b>Title</b><input type='text' class='causality_overlay_title' value='" . esc_attr( $title ) . "'><b>URL</b><input type='text' class='causality_overlay_url' value='" . esc_url( $url ) . "'></div><br>";
+		}
+	} else {
+		echo "<div class='causality_overlay_field'><b>Title</b><input type='text' class='causality_overlay_title' value=''><b>URL</b><input type='text' class='causality_overlay_url' value=''></div><br>";
+	}
+	echo '</div>';
+	echo '<button id="causality_add_overlay_field" onclick="causalityAddOverlayField(event)">Add more</button>';
+}
+
+function causality_settings_fb_app_id_render() {
+	$setting = esc_attr( get_option( 'causality_fb_app_id' ) );
+	echo "<input type='text' name='causality_fb_app_id' value='$setting' />"; // XSS ok.
 }
 
 /**
  * Settings page
  */
 function causality_settings_page() {
+	wp_enqueue_script( 'causality-admin', plugins_url( 'causality-admin.js', __FILE__ ), [ 'jquery' ] );
 	?>
 	<div class="wrap">
 		<h1>Causality settings</h1>
 		<form method="post" action="options.php" id="causality_settings_form">
 			<?php settings_fields( 'causality' ); ?>
 			<?php do_settings_sections( 'causality_settings' ); ?>
+			<?php causality_settings_overlays_render(); ?>
 			<?php submit_button(); ?>
 		</form>
 	</div>
@@ -106,13 +127,27 @@ function causality_shortcode( $attributes ) {
  * Render Causality
  */
 function causality_render() {
+	$overlays = json_decode( get_option( 'causality_overlays' ), true );
+	if ( ! ( $overlays ) ) {
+		return '<p>ERROR: No overlays configured</p>';
+	}
 	$html = '';
-	$html .= '<script>var causality_overlay = "' . esc_url( get_option( 'causality_image_url' ) ) . '";</script>';
-	$html .= "<style>.jcrop-holder div div .jcrop-tracker{background: url('" . esc_url( get_option( 'causality_image_url' ) ) . "');</style>";
+	$html .= '<script>';
+	$html .= 'var causality_overlays = "' . esc_js( get_option( 'causality_overlays' ) ) . '";';
+	$html .= 'var causality_fb_app_id = "' . esc_attr( get_option( 'causality_fb_app_id' ) ) . '";';
+	$html .= '</script>';
 	$html .= '<h3>' . esc_attr( get_option( 'causality_title' ) ) . '</h3>';
-	$html .= '<input type="file" id="causality_upload" value="Upload your profile photo" accept="image/*" />';
-	$html .= '<div id="causality_jcrop"></div>';
-	$html .= '<button id="causality_crop_button">Crop</button>';
+	$html .= '<select name="causality_overlay" id="causality_overlay">';
+	$html .= '<option title="Choose your overlay" value="">Choose your overlay</option>';
+	foreach ( $overlays as $title => $url ) {
+		$html .= '<option title="' . esc_attr( $title ) . '" value="' . esc_url( $url ) . '">' . esc_attr( $title ) . '</option>';
+	}
+	$html .= '</select><br>';
+	$html .= '<input type="file" id="causality_upload" value="Upload your profile photo" accept="image/*"/>';
+	$html .= '<button id="causality_activate_upload" onclick="causalityActivateUpload()" class="causality-button">Upload a photo</button>';
+	$html .= '<button id="causality_facebook_login" onclick="causalityFacebookLogin()" class="causality-button">Use my Facebook photo</button>';
+	$html .= '<div id="causality_jcrop_container"><div id="causality_jcrop"></div></div>';
+	$html .= '<button id="causality_crop" class="causality-button">Crop</button>';
 	$html .= '<canvas id="causality_canvas" style="display: none;" width="960px" height="960px"></canvas>';
 	$html .= '<div id="causality_output"></div>';
 	return $html;