Tag Archives: facebook

socialmediaiconsblog

Blog Guide: How To Add Social Media Icons To Your Posts (Or Anywhere!)

I’ve recently been learning tons of new skills related blogging so I thought I’d try and share a few to help newer bloggers make their blogs shine.  Today I’ll be walking you through the steps to add social media icons, like the ones at the tops of my sidebars, to the bottom of your posts (or basically anywhere you want).

I’ve used the exact process I will teaching you to add some social media buttons to the bottom of this post, so scroll on down to check them out, and click through to see how they work.

Disclaimer: This guide is written for bloggers using WordPress.  If you’re using a different platform, the process should be similar, but let me know if you have any questions.

Step 1. Find your social media icons.

If you google ‘free social media icons’ you will find a ton of options.  I usually look through a list of a whole bunch of free ones until I find one that catches my eye.  This list has some nice options.  Download your icons of choice.

Step 2. Upload your icons to WordPress.

On your WordPress dashboard screen find ‘Media’ in the lefthand column, and then click ‘Add New’.  Use this screen to upload the social media icons you will be using.

Step 3. Find the url for your icons.

After they have uploaded, click on the individual icons to view their details.  In the box in the upper right hand corner you will find the ‘File URL’.  You will need this url for each individual icon so copy and paste them all into a word document or remember how to get back to this page.

fileurl

Step 4. Place HTML code into post (or sidebar or wherever).

Copy and paste code below wherever you want your icons to appear.  Make sure you replace the bold links with whatever is indicated, whether it is the url for your profile on that site or the icon url we found in step 3.

HTML CODE (replace bold text with your links):

<div><a href="fulltwitterurl"><img title="Twitter" src="twittericonurl" alt="Twitter" width="35" height="35" /></a><a href="fullpinteresturl"><img title="Pinterest" src="pinteresticonurl" alt="Pinterest" width="35" height="35" /></a><a href="><img title="Instagram" src="instagramiconurl" alt="Instagram" width="35" height="35" /></a><a href="fullfacebookurl"><img title="Facebook" src="facebookiconurl" alt="Facebook" width="35" height="35" /></a><a href="mailto:emailaddress"><img title="Email" src="emailiconurl" alt="Email" width="35" height="35" /></a><a href="fullbloglovinurl"><img title="Bloglovin" src="blogloviniconurl" alt="Bloglovin" width="35" height="35" />

This is an example of how the code for my twitter icon looks.  Make sure you include the full url for both your twitter and the icon.

<a href=”https://www.twitter.com/henryface_”><img title=”Twitter” src=”http://henryfacebeauty.files.wordpress.com/2014/04/twitter-48.png&#8221; alt=”Twitter” width=”35″ height=”35″ /></a>

You can also add additional versions of this code to include icons for RSS feeds, linkedin, etsy shops, pretty much anything you can find an icon for.  You could even create your own icons!

Here is what they code should look like after you paste it with your links.  Make sure you paste it in the ‘text’ tab, not ‘visual’.  After you paste it, switch back to visual and you should be able to see the icons.  If not, something has gone wrong.

htmlcode

I recommend copying and pasting the full code with your individual urls somewhere safe so you can easily find it whenever you want to add your icons somewhere.

So how did we do?  Were you able to follow along?  Any questions along the way?  Please feel free to leave them in the comments or email me using the mail icon below if you need some more personal help.  I would love to start sharing more blogging tips so let me know if this is something you guys are interested in!

 

TwitterPinterestInstagramFacebookEmailBloglovin

About these ads

Ipsy May 2014 Sneak Peek #4

wpid-img_103621793765736.jpeg

I’ve been waiting all day for this one.  Check out details for the fourth sneak peek revealed by ipsy for their May 2014 bag.

Don’t forget to check out the other three sneak peeks that have been revealed below!

May 2014 Sneak Peek #1

May 2014 Sneak Peek #2

May 2014 Sneak Peek #3

Also check out our current giveaway for an April ipsy bag!  Like us on facebook for an easy entry!

instagram :: twitter :: facebook :: pinterest :: email

ipsygiveawayfeature

Quick Ipsy Bag Giveaway!

I’ve been doing a bunch of planning for my upcoming giveaway to celebrate Seeking Subtle Glow reaching 10,000 views, and I’ve decided to do a mini giveaway on my Facebook page as a trial run.  Because I moved during the middle of the month, I had some confusion changing my address and I ended up receiving two April ipsy bags.  I am quite satisfied with what I received in my first bag so I thought this would be a great opportunity to share my second one with someone who maybe didn’t order in time this month or didn’t like the items they received.

So here’s how this is going to work:

1. Like my Facebook page for a super simple entry.  Everyone who likes my page will automatically be entered.

arrow

(There should a box in the column to the right of this post with a like button, so just can click that for an entry or check out the full page here.)

2. Share the Seeking Subtle Glow page with your followers on Facebook for a second entry.  Be sure to tag @SeekingSubtleGlow so I know you posted it.  There should be a share button at the bottom of this post, or feel free to create your own!

Each person can enter up to two times, once by each method listed above.  This giveaway will run until Wednesday May 7th at 10pm and the winner will be announced Thursday May 8th at 12pm.

Please let me know if you have any questions about the giveaway or the products included in the bag.  And check out some more photo’s of what you will receive below!

2014-05-03 22.38.32 ipsy giveaway

instagram :: twitter :: facebook :: pinterest :: email