Social Media Icons and Positioning

Hi,

I am new to the social media tools and seek some help.

Can you tell me how to resize the icons (the default size seems rather small) and reposition them. The default seems to be a vertical line (see www.shad.org.uk) but I want them horizontal to the right hand side of my footer.

Thank you.

your page is missing the link to the js and css files for the social media buttons:


<link rel="stylesheet" type="text/css" href="webassist/social/wasocial.css"/>
<script type="text/javascript" src="webassist/social/wasocial.js"></script>



the placement of the buttons depends greatly on the container you place them in.

you have added the buttons to the side bar container which only offers a width of 180px, the buttons will not be able to expand horizontally past that width.

If you want the buttons to expand horizontally, you will need to place them in a container that allows enough space for that.

the icon sizes are set in the webassist/social/wasocial.css file, to adjust the sizes, you will need to adjust the CSS

Hi Jason,

Thank you.

I'm puzzled - I uploaded the complete WebAssist folder so can't understand why the css and js files are not there?! Should I upload again?

The icons have been placed in the left sidebar as that is the last place I was trying out.

I'm far from being a css expert and when I tried to place the icons in the footer a new div was auto created under the footer which is not what I wanted. Can you offer some pointers or direct me to where I might work out what to do?

Thanks again.

the code to attach the css and js is not on your page.

add the following code:

<link rel="stylesheet" type="text/css" href="webassist/social/wasocial.css"/>
<script type="text/javascript" src="webassist/social/wasocial.js"></script>

your footer does not contain an editable region.

if you want to add the social media buttons to the footer, you will need to update the template and add an edible region to the footer, the you will be able to add SMTK to the editable region in the footer.