Advertisement:

Author Topic: [Tip] Social Media Icons in Profile Field Tutorial  (Read 105267 times)

Offline PurpleCrow

  • Full Member
  • ***
  • Posts: 528
  • Gender: Female
    • Forums Galore
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #40 on: May 31, 2010, 07:52:29 AM »
This is great! Thanks for posting this :D
SMF 2.0 RC3

Looking for staff!

Forums Galore, a brand new Admin Forum is looking for staff to help with the launch. Send me a PM or sign up to Forums Galore if you're interested!

Add your forum to the Forums Galore Community Showcase

Offline ukhalik2

  • Full Member
  • ***
  • Posts: 458
  • Gender: Male
    • UltraUmair on Facebook
    • @UltraUmair on Twitter
    • Internet Magazine Blog
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #41 on: May 31, 2010, 03:31:48 PM »
woow, awesome,
thanks for sharing!

Offline IDunc

  • Jr. Member
  • **
  • Posts: 235
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #42 on: June 25, 2010, 09:42:21 PM »
Is there a way that users can choose a number from a selection dropdown thing, and that number converts to an image on the forum profile view? Like, have multiple images for one fields?


Offline lol222

  • Newbie
  • *
  • Posts: 3
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #43 on: June 28, 2010, 12:05:57 AM »
Looks nice.

Offline IDunc

  • Jr. Member
  • **
  • Posts: 235
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #44 on: June 29, 2010, 12:03:24 AM »
Is there a way that users can choose a number from a selection dropdown thing, and that number converts to an image on the forum profile view? Like, have multiple images for one fields?


Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #45 on: June 29, 2010, 12:59:12 AM »
Is there a way that users can choose a number from a selection dropdown thing, and that number converts to an image on the forum profile view? Like, have multiple images for one fields?
I am not sure what you mean...
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Offline IDunc

  • Jr. Member
  • **
  • Posts: 235
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #46 on: July 04, 2010, 11:54:39 PM »
Example:

A user goes to edit their Forum Profile. They come across a Call of Duty Prestige field. There are 10 options for this field: 1st prestige, 2nd prestige... up to 10th prestige.

Whichever the user chooses, it displays as that prestige's icon on the forum display. So, you have 10 different images for one field, which all depend on the users choice for that field.


Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #47 on: July 05, 2010, 12:08:17 AM »
Example:

A user goes to edit their Forum Profile. They come across a Call of Duty Prestige field. There are 10 options for this field: 1st prestige, 2nd prestige... up to 10th prestige.

Whichever the user chooses, it displays as that prestige's icon on the forum display. So, you have 10 different images for one field, which all depend on the users choice for that field.
Try this:

Code: [Select]
<img src="{DEFAULT_IMAGES_URL}/prestige/{INPUT}.gif" alt="{INPUT}" /></a>
Create a prestige folder, put all the prestige icons (all must be either gif or png files, you can't have both) replace .gif with .png if you are using png icons. Put the folder in the image folder of the default theme. Now name to 1st prestige in the select box (where 1st prestige is the name of the icon i.e.  1st prestige.png) There you go.
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Offline lucas-ruroken

  • SMF Hero
  • ******
  • Posts: 4,906
  • Gender: Male
  • Adk Developer
    • lucas.ruroken on Facebook
    • lucasruroken on GitHub
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #48 on: July 06, 2010, 12:30:52 PM »
Awsome ;)

Good work!
Adk Portal 3.1 is coming....

Design your universe!

Offline theSaRk

  • Semi-Newbie
  • *
  • Posts: 22
  • Gender: Male
    • Mucho más que un simple foro.
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #49 on: July 07, 2010, 06:24:43 AM »
This is great!
thanks!
[nofollow]

Offline arjem06

  • Newbie
  • *
  • Posts: 1
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #50 on: July 10, 2010, 06:44:49 AM »
Wow, that was a nice information that I got from this site. Hope the other people could visit this forum also so that they can get and give some ideas and great information. Who have a myspace account here, guys? Hope we can know one another much better, just visit my space account.

Offline PurpleCrow

  • Full Member
  • ***
  • Posts: 528
  • Gender: Female
    • Forums Galore
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #51 on: July 14, 2010, 12:47:55 PM »
Example:

A user goes to edit their Forum Profile. They come across a Call of Duty Prestige field. There are 10 options for this field: 1st prestige, 2nd prestige... up to 10th prestige.

Whichever the user chooses, it displays as that prestige's icon on the forum display. So, you have 10 different images for one field, which all depend on the users choice for that field.
Try this:

Code: [Select]
<img src="{DEFAULT_IMAGES_URL}/prestige/{INPUT}.gif" alt="{INPUT}" /></a>
Create a prestige folder, put all the prestige icons (all must be either gif or png files, you can't have both) replace .gif with .png if you are using png icons. Put the folder in the image folder of the default theme. Now name to 1st prestige in the select box (where 1st prestige is the name of the icon i.e.  1st prestige.png) There you go.

I've done this on my forum and it works great however, even with the "Show on Topic View" box checked it doesnt appear in the postbits... Any idea why?

Here's a link to a random post - http://itsahomething.com/forum/index.php/topic,3.msg4.html#new
SMF 2.0 RC3

Looking for staff!

Forums Galore, a brand new Admin Forum is looking for staff to help with the launch. Send me a PM or sign up to Forums Galore if you're interested!

Add your forum to the Forums Galore Community Showcase

Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #52 on: July 14, 2010, 01:16:49 PM »
Example:

A user goes to edit their Forum Profile. They come across a Call of Duty Prestige field. There are 10 options for this field: 1st prestige, 2nd prestige... up to 10th prestige.

Whichever the user chooses, it displays as that prestige's icon on the forum display. So, you have 10 different images for one field, which all depend on the users choice for that field.
Try this:

Code: [Select]
<img src="{DEFAULT_IMAGES_URL}/prestige/{INPUT}.gif" alt="{INPUT}" /></a>
Create a prestige folder, put all the prestige icons (all must be either gif or png files, you can't have both) replace .gif with .png if you are using png icons. Put the folder in the image folder of the default theme. Now name to 1st prestige in the select box (where 1st prestige is the name of the icon i.e.  1st prestige.png) There you go.

I've done this on my forum and it works great however, even with the "Show on Topic View" box checked it doesnt appear in the postbits... Any idea why?

Here's a link to a random post - http://itsahomething.com/forum/index.php/topic,3.msg4.html#new
What are you trying to show? I can see the moods there...
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Offline PurpleCrow

  • Full Member
  • ***
  • Posts: 528
  • Gender: Female
    • Forums Galore
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #53 on: July 14, 2010, 01:29:21 PM »
Sorry, should have removed my post - they just appeared!

Thanks again for the fantastic tip/trick!
SMF 2.0 RC3

Looking for staff!

Forums Galore, a brand new Admin Forum is looking for staff to help with the launch. Send me a PM or sign up to Forums Galore if you're interested!

Add your forum to the Forums Galore Community Showcase

Offline wizzard1

  • Semi-Newbie
  • *
  • Posts: 47
    • mmo-cataclysm
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #54 on: July 21, 2010, 07:40:23 AM »
tried it out for facebook but when i enter my facebook user name it doesnt come up
somehow you need to input something else there
is there anything to do about that ?

Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #55 on: July 25, 2010, 08:26:16 PM »
tried it out for facebook but when i enter my facebook user name it doesnt come up
somehow you need to input something else there
is there anything to do about that ?
Where doesn't it come up?

Did you tick the box:
Quote
Show on Topic View: (This is important if you want the icon to appear)
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Offline theguise

  • Semi-Newbie
  • *
  • Posts: 40
Sorry, wouldn't let me post this as a new topic. Another neat feature you can add in topic view profile fields for twitter is the ability to have the Twitter Hovercard appear when someone mouses over the twitter icon.  It's pretty easy to do this.

1. Register for an application on Twitter Developer at Twitter @Anywhere.

2. It will give you a code to use, but this is the one that you want to use for this feature.  Place it somewhere in your "index.template.php" file, but somewhere where the rest of the heading codes are.  Just remember to input your own developer id.
Code: [Select]
echo '
<script src="http://platform.twitter.com/anywhere.js?id=YOUR DEVELOPER ID&amp;v=1">
  </script>
 <script type="text/javascript">

  twttr.anywhere(function (T) {

    T(".section").hovercards({
      username: function(node) {
        return node.alt;
      }
    });

  });

</script>'

3.  Now create a profile field with icons, asking the user just to input their Twitter Username.  And for the "Show Enclosed Within Text" option place this image code.
Code: [Select]
<img class="section" src="http://PATH TO YOUR IMAGE/twitter.png" alt="@{INPUT}" width="18" height="18" />
You're finished.  Now, if one of your members inputs their Twitter Username in the applicable field when editing their profile or registering, you can place your cursor over the Twitter image in topic view and it will display their Twitter Hovercard, pretty neat feature.  I'm not allowed to attach images so you'll have to find your own twitter image, just remember to change the width and height values in your <img> statement.

Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #57 on: July 26, 2010, 03:07:18 PM »
Thank you for sharing. Will add in my first post.

Updated first post with Twitter Hovercard. :)
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Offline theguise

  • Semi-Newbie
  • *
  • Posts: 40
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #58 on: July 26, 2010, 04:33:18 PM »
oops forgot to add: When the twitter application process asks for your Callback URL I found it best to leave out the "www." It was giving me an error when I had originally input this, upon changing it to http://mysite.com it worked. 

P.S. you can delete this post after you read it, but just thought you may want to include it as a note possibly.

Offline ~DS~

  • SMF Hero
  • ******
  • Posts: 2,599
  • Gender: Male
Re: [Tip] Social Media Icons in Profile Field Tutorial
« Reply #59 on: July 26, 2010, 04:44:23 PM »
oops forgot to add: When the twitter application process asks for your Callback URL I found it best to leave out the "www." It was giving me an error when I had originally input this, upon changing it to http://mysite.com it worked. 

P.S. you can delete this post after you read it, but just thought you may want to include it as a note possibly.
Thanks. :)
I wonder what Application Website is...? The url of our forum or..?

And no I can't delete it, only the moderators can.
“There is no god, and that’s the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011