Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Drag to Share Functionality WordPress

  • SOLVED

Hi Experts,

I need assistance in hard coding this "drag to share" functionality into a wordpress theme. It needs to be part of a theme so it can't be a plugin. It will need to be hard coded into the functions.php file.

The plugin for this functionality already exists.
http://wordpress.org/extend/plugins/wp-dragtoshare-extended/

So again, I am looking to hard code this functionality into my theme, rather than have it be a plugin. Also, if possible, I would like to lose the linkedin sharing and only keep twitter, facebook, digg, and delicious. I would also like to have the drag to share functionality on post thumbnails rather than images within a post.

Thank you in advance for your help. I greatly appreciate it.

Answers (1)

2010-08-22

Pippin Williamson answers:

There's actually no reason you can't just embed the plugin into your theme's functions.php.

Do this:

First copy and paste the entire contents of the drag-to-share plugin directory into your theme's root folder.

Then open up wp-dragtoshare-extended.php and replace this


define('DTSE_ABS_URL', WP_CONTENT_URL.'/plugins/'.plugin_basename(dirname(__FILE__)).'/');
define('DTSE_REL_URL', dirname( plugin_basename(__FILE__) ));
define('DTSE_ABS_PATH', WP_PLUGIN_DIR . '/' . plugin_basename(dirname(__FILE__)).'/' );


with


define('DTSE_ABS_URL', WP_CONTENT_URL.'/themes/your-theme-folder-name-here/wp-dragtoshare-extended.php');
define('DTSE_REL_URL', WP_CONTENT_URL.'/themes/your-theme-folder-name-here/');
define('DTSE_ABS_PATH', WP_CONTENT_DIR . '/themes/your-theme-folder-name-here/' );


And now, copy everything after the first "<?php" and before the last "?>" from wp-dragtoshare-extended.php into your functions.php. And make sure that you paste it all before the last "?>" in functions.php.


WP_Designer comments:

Thanks You very much.

However this didn't quite work as planned. After I followed those steps and try o access the site I get the infamous "blank white screen". I checked and made sure there are no additional spaces after the closing ?>

I'm assuming something is not correct in the code?

Also, I need the code to be slightly more dynamic. If the user renames the theme folder before installing it, the code will break because it will be pointing to a theme that doesn't exist. Is it possible to use a variable instead of the actual theme name, that way it will always work even if they rename the theme?

Here is the code I am talking about that needs to be more dynamic:


define('DTSE_ABS_URL', WP_CONTENT_URL.'/themes/your-theme-folder-name-here/wp-dragtoshare-extended.php');

define('DTSE_REL_URL', WP_CONTENT_URL.'/themes/your-theme-folder-name-here/');

define('DTSE_ABS_PATH', WP_CONTENT_DIR . '/themes/your-theme-folder-name-here/' );





Pippin Williamson comments:

Ok, we can do a little better:



define('DTSE_ABS_URL', get_bloginfo('stylesheet_dir') . 'wp-dragtoshare-extended.php');

define('DTSE_REL_URL', get_bloginfo('stylesheet_dir')');

define('DTSE_ABS_PATH', get_bloginfo('stylesheet_dir')');


That should work in terms of the dynamics. Try it and see if you get a white screen still. Also, did you try loading up the admin dashboard? Most of the time the dashboard will give you an error message telling you where the syntax error is.


WP_Designer comments:

Hi There,

I am still getting the blank white screen. I have put all of the files for the plugin in another directory to help keep things organized. Perhaps I need to make another change elsewhere in the code?

Here are the 3 lines of code I replaced in wp-dragtoshare-extended.php:

define('DTSE_ABS_URL', get_bloginfo('stylesheet_dir') . 'functions/wp-dragtoshare-extended.php');
define('DTSE_REL_URL', get_bloginfo('stylesheet_dir')');
define('DTSE_ABS_PATH', get_bloginfo('stylesheet_dir')');



And in my functions.php file I am calling the PHP file like so:

require_once(TEMPLATEPATH . '/functions/wp-dragtoshare-extended.php');


Thanks again for your help. I'm sure we are very close.


Pippin Williamson comments:

Put your functions.php into this syntax checker: http://tools.sopili.net/php-syntax-check/

You should also check the plugin file.

Then paste the error here.


WP_Designer comments:

Hi,

I just ran both files through the checker. There were no syntax errors in the functions.php file.

There was one syntax error in wp-dragtoshare-extended.php. Here is the error:
Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING in CODE on line 30 Errors parsing CODE

define('DTSE_ABS_PATH', get_bloginfo('stylesheet_dir')');


Pippin Williamson comments:

Here we go:



define('DTSE_ABS_URL', get_bloginfo('stylesheet_dir') . 'functions/wp-dragtoshare-extended.php');

define('DTSE_REL_URL', get_bloginfo('stylesheet_dir'));

define('DTSE_ABS_PATH', get_bloginfo('stylesheet_dir'));



There were two excessive apostrophes.


WP_Designer comments:

ugh. Still get a blank white screen :(


WP_Designer comments:

I just realized we are calling the file within the file.

Example: We are calling wp-dragtoshare-extended.php within the wp-dragtoshare-extended.php file.

Is this valid?


Also, here is the functionality as regular HTML. Maybe this will be easier than the plugin to implement?

http://net.tutsplus.com/tutorials/javascript-ajax/drag-to-share/



Pippin Williamson comments:

That shouldn't be a problem because it's just setting up a variable to be used with the other files (I think).

The net.tuts article would be very easy to implement. It just depends on what you want the file product to achieve. Are you look for just drag-to-share functionality on the post images?


WP_Designer comments:

Yes. I would like the drag to share for post thumbnails. I am also thinking about adding a button at the bottom of every post that would also allow the user to drag and share. I would like facebook, twitter, linkedin, and delicious sharing (just like the plugin).

This functionality is very important for this project. If you can meet those requests I can bump up the prize money by $15.

Please let me know if you are able to help with this.

Thanks a lot.


Pippin Williamson comments:

Ok, yes, I can do this.

We'll do the net.tuts method.

First, download this file: http://nettuts.s3.amazonaws.com/467_dragtoShare/source/js/jquery-ui-1.7.2.custom.min.js

Put it in your theme folder inside of another folder called "js".

Next, add this to your functions.php.


function my_init()
{
if (!is_admin())
{
wp_enqueue_script('jquery');
wp_enqueue_script('jQuery-UI', get_bloginfo('template_url') . '/js/jquery-ui-1.7.2.custom.min.js', array('jquery'), '1.0', true);
}
}
add_action('init', 'my_init');


That will activate all of the appropriate jquery scripts.

Now you need to add a bit a jquery to your header with this:


function addJqueryToHeader() {
echo '
<script type="text/javascript">
//<![CDATA[
var $j = jQuery.noConflict();
jQuery(document).ready(function()
{
$j(function() {

var images = $j("#content img"),
title = $j("title").text() || document.title;

//make images draggable
images.draggable();
});
});
//]]>
';
}
add_action('wp_head', 'addJqueryToHeader');


Now you should be able to follow the net.tuts tutorial as though you were working with regular, plain html.


Pippin Williamson comments:

All CSS from the tutorial can be placed in your style.css


WP_Designer comments:

Ok. Thank you very much.

I need to run out and do a few errands.

I will be back online in about 2 hours at which point I will follow the instructions you outlined and continue with the tutorial.

I will bumo up the prize money and award the prize after I am through with the tutorial when I get back.

Talk soon.

Cheers.


WP_Designer comments:

Hi,

I've started on the tutorial, but its just too confusing for me. (sorry I am a designer and coding noob)

There's got to be a way to include the already created wordpress plugin into the theme. I have done this with a few other plugins already on this theme and they work without a hitch.

Do you, or does anyone else know how I can hardcode this plugin into my theme?
http://wordpress.org/extend/plugins/wp-dragtoshare-extended/

When you install the plugin normally it allows you to choose which social networks you want to use. I would like to enable Twitter, Facebook, Linkedin, and Delicious.

I need this functionality ASAP. If anyone out there can help me hardcode the plugin into my theme I would be very greatful. If you need a higher prize money please let me know and I will increase.


Pippin Williamson comments:

The method we were working on first will work. If you would be willing to give me admin access and FTP info, I'd be more than happy to do it for you for a total of $60.


WP_Designer comments:

Hi Pippin,

The site I'm working on is not on a web server yet. I'm using MAMP to develop the site locally.

Do you have a testing site you can use to get everything functioning properly and then I can drop in the code on my end?

I am willing to pay you the $60 if you can get everything working properly. Here is a recap of the functionality I would like:

- hard code the plugin into the theme. The sharing "buckets" should be Twitter, Facebook, Linkedin, Digg, and Delicious.
- I would like post thumbnails to be "draggable" as well as a button/image I will add to the bottom of every post that is "draggable" as well.


Pippin Williamson comments:

Yes, I have a server. Send me all of the theme files to [email protected]