How to put the Social buttons next to the top menu ?

thomas
asked 10 years ago

Hey guys !
I really love your work but I was wondering if I can add the social button at the top of the page next to the menu ? Here is the website http://thestribune.16mb.com/ and I would like to put them next to "A propos"

Thank you guys !

Have a great day

3 Answers

DominicStaff
answered 10 years ago

Firstly, you can tell me detail about the social title that you want to display in the top of the page next to the menu.
Regards,

thomas
replied 10 years ago

I would like to put Facebook, Instagram and Tumblr Buttons. Thx

Allen
answered 10 years ago

There is a fast way to resolve that problem, that is hard code to the header.php:
You can open file header.php in the theme :
-> go to line 25 , change the class there : <div class="col-md-9"> to <div class="col-md-6">

and then you go to line 32 , after <?php endif; ?> , you push those code :

<ul class="social-links list-inline">
    <li class="facebook"><a href="https://www.facebook.com/'< your facebook >'" target="_blank"><i class="fa fa-facebook"></i></a></li>
    <li class="tumblr"><a href="https://'< your tumblr >'.tumblr.com/" target="_blank"><i class="fa fa-tumblr"></i></a></li>
    <li class="Instagram"><a href="https://instagram.com/`< your instagram >`" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>

hope this help 🙂

lou4lou
replied 10 years ago

thank you, but I’m unable to find the "<div class="col-md-9">" part in header.php 🙁

Allen
answered 10 years ago

@LM: oops, sorry , i mess up , wrong themes 🙂 that’s for DW-JASON 😀 , DW-time line theme don’t support icon for socials link , so you need to pick up the socials icon
and use this code in templates/header.php line 31 after </div> :

<div class="socials-link">
   <a href="https://www.facebook.com/'< your facebook >'"><img class="facebook" src="< your facebook image link >"/></a>
   <a href="https://'< your tumblr >'.tumblr.com/"><img class="tumblr" src="< your tumble image link >"></a>
   <a href="https://instagram.com/< your instagram"><img class="Instagram" src="< your instagram image link >"></a>
</div>

and in style.css file you add this code to resize images :

.socials-link img {
   width: 32px;
   height: 32px;
}