Due to a number of questions on our Blog, Facebook and twitter this week we have put together some instructions for how to add both facebook and twitter badges to your website.
This can been done in two different ways: The first Option uses the images extra in the website builder, and the second uses the HTML extra that comes with the Advanced Design Tools upgrade. See which one best suits your needs.
Option 1: Using Images and Links
Step 1: Save the image you want to use into a folder on your computer.
Step 2: Log into the Website Builder and click on Images at the top of the toolbar under “Insert” tools.
Step 3: Once the image up loader pops up, click on browse to add the image from your files.
Step 4: When you see the image loaded into the Website Builder, “Right Click” on the image and you will see “Link” as the top option on the menu. Click on the “Link” option.
Step 5: Grab the URL (website address) you want to link the image too. Do this by going to the respective page (Facebook or Twitter) and copying the URL.
Step 6: Go back into the website builder and select the option “Link to another page on the web” and paste or type the URL into the text box and click ok.
Option 2: Pasting HTML
Step 1: Log in to your Facebook and twitter accounts to get the badge HTML code.
FB 1: Log into your account and open up your business Facebook page.
FB 2: Click on Edit Page and on the lower right side of the page click on the link “Get your Badge” or click here to go straight to the Facebook Badges page. On http://www.facebook.com/badges/, you can choose which type of badge you’d like to use . You’ll be prompted with what you’d like to use the HTML text for. Select “Other” and you’ll be provided the text to copy and paste into the website builder.
FB 3: Select the type of badge you want to create
FB 4: Customize the size and how you want it to look on your site.
FB 5: Click "Get Code" and copy the iframe code from the text box.
See step 2 for adding it to your site
T 1: Log into your twitter account
T 2: Click on the settings tab at the top of the page.
T 3: Once your settings page is open scroll down to the Footer where you will see the links specific to twitter like “About Us” “Contact”, the one you want to click on is “Goodies”. The Goodies (http://twitter.com/goodies) page will bring you to the twitter "Buttons and Widget Page".
T 4: Select the type of button for your website and you will then be prompted to select the actual image to display on the page. Select an image that you like best.
T 5: To get the HTML code for the button you need to click on the image and copy the HTML code displayed above the image.
It will look like this:
Now see step 2 to add it to your site.
Step 2: Adding the image to your site using the HTML Extra feature in the site builder
SB 2: Click on the “Extra” button then select the “Add HTML” feature
SB 3: Add the HTML code from Facebook or twitter into the text box by pasting it, then click done.
SB 4: This will bring the image onto your site and all you need to do now is place it where it looks best!
SB 5: Hit publish and your customers will be liking on Facebook and tweeting you on Twitter in no time!!
For people who have Advanced Design Tools (a website upgrade feature) you have the ability to add HTML using option 1 and 2. For people without Advanced Design Tools you can use option 1 or for a small fee upgrade to Advanced Design Tools