• Gear
  • Shots
  • Photo Craft
  • Video
  • Wide Angle
  • Support
  • New Stuff
  • More
Support Legacy SmugMug Customization Facebook & Twitter logo

Need some help with your New SmugMug Site?

Dgrin Challenges

Our Challenges moderator has lined up an new set of challenges for you. The Weekly Word Challenge. Get all the details and participate in the conversation Weekly Word Challenge.

Past DSS Challenge Winners, DSS Challenge Rules, and other important DSS Challenge information is here.

Looking for a little challenge? The Dgrin Mini-Challenges are a great way to challenge yourself. Take a moment to look through past winners and find the current Mini Challenge here.

From Around the Net

Enjoy a few of our favorite articles from around the 'net. If you have something you think we should see, post it here and we'll have a look.

Journeys

Landscapes

Sports

 
Thread Tools Display Modes
Page 1  of  3
1 2 3
Old Mar-20-2010, 12:59 PM
#1
levelphoto is offline levelphoto OP
Big grins
Facebook & Twitter logo
Is it possible to add the facebook/twitter logo on the bottom of your homepage? What about a widget that pulls from your twitter feed?

Thanks,
Patrick

www.level-photography.com
Old Mar-21-2010, 01:12 PM
#2
photokandy is offline photokandy
Shutternut
photokandy's Avatar
You can add any social media icons you'd like -- at the core they are just images.

First, I'd find some icons you like (icondock.com has some nice freebies, but you have to provide a link back), then upload them to a gallery (any gallery will do, but usually somewhere in your Other category), and then put links to them in your Footer.

Something like this:

Code:
    <div id="myFooterSMI">
        <a href="http://www.twitter.com/yournickname"><img border=0 src="link_to_your_image"></a>
        <a href="http://www.facebook.com/yournickname"><img border=0 src="link_to_your_image"></a>    
        ...
    </div>
I like to group my icons together (hence the DIV), so that they appear in a nice little group. You can see an example of that on my site, or on our customization demo site (http://pksample.smugmug.com) -- but you can arrange them however you'd like with a touch of CSS. (Oh, just make sure to link to the original images, not some other size, otherwise you may end up with blurry icons!)

For a twitter widget you have to decide if you want it on just the hompage or on all pages. (Keep in mind that the widgets do slow loading times.) If just on the homepage, I'd drop the code for the widget in your Bio; if it should be on every page, put it in the bottom footer or the bottom javascript. You'll have to use some CSS no matter what to position it where you'd like, though.

If you get some icons loaded and still need some help with CSS, just holler, one of us around here on dgrin will be more than happy to help!
__________________
[FONT=Garamond]~ Kerri[/FONT], [FONT=Arial]photo[/FONT][FONT=Arial Black]Kandy[/FONT] Studios ( Facebook | Twitter )

Need customization services? View our packages or see our templates.

Note: I won't be offended if you edit my photo and repost it on dgrin -- I'm always open to new interpretations
and ideas, and any helpful hints, tips, and/or critiques are welcome. Just don't post the edit anywhere else
but dgrin, please.

My Gear List
Old Mar-22-2010, 06:59 PM
#3
levelphoto is offline levelphoto OP
Big grins
Thanks so much! Worked like a charm...I'm going to hold of for now on adding the widget I think.....

Patrick
Old Mar-23-2010, 02:24 AM
#4
HoofClix is offline HoofClix
HoofSational!
HoofClix's Avatar
Anyone know how I can get my Facebook badge in my footer to center? I'm not using the simple logo but the badge that they help autocreate.
__________________
Mark
www.HoofClix.com / Personal Facebook / Facebook Page
and I do believe its true.. that there are roads left in both of our shoes..
Old Mar-23-2010, 08:17 PM
#5
DeuceFour is offline DeuceFour
Livin' The Dream
DeuceFour's Avatar
Quote:
Originally Posted by HoofClix
Anyone know how I can get my Facebook badge in my footer to center? I'm not using the simple logo but the badge that they help autocreate.


Just use the center tags around the code you already have in there for the facebook badge:

<center>
**Facebook Script coding will be here**
</center>
__________________
BrandonPotterPhotography.com
Old Mar-24-2010, 05:56 PM
#6
HoofClix is offline HoofClix
HoofSational!
HoofClix's Avatar
Tanks!!
__________________
Mark
www.HoofClix.com / Personal Facebook / Facebook Page
and I do believe its true.. that there are roads left in both of our shoes..
Old Mar-25-2010, 12:34 AM
#7
SamirD is offline SamirD
Huntsville Car Scene.com
SamirD's Avatar
Another great service is Add This (www.addthis.com). It has every button you could possibly want, all in one place.
__________________
Pictures and Videos of the Huntsville Car Scene: www.huntsvillecarscene.com
Want faster uploading? Vote for FTP!
Old Aug-18-2011, 07:58 AM
#8
MartinRayVaughan is offline MartinRayVaughan
Big grins
Quote:
Originally Posted by photokandy View Post
You can add any social media icons you'd like -- at the core they are just images.

but you can arrange them however you'd like with a touch of CSS. (Oh, just make sure to link to the original images, not some other size, otherwise you may end up with blurry icons!)
How would you center this div in css? My code in html footer is as follows:

<div id="myFooterSMI"><a href="http://www.facebook.com/martinrayvaughan"><img src="http://www.tretowerfilms.com/fbblack.png" alt="" width="125" height="125" /></a><a href="http://www.twitter.com/MartinRVaughan"><img src="http://www.tretowerfilms.com/twitterblack.png" alt="" width="125" height="125" /></a><a href="mailto:martinrayvaughan@gmail.com/"><img src="http://www.tretowerfilms.com/emailblack.png" alt="" width="125" height="125" /></a> </div>

As you can see at http://martinrayvaughan.smugmug.com/ that it is not centered.

Thanks!
Old Aug-18-2011, 10:48 AM
#9
Russdawg is offline Russdawg
Big grins
Russdawg's Avatar
Is there a tutorial on adding the facebook and twitter buttons...

I see the the one post on it here but that wouldn't help me, need something more detailed.
I am an absolute beginner at code.

Thanks
__________________
Mark Russell
http://www.markrussellphotovideo.com
Old Aug-18-2011, 12:13 PM
#10
dancingdoberman is offline dancingdoberman
Big grins
Arranging badges horizontally on homepage
I just added a Facebook badge to my homepage, as well, but I noticed it's made a problem I have with organization all the worse. I've been trying to figure out how to arrange the badges on the bottom of my homepage horizontally, and have failed miserably. Can anyone tell me how to arrange these so they look nice in a horizontal line at the bottom of my page? Here's my site: http://jamienewell.smugmug.com/

Any advice is much appreciated!
Old Aug-18-2011, 07:42 PM
#11
Shanta is offline Shanta
Beginner grinner
Quote:
Originally Posted by dancingdoberman View Post
I just added a Facebook badge to my homepage, as well, but I noticed it's made a problem I have with organization all the worse. I've been trying to figure out how to arrange the badges on the bottom of my homepage horizontally, and have failed miserably. Can anyone tell me how to arrange these so they look nice in a horizontal line at the bottom of my page? Here's my site: http://jamienewell.smugmug.com/

Any advice is much appreciated!
Checked out your site, NICE! Love how you set up your pricing I struggle with that, I am new! ANy word o adding the FB yet? How did you do you price package info. did you had to do a gallery and add text, haven't been able to figure that out!

HELP

Shanta
www.trueexposurenc.com
__________________
Shanta (The New Girl)
Old Aug-18-2011, 09:10 PM
#12
dancingdoberman is offline dancingdoberman
Big grins
Hi, Shanta. I haven't heard back yet on how to arrange the badges at the bottom of my home page.

I put my site together basically gleaning information from this forum! I built it a while ago, and am no expert on CSS, so I don't specifically remember how I did some things. For my pricing pages, I know that they're "empty" galleries, and I write all the text in the "empty" page. (The photo source on the text page is actually located in an unlisted gallery that I link to.) I don't know if that helps or not. Haha I'm so rusty!
Old Nov-29-2011, 08:47 PM
#13
VMcdanielPhotography is offline VMcdanielPhotography
Big grins
Got icons but don't see the picture
Hello,

I was able to follow the post andd get the icons to appear on the bottom of my homepage but I want them on the actual footer and the icon pictures are only question marks and I would like it centered. How can I go about making these changes.

Veronica Preston of V.McDaniel Photography



Quote:
Originally Posted by photokandy View Post
You can add any social media icons you'd like -- at the core they are just images.

First, I'd find some icons you like (icondock.com has some nice freebies, but you have to provide a link back), then upload them to a gallery (any gallery will do, but usually somewhere in your Other category), and then put links to them in your Footer.

Something like this:

Code:
    <div id="myFooterSMI">
        <a href="http://www.twitter.com/yournickname"><img border=0 src="link_to_your_image"></a>
        <a href="http://www.facebook.com/yournickname"><img border=0 src="link_to_your_image"></a>    
        ...
    </div>
I like to group my icons together (hence the DIV), so that they appear in a nice little group. You can see an example of that on my site, or on our customization demo site (http://pksample.smugmug.com) -- but you can arrange them however you'd like with a touch of CSS. (Oh, just make sure to link to the original images, not some other size, otherwise you may end up with blurry icons!)

For a twitter widget you have to decide if you want it on just the hompage or on all pages. (Keep in mind that the widgets do slow loading times.) If just on the homepage, I'd drop the code for the widget in your Bio; if it should be on every page, put it in the bottom footer or the bottom javascript. You'll have to use some CSS no matter what to position it where you'd like, though.

If you get some icons loaded and still need some help with CSS, just holler, one of us around here on dgrin will be more than happy to help!
Old Jan-15-2012, 02:41 PM
#14
jasminenicole is offline jasminenicole
Beginner grinner
Help with Facebook button as well!
Hi!
It seems like everyone really knows what they are doing here! I really appreciated reading this string, only, I am still a little confused as to how to apply the same to my page. I have two specific images I would like to use for the links, and I just want them on my homepage, either on the top right somewhere, or off to the left vertically. I have saved the images in a gallery on my smugmug. I saw the code as to how to link to these pages, but how do I use these images as well as link to my respective twitter and facebook pages, while having them both located only on the homepage?
Thank you so much!
Old Apr-22-2012, 07:02 AM
#15
JenkinsC is offline JenkinsC
Baby Grinner
JenkinsC's Avatar
Moving Facebook Badge Up and Indenting on Homepage Only
I am using the code from Facebook for my Facebook Badge. Unfortunately, it's sitting too far down on my Homepage and too far to the left. Is there code that will bring it up (on the Homepage only) close to the bottom of my slideshow and align it with the left side of the slideshow? Here's the Facebook Badge code:

<!-- Facebook Badge START -->
<a href="https://www.facebook.com/pages/Carla...48760765193342" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;"</a><br/><a href="https://www.facebook.com/pages/Carla...48760765193342" target="_TOP" title="Carla Jenkins Photography"><img src="https://badge.facebook.com/badge/148....208624792.png" style="border: 0px; align=top" /></a><br/><a href="http://www.facebook.com/business/dashboard/" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none"</a>
<!-- Facebook Badge END -->

Thank you so much!

http://www.carlajenkinsphoto.com/
__________________
"When words become unclear, I shall focus with photographs. When images become inadequate, I shall be content with silence." ~Ansel Adams
Old Apr-22-2012, 07:10 AM
#16
Allen is offline Allen
"tweak 'til it squeaks"
Allen's Avatar
Quote:
Originally Posted by JenkinsC View Post
I am using the code from Facebook for my Facebook Badge. Unfortunately, it's sitting too far down on my Homepage and too far to the left. Is there code that will bring it up (on the Homepage only) close to the bottom of my slideshow and align it with the left side of the slideshow? Here's the Facebook Badge code:

<!-- Facebook Badge START -->
<a href="https://www.facebook.com/pages/Carla...48760765193342" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;"</a><br/><a href="https://www.facebook.com/pages/Carla...48760765193342" target="_TOP" title="Carla Jenkins Photography"><img src="https://badge.facebook.com/badge/148....208624792.png" style="border: 0px; align=top" /></a><br/><a href="http://www.facebook.com/business/dashboard/" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none"</a>
<!-- Facebook Badge END -->

Thank you so much!

http://www.carlajenkinsphoto.com/
First thing to do is set the slideshow height to something smaller then 900 in your biobox.

...
SM.flash.insertSlideshow(900, 600, ssConfig, 'transparent');
</script>
__________________
Al - Just a volunteer here having fun :D
My Website my Blog
Mozilla Firefox Web Developer Firebug
Customization FAQ Banner/Navbar/Slideshow Tutor
Old Apr-22-2012, 07:34 AM
#17
JenkinsC is offline JenkinsC
Baby Grinner
JenkinsC's Avatar
Quote:
Originally Posted by Allen View Post
First thing to do is set the slideshow height to something smaller then 900 in your biobox.

...
SM.flash.insertSlideshow(900, 600, ssConfig, 'transparent');
</script>

Done! Thanks, Again!! That definitely brought it up.
__________________
"When words become unclear, I shall focus with photographs. When images become inadequate, I shall be content with silence." ~Ansel Adams
Old Apr-28-2012, 03:00 PM
#18
lenapetersonphotography is offline lenapetersonphotography
Big grins
how do you get the code from addthis.com to center in the footer?

<center>
<!-- AddThis Button BEGIN -->
<p>Follow Me</p>
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_follow" addthis:userid="lenapetersonphotography"></a>
<a class="addthis_button_twitter_follow" addthis:userid="LenaPPhoto"></a>
<a class="addthis_button_flickr_follow" addthis:userid="lenaisloved"></a>
<a class="addthis_button_pinterest_follow" addthis:userid="lenapetersonphotography"></a>
<a class="addthis_button_rss_follow" addthis:url="http://www.lenapetersonphotography.blogspot.com"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f9c4f14292d25cd"></script>
<!-- AddThis Button END -->
</center>

doesn't work
Old May-01-2012, 03:33 PM
#19
Smug Eric is offline Smug Eric
Smug Hero
Smug Eric's Avatar
Add the code within a div, something like:

<div id=AddThisBox>
<!-- AddThis Button BEGIN -->
<p>Follow Me</p>
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_follow" addthis:userid="lenapetersonphotography"></a>
<a class="addthis_button_twitter_follow" addthis:userid="LenaPPhoto"></a>
<a class="addthis_button_flickr_follow" addthis:userid="lenaisloved"></a>
<a class="addthis_button_pinterest_follow" addthis:userid="lenapetersonphotography"></a>
<a class="addthis_button_rss_follow" addthis:url="http://www.lenapetersonphotography.blogspot.com"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f9c4f14292d25cd"></script>
<!-- AddThis Button END -->
</div>

Then in your CSS you can set the width and height for the box and center the div you created:

#AddThisBox {
margin: margin:0px auto;
height: XXpx;
width: XXpx;
}
__________________
Eric
Support Hero and Customeister
http://www.smugmug.com/help
Old May-21-2012, 06:10 PM
#20
Got Grins? is offline Got Grins?
Big grins
Got Grins?'s Avatar
I have tried this and cannot get it to center...is there any way I can get it up near the top navigation bar ???
__________________
Got Grins? :D
www.gotgrins.com
Page 1  of  3
1 2 3
Tell The World!  

Thread Tools
Display Modes

Posting Rules  
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump