close ad
Help us test the new Databridge BETA with MySQLi support
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Social Media Icons and Positioning

Thread began 1/25/2013 11:02 am by jakkimorgan303161 | Last modified 1/25/2013 12:06 pm by Jason Byrnes | 1147 views | 3 replies |

jakkimorgan303161

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.

Sign in to reply to this post

Jason ByrnesWebAssist

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

Sign in to reply to this post

jakkimorgan303161

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.

Sign in to reply to this post

Jason ByrnesWebAssist

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.

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...