I'm trying to keep track of some custom behaviour on our Facebook Canvas App. I need to send custom variables to Google Analytics but the fb:google-analytics tag is too limited.
Do you know a way of working around this?
I'm tracking the normal page view but I also need to track Ajax calls and custom variables.
Thanks,
Diogo
Ok, based on Denis suggestion but considering the fact we can't completely switch our App to run as an iFrame, we fixed the problem using 'invisible' iFrames in the beginning of the page.
The code is very similar to this:
<?php
$variable = $_GET[ 'var' ];
$value = $_GET[ 'value' ];
$slot = array_key_exists( 'slot', $_GET ) ? $_GET[ 'slot' ] : 1;
$level = array_key_exists( 'level', $_GET ) ? $_GET[ 'level' ] : 3;
if ( empty( $variable ) || empty( $value ) )
{
$variable = 'BadRequest';
$value = '1';
$slot = 1;
$level = 3;
}
assert( 'is_string( $variable )' );
assert( 'is_numeric( $slot )' );
assert( 'is_numeric( $level )' );
$customParamStr = "'$slot', '$variable', '$value', '$level'";
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Analytics Frame</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-X']);
_gaq.push(['_setCustomVar', <?php echo $customParamStr ?>]);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
</body>
</html>
And to use it, we add this iFrame to a canvas page using:
<iframe class="analyticsFrame" id="analyticsCode"
src="???/analyticsFrame.php?var=varname&value=valuename&slot=1&level=3" ?>" width="0px" height="0px" />
We still have to improve the code, for example, we could add support for multiple variables in the same iFrame...
I hope this helps someone and I hope we'll be able to switch totally to iFrame very soon :)
p.s. You can use this technique to run pretty much any javascript but keep in mind that, if you need it a lot, you should project switch completely to iFrame right now :)
Thanks for your help once more :)
Cheers,
Diogo
Related
A user accesses the Calculation.html first and enters two numbers following message. Then, select the operation from the drop-down box. When the user clicks the button, the web page displays the correct result by sending the data to the PHP file for evaluating the result. I have the PHP code here and whenever I run the code I keep getting an error.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Calculation Result</title>
</head>
<body>
<?php # handle_form.php
$num1 = $_REQUEST['number1'];
$num2 = $_REQUEST['number2'];
$operator = $_REQUEST['operator'];
if ($operator == 'add') {
echo $result = $num1+$num2;
}
esleif( $operator == 'subtract') {
echo $result = $num1-$num2;
}
esleif( $operator == 'multiply') {
echo $result = $num1*$num2;
}
esle( $operator == 'divide') {
echo $result = $num1/$num2;
}
echo "<p> The result is $result<p>";
?>
</body>
</html>
Is there a way! when click on facebook share button from post the image should be top of post title and description instead of left to on facebook share window.
i have tried this code as a Wordpress plugin
add_image_size('fb-preview', 190, 190, true);
// get image preview
function ST4_get_FB_image($post_ID){
$post_thumbnail_id = get_post_thumbnail_id( $post_ID );
if ($post_thumbnail_id){
$post_thumbnail_img = wp_get_attachment_image_src( $post_thumbnail_id, 'fb-preview');
return $post_thumbnail_img[0];
}
}
// get post description
function ST4_get_FB_description($post){
if ($post->post_excerpt){
return $post->post_excerpt;
} else {
// post excerpt is not set, we'll take first 55 words from post content
$excerpt_length = 55;
// clean post content
$text = str_replace("\r\n"," ", strip_tags(strip_shortcodes($post->post_content)));
$words = explode(' ', $text, $excerpt_length + 1);
if (count($words) > $excerpt_length) {
array_pop($words);
$excerpt = implode(' ', $words);
return $excerpt;
}
}
}
function ST4FB_header(){
global $post;
$post_featured_image = ST4_get_FB_image($post->ID);
$post_description = ST4_get_FB_description($post);
if ( (is_single()) AND ($post_featured_image) AND ($post_description) ){
?>
<link rel="image_src" href="<?php echo $post_featured_image; ?>" />
<meta name="title" content="<?php echo $post->post_title; ?>" />
<meta name="description" content="<?php echo $post_description; ?>" />
<?php
}
}
add_action('wp_head','ST4FB_header');
and facebook share button on post page.
ID)); ?>&t=post_title); ?>">Share on Facebook
i would suggest reading the facebook api docs and taking the mindset that they don't want you to mess with their stuff.
https://developers.facebook.com/docs/reference/dialogs/feed/
even without that mindset everything here suggests that you get no control over this, and if you do it is an undiscovered bug that fb would want to fix (and hence break whatever you find).
So im getting a blank page when loading this page within an iFrame on Internet explorer, every other browser works fine..
I have also tried using p3p headers as other people have suggested, but to no avail.
<?php
require ("connect.php");
require ("config.php");
require ("fb_config.php");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Login handler</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="css/login.css" type="text/css">
</head>
<body>
<?//=$user?>
<?php
if($user == 0) {
echo "You are not logged into facebook. Nice try.";
}else{
$query = "SELECT id,fb_id,login_ip,login_count,activated,sitestate FROM login WHERE fb_id='".mysql_real_escape_string($user)."'";
$result = mysql_query($query) or die(mysql_error());
$row = mysql_fetch_array($result);
if (mysql_num_rows($result) == 0) {
$sql = "INSERT INTO login SET id = '', fb_id ='" .mysql_real_escape_string($user). "', name = '" .rand(10000000000000000,99999999999999999999). "', signup =NOW() , password = '" .mysql_real_escape_string($pass). "', state = '0', mail = '" .mysql_real_escape_string($_POST['mail']). "',location='".mysql_real_escape_string($randomlocation)."',location_start='".mysql_real_escape_string($randomlocation)."', signup_ip='".mysql_real_escape_string($_SERVER['REMOTE_ADDR'])."',ref='".mysql_real_escape_string($_POST['ref'])."', activation_id = '" .mysql_real_escape_string($activation_link). "',activated='2', killprotection = '$twodayprot',gender='" .mysql_real_escape_string($_POST["gender"]). "'";
$res = mysql_query($sql);
}
//if($row['fb_id'] != $user){
//echo "Your facebook ID: $user is NOT in the MW DB.";
//exit();
//}else{
if(empty($row['login_ip'])){
$row['login_ip'] = $_SERVER['REMOTE_ADDR'];
}else{
$ip_information = explode("-", $row['login_ip']);
if (in_array($_SERVER['REMOTE_ADDR'], $ip_information)) {
$row['login_ip'] = $row['login_ip'];
}else{
$row['login_ip'] = $row['login_ip']."-".$_SERVER['REMOTE_ADDR'];
}
}
$update_login = mysql_query("UPDATE login SET login_count=login_count+'1' WHERE name='".mysql_real_escape_string($_POST['username'])."'")
or die(mysql_error());
$_SESSION['user_id'] = $row['id'];
$result = mysql_query("UPDATE login SET userip='".mysql_real_escape_string($_SERVER['REMOTE_ADDR'])."',login_ip='".mysql_real_escape_string($row['login_ip'])."',login_count='0' WHERE id='".mysql_real_escape_string($_SESSION['user_id'])."'")
or die(mysql_error());
if ($row['sitestate'] == 0){
header("location: home.php");
} elseif ($row['sitestate'] == 2) {
header("location: killed.php?id={$row['id']}&encrypted={$row['password']}");
} else {
header("location: banned.php?id={$row['id']}&encrypted={$row['password']}");
}
}// id check.
?>
</body>
</html>
You're probably missing p3p headers causing your browser not to accept cookies from Facebook on your site.
See http://www.hanselman.com/blog/TheImportanceOfP3PAndACompactPrivacyPolicy.aspx
or http://www.admon.org/how-to-implement-p3p-http-headers-for-cross-site-cookies/ for more information.
Try removing the line that references your external css file and see if your page loads?
I just solved a similar problem I had. I had the correct p3p headers set up and I narrowed the problem down to css.
The problematic css style was a position:relative; on the html,body element - removing this fixed the problem of Facebook showing my iframe as a blank page.
If removing all the CSS displays something on your page, then you may need to add your CSS step-by-step to find out the culprit as some other kind of css sytle may break the page.
I'm specifically talking about the IE embedded script language "PerlScript" from ActiveState.
I currently have the following, but when button 3 is pressed, no action happens.
<html>
<head>
<title>perlscript baby!</title>
</head>
<script language="perlscript" event="onload" for="window">
sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$b = $window->document->createElement('button');
$b->{value} = "button 3";
$b->{onclick} = "yawn()";
$window->alert("Button: " . $b->{outerHTML});
$window->document->body->appendChild($b);
}
sub enable
{
undef $window->document->all('buttn 2')->{disabled};
}
</script>
<body>
<input id='enabler' type='button' value='button 1' onclick='enable()'></input>
<input id='action' type='button' value='button 2' disabled onclick="createNew()"></input>
</body>
</html>
This is a very difficult thing to achieve, apparently. The browser (IE9 in my case) is expecting the value of the onclick attribute (when set from a script) to be a function reference rather than a string. We can prove this by converting your code into the equivalent JavaScript as shown below.
<script language="javascript">
function yawn()
{
window.alert("hi!");
}
function createNew()
{
b = window.document.createElement('button');
b.value = "button 3";
b.onclick = "yawn()";
window.alert("Button: " + b.outerHTML);
window.document.body.appendChild(b);
}
function enable()
{
window.document.getElementById("action").removeAttribute("disabled");
}
</script>
If we run this, the third button will appear, but clicking it will do nothing. We need to make only a minor adjustment to make this work in JavaScript.
function createNew()
{
// ...
b.onclick = function() { yawn(); };
// ...
}
Now, if we convert this back to the equivalent perlscript, we can see that it still doesn't work.
sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$b = $window->document->createElement('button');
$b->{value} = "button 3";
$b->{onclick} = sub { $window->yawn(); };
$window->alert("Button: " . $b->{outerHTML});
$window->document->body->appendChild($b);
}
sub enable
{
$window->document->getElementById("action")->removeAttribute("disabled");
}
In fact, it's a little bit worse because now, if you use your favourite HTML debugger to inspect the button 3 element, there is no onclick handler at all. So what can we do to get around this? Well, the answer is actually pretty simple - don't use PerlScript to create the elements dynamically, instead, create them statically and use PerlScript to hide and show them.
<html>
<head>
<title>perlscript baby!</title>
</head>
<script language="perlscript">
sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$window->document->getElementById('button3')->style->{display} = "inline";
}
sub enable
{
$window->document->getElementById("action")->removeAttribute('disabled');
}
</script>
<body>
<input id='enabler' type='button' value='button 1'
onclick='javascript:enable();' />
<input id='action' type='button' value='button 2' disabled
onclick='javascript:createNew();' />
<input id='button3' type='button' value='button 3' style='display:none;'
onclick='javascript:yawn();'/>
</body>
</html>
This seems to do the job nicely, although I'm not sure how well it will fit into your use case. There is of course, one massively weird thing in this code: the onclick handlers for each of the input elements explictly states that it is calling a JavaScript function. This is not true, obviously, as those functions are actually PerlScript subroutines. However, if you remove the javascript: prefix, then the handlers are never called. I think this just further highlights the browser's bias towards JavaScript.
Hope that helps!
I've been trying to use the JsPush Zend progress bar in a Zend MVC application, but have not been successful. I've used the JsPush.php example found on github to create a standalone progress bar test application, but this does not use the Zend MVC framework. When I apply the CSS, HTML, JavaScript, and PHP code from the JsPush example program, I see my progress bar appear (the CSS works) but I don't get any results during my socket write process. I've used the JsPush CSS code verbatim in a css file that is linked to my application so I won't repeat that here. Below are exerpts from my MVC application, the controller code:
protected function _sendFile($job)
{
$fp = fopen($job->source_file, "rb");
if($fp == null || $fileData['size'] == 0) {
$this->view->errorMessage = 'Error - file open failed for ' . $job->source_file;
return false;
}
$this->totalXmitSize = $fileSize;
$this->currentXmitSize = 0;
$progressMessage = '';
$adapter = new Zend_ProgressBar_Adapter_JsPush(array
('updateMethodName' => 'Zend_ProgressBar_Update',
'finishMethodName' => 'Zend_ProgressBar_Finish'));
$progressBar = new Zend_ProgressBar($adapter, 0, $this->totalXmitSize);
while(!feof($fp)) {
$blkSize = ($fileSize > 1024) ? 1024 : $fileSize;
$xmitBuf = fread($fp, $blkSize);
if($xmitBuf === false || !strlen($xmitBuf)) {
$this->view->errorMessage = 'Error - file open failed for ' . $job->source_file;
return false;
}
if($this->_writeData($xmitBuf, $blkSize) == false) {
return false;
}
$fileSize -= $blkSize;
$this->currentXmitSize += $blkSize;
$progress = $this->_calculateXmitProgress();
if($progress < 25) {
$progressMessage = 'Just beginning';
} elseif($progress < 50) {
$progressMessage = 'less than half done';
} elseif($progress < 75) {
$progressMessage = 'more than half done';
} else {
$progressMessage = 'almost done';
}
$progressBar->update($this->currentXmitSize, $progressMessage);
if($fileSize <= 0) {
break;
}
}
fclose($fp);
$xmitBuf = '';
$bufLen = 0;
if($this->_readData($xmitBuf, $bufLen) === false) {
return false;
}
$progressBar->finish();
if(strncmp($xmitBuf, MSG_STATUS_OK, strlen(MSG_STATUS_OK)) != 0) {
$this->view->errorMessage = 'Error - invalid response after file transfer complete';
return false;
}
return true;
}
The view code:
<?php
$this->title = "My Title";
$this->headTitle($this->title);
$this->layout()->bodyScripts = 'onload="startProgress();"';
?>
<p class="errors"> <?php echo $this->errorMessage ?> </p >
<?php echo $this->form->setAction($this->url());
?>
<div id="progressbar">
<div class="pg-progressbar">
<div class="pg-progress" id="pg-percent">
<div class="pg-progressstyle"></div>
<div class="pg-invertedtext" id="pg-text-1"></div>
</div>
<div class="pg-text" id="pg-text-2"></div>
</div>
</div>
<div id="progressBar"><div id="progressDone"></div></div>
The layout.phtml code:
function startProgress()
{
var iFrame = document.createElement('iframe');
document.getElementsByTagName('body')[0].appendChild(iFrame);
iFrame.src = 'MyController.php';
}
function Zend_ProgressBar_Update(data)
{
document.getElementById('pg-percent').style.width = data.percent + '%';
document.getElementById('pg-text-1').innerHTML = data.text;
document.getElementById('pg-text-2').innerHTML = data.text;
}
function Zend_ProgressBar_Finish()
{
document.getElementById('pg-percent').style.width = '100%';
document.getElementById('pg-text-1').innerHTML = 'done';
document.getElementById('pg-text-2').innerHTML = 'done';
}
</script>
</head>
<body <?php echo $this->layout()->bodyScripts ?>>
<div>
<h1><?php echo $this->escape($this->title); ?></h1>
<?php echo $this->layout()->content; ?>
</div>
When this runs I get a ton of JavaScript in the page source, but no progress results:
<script type="text/javascript">parent.Zend_ProgressBar_Update({"current":0,"max":3397,"percent":0,"timeTaken":0,"timeRemaining":null,"text":null});</script><br />
<script type="text/javascript">parent.Zend_ProgressBar_Update({"current":1024,"max":3397,"percent":30.14424492199,"timeTaken":0,"timeRemaining":0,"text":"less than half done"});</script><br />
<script type="text/javascript">parent.Zend_ProgressBar_Update({"current":2048,"max":3397,"percent":60.28848984398,"timeTaken":0,"timeRemaining":0,"text":"more than half done"});</script><br />
<script type="text/javascript">parent.Zend_ProgressBar_Update({"current":3072,"max":3397,"percent":90.43273476597,"timeTaken":0,"timeRemaining":0,"text":"almost done"});</script><br />
<script type="text/javascript">parent.Zend_ProgressBar_Update({"current":3397,"max":3397,"percent":100,"timeTaken":0,"timeRemaining":0,"text":"almost done"});</script><br />
<script type="text/javascript">parent.Zend_ProgressBar_Finish();</script><br />
All of this JavaScript pushes my form out of view. I have spent days on the Zend documentation site and scouring the web to find examples of someone successfully using Zend ProgressBar in a MVC framework application, but can not find any working examples. Thanks in advance for any help.
Well I have been successful in getting a JsPush progress bar to work to some degree, but not 100% correct for my application.
The progressbar works, but the form results end up in the hidden iframe. There is no way to get to the submit buttons on that iframe, so my user has to use the back button to get out of the form.
The only way to get the progress bar to work is to use the target attribute in the form and assign it to the name attribute of the iframe. If I don't use the target attribute, the form scrolls for every call to progressBar->update;. So my form results end up on the parent page several hundred lines scrolled down and the scroll bar never works.
I've tried using the example from the Zend documentation, but it doesn't work. This is my first venture into the Zend framework and it has been very frustrating and disappointing. Not a single response to my original question from 28 days ago.
I had same problem. For me it worked since I did the following steps.
Go to the php.ini and check if the following Data is set in your php.ini.
output_buffering = Off
;output_handler =
zlib.output_compression = Off
;zlib.output_handler =
Then go to class Zend_ProgressBar_Adapter_JsPush and find the Method - which is at the bottom - _outputData. Delete everything in this Method and input
// 1024 padding is required for Safari, while 256 padding is required
// for Internet Explorer. The <br /> is required so Safari actually
// executes the <script />
echo str_pad($data . '', 1024, ' ', STR_PAD_RIGHT) . "\n";
echo(str_repeat(' ',256));
if (ob_get_length()){
#ob_flush();
#flush();
#ob_end_flush();
}
#ob_start();