Page 1 of 2

Create static web page from dynamic content for sharing

Posted: Wed Jan 16, 2013 8:54 pm
by barb woolums
Not sure where to ask this question, but thought javascript/jquery would be a good place to start.

I have a dynamic page that displays a recipe that is in a logged in area and is database driven.

I would like to be able to give the user the option to share the recipe on facebook. I can't share the dynamic page for obvious reasons, but thought there might be a way of creating a static page using the generated html on the existing page, that could then be shared.

Anyone have any idea as to how I could achieve this?

Re: Create static web page from dynamic content for sharing

Posted: Wed Jan 16, 2013 9:19 pm
by requinix
I take it you mean you can't share the "dynamic page" because it only shows the recipe to a logged-in user? If the recipe is saved for one individual then you can simply mark it as public/private, and a public recipe doesn't require a log in. If the recipe is global and any logged-in user can see it then you can create a special user/recipe pair (like in a separate table) which indicates that user X made recipe Y public: as long as the share link includes those two pieces of information then the visitor can see the recipe. You'd probably want to log accesses too in case the link goes "viral" and suddenly everyone on the Internet is getting it without having to sign up.

Re: Create static web page from dynamic content for sharing

Posted: Wed Jan 16, 2013 9:48 pm
by barb woolums
Sounds good thanks a lot.

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 12:27 am
by barb woolums
I've mostly got this implemented, but my facebook link ends up being the url for the page the share link is on instead of the link I have defined.

my link url has parameters in it, can I do this.

I am testing on localhost would this be an issue?

link code

Code: Select all

<script>function fbs_click() {var id=$("#id").val();$.post("public_recipe.php",{id:id});u=location.href;t=document.title;window.open("http://www.facebook.com/sharer.php?u="+encodeURIComponent(u)+"&t="+encodeURIComponent(t),"sharer","toolbar=0,status=0,width=626,height=436");return false;}</script><style> html .fb_share_link { padding:2px 5px 0 20px; height:16px; float:right; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; margin-top: 9px; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=http://localhost/wrm/display.php?public=yes&client=wrm&id='.$id.'" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a><img id=help title="Page Help" src="images/small_help.png">

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 12:42 am
by requinix
There's two URLs in there you have to change. You got the one in the <A> link but not the one mentioned in the Javascript (the u variable).

Also, you can't use localhost for the link. I assume the URL is being generated automatically and thus will have the right hostname when the page goes on your real site?

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 1:01 am
by barb woolums
Thanks link is working now, but not the title.

New Code

<script>function fbs_click() {var id=$("#id").val();$.post("public_recipe.php",{id:id});u="http://localhost/wrm/display.php?public ... ="+id;t="A Recipe From Web Recipe Manager";window.open("http://www.facebook.com/sharer.php?u="+ ... height=436");return false;}</script><style> html .fb_share_link { padding:2px 5px 0 20px; height:16px; float:right; background:url(http://static.ak.facebook.com/images/sh ... if?6:26981) no-repeat top left; margin-top: 9px; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=htt ... .$id.'&t=A Recipe From Web Recipe Manager" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a><img id=help title="Page Help" src="images/small_help.png">

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 2:52 am
by requinix
It should be URL-encoded in the link like

Code: Select all

t=A+Recipe+From+Web+Recipe+Manager
but as it is now it should still work.

Speaking of, there's another issue: the URL you give needs to be URL-encoded itself in the link too. Those &s in yours will conflict with Facebook's share.php script.
And taking a closer look it seems like you're trying to mix PHP and Javascript? Or is all that being outputted from PHP?

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 3:24 am
by barb woolums
Yeah it's all generated by php

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 2:52 pm
by requinix
Well, your PHP apparently has the $id so I don't know why there's

Code: Select all

var id=$("#id").val();
Assuming that's just a copy/paste job and its value is identical to $id I would

Code: Select all

<?php

$id = 123;
$t = "A Recipe From Web Recipe Manager";
$u = "http://localhost/wrm/display.php?public=yes&client=wrm&id={$id}";

echo '<script>function fbs_click() {$.post("public_recipe.php",{id:'.$id.'});window.open("http://www.facebook.com/sharer.php?u='.urlencode($u).'&t='.urlencode($t).'","sharer","toolbar=0,status=0,width=626,height=436");return false;}</script><style> html .fb_share_link { padding:2px 5px 0 20px; height:16px; float:right; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; margin-top: 9px; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u='.urlencode($u).'&t='.urlencode($t).'" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a><img id=help title="Page Help" src="images/small_help.png">';

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 7:05 pm
by barb woolums
Did that link works, not title see attachment

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 7:21 pm
by requinix
What's your code now?

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 7:45 pm
by barb woolums
$id is defined earlier

Code: Select all

$t = "A Recipe From Web Recipe Manager";
				$u = "http://localhost/wrm/display.php?public=yes&client=wrm&id=$id";
				echo '
				</div>
			   </td>
				<td id=content>';
				if (!$public) {
					echo '<script>function fbs_click() {$.post("public_recipe.php",{id:'.$id.'});window.open("http://www.facebook.com/sharer.php?u='.urlencode($u).'&t='.urlencode($t).'","sharer","toolbar=0,status=0,width=626,height=436");return false;}</script><style> html .fb_share_link { padding:2px 5px 0 20px; height:16px; float:right; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; margin-top: 9px; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u='.urlencode($u).'&t='.urlencode($t).'" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a><img id=help title="Page Help" src="images/small_help.png">';
				}

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 8:20 pm
by requinix
After some research I've done on your behalf it seems (1) share.php doesn't support a title and (2) share.php and/or sharer.php are deprecated and you should be using something else.

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 9:13 pm
by barb woolums
Ok thanks, need to find out what.

Re: Create static web page from dynamic content for sharing

Posted: Thu Jan 17, 2013 9:35 pm
by barb woolums
Looks like this is the new code, guess you now need a facebook app id

Code: Select all

https://www.facebook.com/dialog/feed?
  app_id=458358780877780&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=https://mighty-lowlands-6381.herokuapp.com/