Adding Social Buttons to Header Position

[rtrdogs]

PrestaShop newbie here... as in less than a week!

 

I would like to add those small social media icons for Twitter, Facebook, Google+ and Pinterest to the top of my site (not the tweet this or like this type buttons on product pages. Just simple buttons at the top of the page for people to click through and be taken to the proper social media page).

 

I don't mind hard coding them, which I know isn't the best thing to do, but I have no clue which file to edit to put them in place. Ideally, the header position would be great because I'm not using the dollar or language modules that are in the header position.

 

Thanks in advance for your help!

[Paulito]

Good Morning,

 

To save you hard coding you could use this free html box HERE that you can hook into your header.

 

Hope this helps

 

Paul

[rtrdogs]

Thank you for your reply! I've been tinkering with this all weekend and I can't figure out how to get it to do what I need. I downloaded the module but it is putting the module in the upper left hand corner of the header position above where my site begins. I've included a picture.

 

I want the social media buttons to be directly above the search button on the right. This is where the currency and language blocks are showing up if I have them enabled (but I'm not going to have them enabled).

 

Basically, the module is showing the button but it's on a white background that spans the screen and my site actually begins below it. What am I doing wrong?

[newinprestashop]

Hallo.I'm not expert in prestashop but I had same problem regarding to social buttons in header side.Finally I solved the problem.It's not a big deal but everything it's easy when you know what you're doing right?.Two things:

1.Search and collect for free, this little nice social buttons and make sure they have the same size.They could be resized very easy with Adobe Photoshop and saved them like photos (png,gif whatever).After this via ftp upload them on the server side : public_html/img in my case.

2.You have to write a simple html code in order to link to them (to this images - social buttons).This code it's necessary to be added in a template which is also on the server side.In my case I modified blockuserinfo.tpl because I needed the social buttons to be in the right side of the header.Make sure to set force compile Yes and cache No during this process in the Preferences/Performance Tab (in back office) otherwise no changes are possible.When you finish make viceversa - very important.

Visit my site : http://www.sahjocurilogice.ro where you could see how looks this buttons and email me at [email protected] for more details if needed.This it's not for commercial purpose of course.

 

All the best

Edited November 26, 2012 by newinprestashop (see edit history)

[Ulka]

I have used the same HTML Box module and wanted to add all my social networks buttons to the top of my site. Instead of Header location, chose top. Then when you style your code make sure to add margins. It did the trick for me.

 

http://www.kupatea.com/teastore

[nadiap]

I have used the same HTML Box module and wanted to add all my social networks buttons to the top of my site. Instead of Header location, chose top. Then when you style your code make sure to add margins. It did the trick for me.

 

http://www.kupatea.com/teastore

 

I'm liking your shop layout Ulka - may I ask how you styled the search box on the top right side please ?

I'm very new (a couple of days to prestashop and taking notes of all the things I like on shops I see... I'm presuming it was via one of the css files?

[nadiap]

 

Visit my site : http://www.sahjocurilogice.ro where you could see how looks this buttons and email me at [email protected] for more details if needed.This it's not for commercial purpose of course.

 

 

Hi newinprestashop - I like the style of your shop too - did you just remove the right column altogether to just have 2 columns ?or is there a trick to removing the right column ?

As you can see I'm only new as well

[Ulka]

To nadiap - the search box was styled this way in a theme that i've installed. I did move it and changed the color with css. However if you want to remove certain blocks I believe you need to find a xml file for that part of the page and remove it from there. I did so with languages and sitemap.

Hope this helps.

[nadiap]

To nadiap - the search box was styled this way in a theme that i've installed. I did move it and changed the color with css. However if you want to remove certain blocks I believe you need to find a xml file for that part of the page and remove it from there. I did so with languages and sitemap.

Hope this helps.

 

Thank you for replying to me - I finally managed to get it all looking like I want it and fixed all the mixed up modules in the top header area.. I also changed the css to style the search box a little bit and move it's position. Now that I know these things are styled, I'll change it all a bit more tomorrow

[jahidulewu]

Dear nadip,

 

Can you shere how you solved the problem in here for new comer like me. It will help me as well as others also.

[vekia]

Dear nadip,

 

Can you shere how you solved the problem in here for new comer like me. It will help me as well as others also.

 

what kind of problem you've got? i will definitely try to help you