Skip navigation
Currently Being Moderated

Building Social Networking Share Links/Buttons

Nov 2, 2011 8:48 AM

Tags: #java #dreamweaver #javascript #facebook #dreamweaver_cs5.5 #twitter #java_script #google+ #linkedin #social_networking

I am an amateur web designer / app builder and am very new at all of this, though I have learned quite a bit over the past couple of weeks.

 

As the title says, I am attempting to build Social Networking share links / buttons, particularly Facebook, Twitter, LinkedIn and Google+ (for a website, not an app).  I am using my own graphics for each button.

 

I have gone as far as purchasing the Social Media Tool Kit from WebAssist for $19.00 (USD), and much to my dissapointment, the script / extension isn't implemented as I wish it was.  It screws up the size of my table, it is difficult to edit, and I have no control over the javascript.  Technically, it gets the job done, but it doesn't seem very efficient, it isn't user friendly, and I have minimal amounts of control over it.  Additionally, the Google+ button hasn't shown up once, no matter what I try.

 

I have searched the web through and through and have found an abundant amount of free javascript for creating these links.  Sadly, most of these don't make any sense to me, nobody states where to insert the meta tags, and none of the code is explained.

 

Basically, I am looking for someone to help me build the code for these buttons.  I don't care which format it is in (know that I am developing in XHTML1.0 Transitional), as long as it is efficient and doesn't contain any unecessary code.  I need to be able to modify everything, particularly information such as that which shows up when you share on facebook (the URL, Image and Website information). 

 

So far it seems like the best way to do this is to have a javascript file, and have the share button related to that file.

 

If you post any code, please explain everything to me!

 

Any help anyone can give me will be greatly appreciated!!!  Thank you!!!!!

 
Replies
  • Currently Being Moderated
    Nov 2, 2011 8:58 AM   in reply to NicholasEZ

    Just to start off, some of these social buttons do not allow you to use custom images if you want the full functionality of the script (eg: counter).  And some, depending on what you want will require you reading up on the API documentation for each button and customizing the code to your liking.  I'm going to try to break your post down a bit to figure out what the root of your problem is and how to point you in the best direction.

     

    Sadly, most of these don't make any sense to me, nobody states where to insert the meta tags, and none of the code is explained.

     

    What doesn't make any sense?  I don't think any of these require editing meta tags so what are you referring to there?  Can you give us examples of what you would need explained that doesn't make sense to you?

     

    I don't care which format it is in (know that I am developing in XHTML1.0 Transitional),

     

    This won't make much difference in the end.  For instance --> <img ... /> for XHTML, <img ...> for HTML and a bunch of minor differences, in the end it's whatever your page is set to it can be easily programmed to.

     

    I need to be able to modify everything, particularly information such as that which shows up when you share on facebook (the URL, Image and Website information).

     

    Very possible and shouldn't be hard to implement.  What types of information are we talking about?  Is there a backend (eg: blog admin page) where you type the content where it should be generated or entered by the user?  To further expand, what are you trying to add this to: a cart, a blog, custom script?  The more details you can provide the better.

     

    So far it seems like the best way to do this is to have a javascript file,

     

    A lot of the buttons require javascript but most users have this turned on in their browser so it shouldn't be an issue.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 2, 2011 10:40 AM   in reply to NicholasEZ

    http://www.addthis.com/

     

     

     

    They have FREE social networking buttons, 100% customizable (you choose which buttons to leave out from their selection, and you can set the size from preset or (if you do a little twekaing) you can set to ANY sixe you want.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 2, 2011 11:34 AM   in reply to NicholasEZ

    Curtis may be a spammer.

     

    I have used a lot of WebAssist plugins for a while but I have not installed any at all into Dreamweaver 5.5. I kept getting frustrated with the way they want to do things for customization.

     

    Each of the social sites has its own API (Application Programming Interface) and wants you to do different things. For most of my clients, I'm simply putting a logo on the website and making that logo into a link thusly:

     

    <a href="http://www.facebook.com/pagecode" target="_blank"><img src="../images/IconFacebook.png" alt="Follow me on Facebook!" width="30" height="30" border="0" align="left" /></a> Follow Client on Facebook!</p>

    <p><a href="http://pagecode.blogspot.com/" target="_blank"><img src="../images/blog_logo.png" alt="Follow my Blog" width="30" height="30" align="left" /></a>Read Client's Blog!</p>

     

    I use honest-to-goodness logos for these that I searched for using Google: "logo Facebook," "logo Twitter," "logo Blogger" etc.

     

    Those logos are hosted in my /images folder on the various websites I manage.

     

    While I think it's handy to program to an API to get people to follow someone's Twitter or Facebook account, I have found that most people don't want to just follow someone, they want to see the actual information being released about the person or company first.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 2, 2011 11:51 AM   in reply to mhollis55

    Curtis E. Flush <------------NOT A SPAMMER.

     

     

    I use AddThis a lot. I don't work for them, I don't work for Adobe, I don't work for Facebook, I don't work for Twitter (don't even use it), I don't work for LinkedIn, StumpleUpon or any of the other social networking sites.

     

    I just think it's ridiculous to pay $19.95 for something (that isn't working) that's FREE somewhere else and may or may not work just as well without the expense.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 2, 2011 12:01 PM   in reply to Curtis_E_Flush

    My apologies, Curtis. The original poster said that the "Get the Code" button isn't working.

     

    As I stated, I am easing WebAssist out of my plugins; The last I used was CSS Menu Writer and, when I found it next to impossible to get an image-based drop-down menu to work, I went to Project 7. They also had a Google Maps plugin that would position an address on a Google Map, but was not as useful as Google's own iFrame-based method, so after one use of that, I quit using it.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 2, 2011 12:23 PM   in reply to NicholasEZ

    "And in regards to Twitter, I am not trying to get anyone to follow me on Twitter (I dont' have a twitter account either), I want a share button so somone can click on it, it brings them to their twitter page where they can then share my site."

     

    That's what AddThis will do.

     

    DId you try it in only one browser?

     

    I know that IE 8 on my netbook will not respond on their site. (can't get code - can't even preview the buttons), but Firefox will, and so will Opera.

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 3, 2011 4:10 PM   in reply to NicholasEZ

    jSocial is available for free from the Adobe Widget Exchange. 

    You'll need to log-in with your Widget Browser to get it

    http://labs.adobe.com/technologies/widgetbrowser/

     

    You can see the jSocial icons on top of this test page (only twitter is linked here)

    http://alt-web.com/GALLERY/Photo_Gallery.html

     

     

     

    Nancy O.

    Alt-Web Design & Publishing

    Web | Graphics | Print | Media  Specialists 

    http://alt-web.com/

    http://twitter.com/altweb

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 4, 2011 11:18 AM   in reply to NicholasEZ

    Oh, I missunderstood what you're after.

    Look at jQuery Share plug-ins

    http://plugins.jquery.com/plugin-tags/share

     

     

    Nancy O.

    Alt-Web Design & Publishing

    Web | Graphics | Print | Media  Specialists 

    http://alt-web.com/

    http://twitter.com/altweb

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points