I really do like the Twitter follow button so I thought CC would be good with it.
Here are the files for actually creating it.
add_Follow_User
The database
Index file
Remove follow
session
css file
follow js
I take no credit what so ever. Posted it because its a great feature.
Here are the files for actually creating it.
add_Follow_User
Code:
<?php
include("session.php");
include("db.php");
if($_POST['user_id'])
{
$user_id=$_POST['user_id'];
$user_id = mysql_escape_String($user_id);
$sql_in = "INSERT into follow_user(uid_fk,user_id) values ('$uid','$user_id')";
mysql_query( $sql_in);
}
?>
The database
Code:
<?php
define('DB_SERVER', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', 'abhishek');
define('DB_DATABASE', 'test');
$connection = mysql_connect(DB_SERVER, DB_USERNAME, DB_PASSWORD) or die(mysql_error());
$database = mysql_select_db(DB_DATABASE) or die(mysql_error());
?>
Index file
Code:
<?php
include("session.php");
include("db.php");
?>
<html>
<head>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="follow.js"></script>
<link rel="stylesheet" type="text/css" href="wtfdiary.css" media="screen" />
<link rel="stylesheet" href="bootstrap.css">
<title>
Twitter Like Follow Button | WTFdiary.com
</title>
</head>
<body>
<h2>Twitter Like Follow Button (Php, jquery, Ajax)</h2>
<div style="margin-bottom:40px;">by <a href="http://www.wtfdiary.com">WTFdiary.com</a></div>
<?php
$command=mysql_query("SELECT * from users");
while($data=mysql_fetch_row($command))
{
$userid=$data[0];
?>
<div class="box">
<div class="picture"><img src="<?php echo $data[2];?>"></div>
<div class="user_data">
<div class="follow_box">
<?php
$follow_check="select * from follow_user WHERE uid_fk='$uid' and user_id='$userid' ";
$user_sql=mysql_query($follow_check);
$count=mysql_num_rows($user_sql);
if($count==0)
{
echo "<div id='follow$userid'><a href='' class='follow' id='$userid'><span class='btn' style='width:70px;'><b> Follow </b></span></a></div>";
echo"<div id='remove$userid' style='display:none'><a href='#' class='remove' id='$userid'><span class='btn btn-info' style='width:70px;'><b> Following </b></span></a></div>";
}
else
{
echo "<div id='follow$userid' style='display:none'><a href='' class='follow' id='$userid'><span class='btn' style='width:70px;'><b> Follow </b></span></a></div>";
echo"<div id='remove$userid'><a href='#' class='remove' id='$userid'><span class='btn btn-info' style='width:70px;'><b> Following </b></span></a></div>";
}
?>
</div>
<div><b><?php echo $data[1];?></b></div>
</div>
</div>
<?php
}
?>
<div class="info">We have used the <b>Twitter Bootstrap</b> css(stylesheet) to style the buttons Twitter like, you too can use the same or you can simply design your own buttons as per your requirement.</div><br/>
<div class="copy">© WTFdiary.com</div>
</body>
</html>
Remove follow
Code:
<?php
include("session.php");
include("db.php");
if($_POST['user_id'])
{
$user_id=$_POST['user_id'];
$user_id = mysql_escape_String($user_id);
$sql_in = mysql_query("DELETE from follow_user Where uid_fk='$uid' and user_id='$user_id'");
}
?>
session
Code:
<?php
//session_start();
//$uid=$_SESSION['user_id'];
$uid=4; // But right now we are using User Session ID static
?>
css file
Code:
body
{
padding:50px;
font-size:0.85em;
font-family:arial;
}
a
{
text-decoration:none;
color:#5d478b;
}
a:hover
{
text-decoration:underline;
}
.box
{
padding-left:5px;
padding-bottom:10px;
margin-top:10px;
width:400px;
overflow:auto;
}
.picture
{
float:left;
width:70px;
}
.user_data
{
margin-left:70px;
width:330px;
}
.follow_box
{
float:right;
}
.info
{
line-height:150%;
width:550px;
overflow:auto;
margin-top:30px;
}
.copy
{
color:#999999;
size:11px;
}
follow js
Code:
$(function() {
$(".follow").click(function()
{
var user_id = $(this).attr("id");
var datastring = 'user_id='+ user_id ;
$.ajax({
type: "POST",
url: "add_follow_user.php",
data: datastring,
success: function(html){}
});
$("#follow"+user_id).hide();
$("#remove"+user_id).show();
return false;
});
});
$(function()
{
$(".remove").click(function()
{
var user_id = $(this).attr("id");
var datastring = 'user_id='+ user_id ;
$.ajax({
type: "POST",
url: "remove_follow_user.php",
data: datastring,
success: function(html){}
});
$("#remove"+user_id).hide();
$("#follow"+user_id).show();
return false;
});
});
I take no credit what so ever. Posted it because its a great feature.