Amazingly Simple and Beautiful. Brand spankin' new free SMF themes every month.

Tweet to Download for SMF

Mick in Tutorials
May 08, 2013

Allow your members to ?pay with a tweet?. Namely you take something that you would otherwise offer for free and make it available to your members only after they tweet about your website. It is a great way to promote your products and get noticed, and it doesn?t cost anything to your visitors.

We're going to implement this to the Download System

Demo: Alert box for announcements

[admin]Photo and Credit: Tutorialzine | Web Development Tutorials & Resources[/admin]

1. Download the ZIP Making a Simple Tweet to Download System | Tutorialzine
2. Create a folder called "tweet-download" in your current theme.
3. Extract all files from the 'assets' folder and load them to the new folder you created.

Let's get rid of some items we dont need...

1. In the tweet-download/css/styles.css remove everything except:
Code: [Select]
/*----------------------------
Download Button
-----------------------------*/


a.downloadButton{
display:inline-block;
width:187px;
height:69px;
text-indent:-99999px;
overflow:hidden;
background:url('../img/buttons.png') no-repeat;
cursor:default;
border:none;
text-decoration:none !important;
}

a.downloadButton.active{
background-position:left bottom;
cursor:pointer;
}

2. In the tweet-download/img folder, remove all images except the "buttons.png".

3. In the tweet-download/js folder, remove the script.js



Now let's open the /Themes/your_theme/index.template.php

Find:
Code: [Select]
	// Here comes the JavaScript bits!
echo '

Add after:
Code: [Select]
        <link rel="stylesheet" href="', $settings['theme_url'], '/tweet-download/css/styles.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
        <script type="text/javascript" src="', $settings['theme_url'], '/tweet-download/js/jquery.tweetAction.js"></script>



Now let's do one more thing, edit the downloads page...

Open /Themes/default/Downloads2.template.php

Find:
Code: [Select]
		// Show the main download
echo '
<tr class="windowbg2">
<td align="center">';

echo '<a href="' . $scripturl . '?action=downloads;sa=downfile&id=', $context['downloads_file']['ID_FILE'], '">', ($context['downloads_file']['fileurl'] == '' ? $context['downloads_file']['orginalfilename'] : $txt['downloads_app_download']), '</a>';

echo '
</td>
</tr>';

Replace with:
Code: [Select]
		// Show the main download
echo '
<tr class="windowbg2">
<td align="center">
        <p><a href="#" id="tweetLink">Tweet this</a> to activate the download button.</p><br />';

echo '<a href="javascript:void(0)" class="downloadButton">', ($context['downloads_file']['fileurl'] == '' ? $context['downloads_file']['orginalfilename'] : $txt['downloads_app_download']), '</a><br /><br />';

              echo '

<script type="text/javascript">
$(document).ready(function(){

// Using our tweetAction plugin. For a complete list with supported
// parameters, refer to http://dev.twitter.com/pages/intents#tweet-intent

$("#tweetLink").tweetAction({
text: "Download Professional SMF Themes. Free and Premium.",
url: "http://idesign360.com",
via: "idesign360",
related: "idesign360"
},function(){

// When the user closes the pop-up window:

$("a.downloadButton")
.addClass("active")
.attr("href", "' . $scripturl . '?action=downloads;sa=downfile&id=', $context['downloads_file']['ID_FILE'], '");

});

});
</script>';

echo '
</td>
</tr>';

Make sure you replace your own text and Twitter id.

That's it. Have fun.

Quote
But wait! This doesn?t work!

And you are entirely correct. As you can see from the code (and confirm from the demo), we assume that closing the popup window equals a published tweet. It does not.

As this is a cross domain interaction, there is no way to subscribe for when a tweet is actually published. The only way to do this would be to use Twitter?s more complex https://dev.twitter.com/docs/anywhere/welcome, but even then people could just hotlink to your file.

Does it even matter? The real purpose of this technique is to give people an incentive to tweet about your product/service, something that a lot of folks would love to do just for the feeling of receiving your ?members-only? download.

Tagged with: smf mods 2.0.4 plugin tweet 

Share This Post

Mick

Mick is an American theme designer for Simple Machines Forum software currently living in South Florida, USA. He runs idesignSMF and started tinkering with SMF in 2006 where he created several SMF forums of his own before he founded idesignSMF in 2009 to which he is dedicated full time and has a weakness for Tacos and Pizza.

    


2 Comments

Mick
May 08, 2013
It works as it should but throws errors in which i havent been able to correct.

[admin]8: Undefined index: downloads_file[/admin]


Im going to separate the php from the Javascript.
1

Mick
May 09, 2013
This tutorial is now fixed and works as it should  :wink:
2



Connect with us:


Improve SMF

If you wish to contribute to the development of SMF you can contribute to the coding discussions taking place on Github. You are also welcome to suggest features which you would like to see added to the software in the Feature Requests board.




go up